.ccmp-overlay{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.5);backdrop-filter:blur(6px)}
.ccmp-panel{width:min(960px,100%);max-height:calc(100dvh - 40px);display:flex;flex-direction:column;border:1px solid var(--wb-border);border-radius:18px;background:var(--wb-card-bg);color:var(--wb-text);box-shadow:var(--shadow);overflow:hidden}
.ccmp-panel header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;border-bottom:1px solid var(--wb-border)}
.ccmp-panel h2{margin:0;font-size:21px}.ccmp-panel header p{margin:7px 0 0;color:var(--wb-text-muted);font-size:13px}
.ccmp-panel button{border:1px solid var(--wb-border);border-radius:10px;background:var(--wb-input-bg);color:var(--wb-text);padding:10px 16px;font-weight:600;cursor:pointer}.ccmp-panel header button{font-size:24px;padding:3px 12px}
.ccmp-panel :is(button,select,summary):focus-visible{outline:2px solid var(--teal);outline-offset:3px}.ccmp-panel button:disabled{opacity:.5;cursor:default}
.ccmp-body{min-height:0;overflow:auto;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px;padding:20px}
.ccmp-preview{min-height:260px;max-height:510px;display:flex;align-items:center;justify-content:center;border:1px solid var(--wb-border);border-radius:12px;background:repeating-conic-gradient(var(--wb-card-soft) 0% 25%,var(--wb-card-bg) 0% 50%) 0 0/20px 20px;overflow:hidden;color:var(--wb-text-muted)}
.ccmp-preview img{display:block;max-width:100%;max-height:510px;object-fit:contain}.ccmp-preview img[hidden]{display:none}.ccmp-preview p{padding:20px;text-align:center}
.ccmp-settings{display:flex;flex-direction:column;gap:14px;min-width:0}.ccmp-settings label{display:grid;gap:7px;font-size:13px;font-weight:600;color:var(--wb-text-soft)}
.ccmp-settings select{width:100%;padding:10px;border:1px solid var(--wb-border);border-radius:9px;background:var(--wb-input-bg);color:var(--wb-text)}
.ccmp-settings summary{cursor:pointer;color:var(--wb-text-muted);font-size:13px}.ccmp-settings details label{margin-top:12px}
.ccmp-metrics{border-radius:10px;background:var(--wb-card-soft);color:var(--wb-text-soft);font-size:13px;line-height:1.6}.ccmp-metrics:not(:empty){padding:12px}.ccmp-metrics p{margin:4px 0}.ccmp-status{margin:0;color:var(--wb-text-muted);font-size:13px;line-height:1.6}
.ccmp-panel footer{display:flex;justify-content:flex-end;gap:10px;padding:16px 20px;border-top:1px solid var(--wb-border);flex:0 0 auto}.ccmp-panel footer .primary{width:auto;height:auto}
@media(max-width:640px){.ccmp-overlay{padding:10px}.ccmp-panel{max-height:calc(100dvh - 20px)}.ccmp-panel header{padding:14px}.ccmp-body{display:block;padding:12px}.ccmp-preview{min-height:150px;height:210px;margin-bottom:16px}.ccmp-preview img{max-height:210px}.ccmp-panel footer{padding:12px;gap:8px;flex-wrap:wrap}.ccmp-panel footer button{padding:10px 12px}.ccmp-panel footer .primary{flex:1}}