.j3d-pixelate__widget { margin-top: 24px; }
.j3d-pixelate__status { min-height: 22px; margin: 12px 0; color: #5a6278; }
.j3d-pixelate__status.is-error, .j3d-pixelate__error { color: #a12622; }
.j3d-pixelate__error { min-height: 20px; }
.j3d-pixelate__file { overflow-wrap: anywhere; color: #4a5568; }
.j3d-pixelate__preview-wrap { margin: 24px 0; padding: 12px; background: repeating-conic-gradient(#f1f3f8 0 25%, #fff 0 50%) 0 / 24px 24px; border: 1px solid #dfe3ed; border-radius: 6px; }
.j3d-pixelate__preview-wrap canvas { display: block; width: 100%; height: min(62vw, 560px); min-height: 240px; background: transparent; image-rendering: pixelated; }
.j3d-pixelate__controls { display: flex; flex-wrap: wrap; gap: 20px 28px; align-items: end; }
.j3d-pixelate__controls > div:first-child { flex: 1 1 260px; }.j3d-pixelate__controls > div:last-child { flex: 1 1 180px; }
.j3d-pixelate__controls label, .j3d-pixelate__export label { display: block; margin-bottom: 7px; color: #4a5568; font-weight: 600; }
.j3d-pixelate__controls output, .j3d-pixelate__export output { float: right; color: #424cb9; }.j3d-pixelate__controls input[type=range], .j3d-pixelate__export input[type=range] { width: 100%; min-height: 30px; accent-color: #424cb9; }
.j3d-pixelate__controls input[type=number], .j3d-pixelate__export select { box-sizing: border-box; width: 100%; min-height: 44px; padding: 8px; border: 1px solid #ccd3e0; border-radius: 4px; }
.j3d-pixelate__compare, .j3d-pixelate__export, .j3d-pixelate__actions { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-top: 22px; }.j3d-pixelate__compare span { color: #7a8499; font-size: 13px; }
.j3d-pixelate__export label { margin: 0; }.j3d-pixelate__export select { width: 100px; }.j3d-pixelate__export input { flex: 1 1 130px; }.j3d-pixelate__export button, .j3d-pixelate__actions button, .j3d-pixelate__compare button { min-height: 44px; }
.j3d-pixelate__actions { border-top: 1px solid #eceef5; padding-top: 20px; }.j3d-pixelate__instructions { margin-top: 28px; }
@media (max-width: 640px) { .j3d-pixelate__preview-wrap canvas { height: 60vw; min-height: 200px; }.j3d-pixelate__export > * { flex: 1 1 100%; width: 100% !important; }.j3d-pixelate__actions button { flex: 1 1 100%; } }