/* Générateur « Dither & ASCII » — complément au CSS partagé des outils (gen-svg3d.css) */
.dz-field { aspect-ratio: 4 / 3; min-height: 260px; position: relative; cursor: crosshair; touch-action: none }
.dz-swatches { gap: .45rem }
.dz-swatch { display: inline-flex; align-items: center; gap: .45rem }
.dz-swatch .dz-dot { width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); flex: none }
.dz-swatch.dz-on { border-color: #7c5cff; color: #fff; background: #1c1930 }
#dz-text { font: inherit; padding: .5rem .65rem }
.dz-field canvas { image-rendering: pixelated }
/* une ligne de contrôle masquée doit le rester, même en flex (correction Owen : « Seconde encre » restait visible) */
.s3-inline[hidden] { display: none }
/* la galerie des looks, sous l'aperçu */
.dz-looks-wrap { margin-top: 1rem }
.dz-looks-title { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: #8b90a0; margin: 0 0 .55rem; font-weight: 600 }
.dz-looks { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem }
.dz-look { position: relative; aspect-ratio: 4 / 3; padding: 0; border: 1px solid rgba(128,128,160,.28); border-radius: 10px; overflow: hidden; background: #000; cursor: pointer; transition: border-color .15s }
.dz-look:hover, .dz-look:focus-visible { border-color: #7c5cff; outline: none }
.dz-look.dz-on { border-color: #7c5cff; box-shadow: 0 0 0 2px rgba(124,92,255,.45) }
.dz-look-field { position: absolute; inset: 0 }
.dz-look-field canvas { image-rendering: pixelated }
.dz-look-name { position: absolute; left: .5rem; bottom: .35rem; font-size: .72rem; font-weight: 600; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.9); pointer-events: none }
@media (max-width: 760px) { .dz-looks { grid-template-columns: repeat(2, 1fr) } }