.mhpr{box-sizing:border-box;max-width:1100px;margin:20px auto;padding:20px;border:1px solid #d7dce3;border-radius:12px;background:#fff;color:#222;font-family:inherit}.mhpr *{box-sizing:border-box}.mhpr-heading h2{margin:0 0 6px}.mhpr-heading p{margin:0 0 18px}.mhpr-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:18px}.mhpr-controls button,.mhpr-upload{appearance:none;border:1px solid #bac2cc;border-radius:7px;padding:10px 13px;background:#f7f8fa;color:#202833;font-size:14px;font-weight:600;cursor:pointer;line-height:1.3}.mhpr-upload{background:#1769aa;color:white;border-color:#1769aa}.mhpr-upload input{display:none}.mhpr-controls button:disabled{opacity:.48;cursor:not-allowed}.mhpr-controls .mhpr-primary{background:#b8222b;color:#fff;border-color:#b8222b}.mhpr-controls .mhpr-download{background:#23813b;color:white;border-color:#23813b}.mhpr-brush{display:flex;align-items:center;gap:7px;font-size:14px}.mhpr-brush input{width:105px;accent-color:#b8222b}.mhpr-workspace{display:grid;grid-template-columns:1fr 1fr;gap:15px}.mhpr-panel{min-width:0}.mhpr-panel h3{font-size:16px;margin:0 0 8px}.mhpr-canvas-wrap,.mhpr-result-wrap{position:relative;min-height:220px;background:repeating-conic-gradient(#ececec 0% 25%,#fff 0% 50%) 50%/20px 20px;border:1px solid #d4d4d4;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center}.mhpr-canvas-wrap canvas,.mhpr-result-wrap canvas{display:block;max-width:100%;height:auto}.mhpr-canvas-wrap canvas[data-mask]{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.mhpr-empty{position:absolute;text-align:center;color:#555;background:#ffffffd9;padding:12px;border-radius:6px;pointer-events:none}.mhpr-status{font-weight:600;margin:16px 0 6px}.mhpr-status.mhpr-error{color:#a51d27}.mhpr-note{font-size:13px;color:#555;margin:0}@media(max-width:720px){.mhpr{padding:12px}.mhpr-workspace{grid-template-columns:1fr}.mhpr-controls{gap:7px}.mhpr-canvas-wrap,.mhpr-result-wrap{min-height:160px}}

/* v1.0.1: progress indicator beside Reset Photo */
.mhpr-progress{flex:1 1 240px;min-width:190px;max-width:480px;align-self:center;padding:1px 2px}
.mhpr-progress-label{font-size:12px;font-weight:600;color:#1769aa;margin-bottom:5px;line-height:1.3}
.mhpr-progress-track{height:12px;border:1px solid #b5cde3;border-radius:12px;overflow:hidden;background:#e8f1fa}
.mhpr-progress-fill{width:0;height:100%;border-radius:12px;background:#1976d2;transition:width .15s ease}
.mhpr-progress-active .mhpr-progress-fill{width:35%;animation:mhpr-progress-move 1.4s ease-in-out infinite;transition:none}
.mhpr-progress-done .mhpr-progress-fill{background:#23813b;animation:none}
.mhpr-progress-error .mhpr-progress-fill{width:100%!important;background:#b8222b;animation:none}
@keyframes mhpr-progress-move{0%{transform:translateX(-110%)}100%{transform:translateX(300%)}}
@media(prefers-reduced-motion:reduce){.mhpr-progress-active .mhpr-progress-fill{animation:mhpr-progress-pulse 1.4s ease-in-out infinite}@keyframes mhpr-progress-pulse{50%{opacity:.45}}}