#loader {
    display: flex; position: fixed; inset: 0; width: auto; height: auto;
    max-width: none; padding: 20px; box-sizing: border-box; transform: none;
    align-items: center; justify-content: center; z-index: 11000;
    background: rgba(31,49,38,.28); backdrop-filter: blur(3px);
    border: 0; border-radius: 0; box-shadow: none;
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease; cursor: progress;
}
#loader.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
.cp-loading-card {
    width: 340px; max-width: 100%; padding: 28px 24px; box-sizing: border-box;
    background: #fff; color: #294436; text-align: center; border-radius: 6px;
    border: 1px solid #dce2d5; box-shadow: 0 12px 40px rgba(24,40,30,.18);
}
.cp-loading-card strong { display: block; font-size: 21px; font-weight: 500; }
.cp-loading-card p { margin: 12px 0 0; color: #647264; font-size: 14px; line-height: 1.6; }
.cp-loading-spinner {
    display: block; width: 32px; height: 32px; margin: 0 auto 18px;
    border: 3px solid #edf1e4; border-top-color: #87a900; border-radius: 50%;
    animation: cp-loading-spin .85s linear infinite;
}
.cp-loading-card button { margin-top: 16px; padding: 8px 12px; border: 1px solid #d8dfca; border-radius: 4px; background: #f6f8f0; color: #526b13; cursor: pointer; }
.cp-loading-card button[hidden] { display: none; }
.cp-capture-success { padding: 12px 16px; border: 1px solid #d6e2bd; border-radius: 5px; background: #f4f8ec; color: #486020; }
@keyframes cp-loading-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #loader { transition: none; } .cp-loading-spinner { animation: none; border-top-color: #87a900; } }
