@media screen {
    .certificate-app .ui-preview-image {
        cursor: zoom-in;
        object-fit: contain;
        background: repeating-conic-gradient(#f1f3f5 0% 25%, #fff 0% 50%) 50% / 18px 18px;
        border: 1px solid #d1d5db;
        border-radius: 10px;
    }
    .certificate-app .modal .ui-preview-image,
    .certificate-app #gerente-firma-preview .ui-preview-image {
        width: 100% !important;
        max-width: 100% !important;
        height: 200px !important;
        max-height: 300px !important;
        padding: 16px;
    }
    .certificate-app .table td .ui-preview-image {
        width: 140px !important;
        max-width: 100% !important;
        height: 96px !important;
        max-height: 140px !important;
        padding: 8px;
    }
    .certificate-app .ui-image-expand { display: block; margin: .5rem auto; font-size: .8rem; }
    .certificate-app .ui-selected-preview { margin-top: 1rem; padding: .85rem; border: 1px solid #d1d5db; border-radius: 10px; }
    .certificate-app .ui-selected-preview > p { font-size: .85rem; font-weight: 600; color: #374151; }
    .certificate-app .ui-image-unavailable { margin: .75rem 0; padding: .85rem; border: 1px dashed #cbd5e1; border-radius: 8px; color: #4b5563; font-size: .85rem; background: #f9fafb; }
    .certificate-app .ui-image-failed { display: none !important; }
    .certificate-app .ui-image-expand[hidden],
    .certificate-app .ui-image-unavailable[hidden] { display: none !important; }
    .certificate-app dialog.ui-image-viewer {
        width: min(1200px, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
        height: min(850px, calc(100dvh - 32px));
        max-height: calc(100dvh - 32px);
        padding: 0;
        border: 1px solid #d1d5db;
        border-radius: 14px;
        color: #111827;
        background: #fff;
        box-shadow: 0 24px 90px #11182740;
    }
    .certificate-app dialog.ui-image-viewer[open] { display: flex; flex-direction: column; }
    .ui-image-viewer::backdrop { background: #111827b3; }
    .ui-image-viewer header,
    .ui-image-viewer .ui-image-toolbar { display: flex; align-items: center; gap: .6rem; padding: .8rem 1rem; border-bottom: 1px solid #e5e7eb; flex-wrap: wrap; }
    .ui-image-viewer header { justify-content: space-between; }
    .ui-image-viewer .ui-image-title { overflow-wrap: anywhere; }
    .ui-image-viewer output { min-width: 65px; text-align: center; }
    .ui-image-viewer .ui-image-stage {
        flex: 1;
        min-height: 100px;
        overflow: auto;
        padding: 20px;
        background: repeating-conic-gradient(#e8eaed 0% 25%, #fff 0% 50%) 50% / 24px 24px;
    }
    .certificate-app dialog.ui-image-viewer .ui-image-stage img {
        display: block !important;
        max-width: none !important;
        max-height: none !important;
        height: auto !important;
        margin: auto;
        object-fit: contain;
    }
    .ui-image-viewer footer { padding: .65rem 1rem; color: #4b5563; font-size: .8rem; border-top: 1px solid #e5e7eb; }
}
@media screen and (max-width: 576px) {
    .certificate-app dialog.ui-image-viewer { width: calc(100vw - 12px); max-width: calc(100vw - 12px); height: calc(100dvh - 12px); max-height: calc(100dvh - 12px); }
    .ui-image-viewer header, .ui-image-viewer .ui-image-toolbar { padding: .6rem; gap: .35rem; }
    .certificate-app .ui-image-viewer .btn { padding: .5rem .65rem; }
}
@media print { .ui-image-expand, .ui-image-unavailable, .ui-image-viewer { display: none !important; } }