.cps-app{max-width:1100px;margin:20px auto;font-family:inherit}
.cps-title{font-size:24px;font-weight:700;margin-bottom:18px}
.cps-backgrounds{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}
.cps-card{border:2px solid #ddd;border-radius:12px;padding:8px;background:#fff;cursor:pointer;transition:.15s}
.cps-card:hover,.cps-card.selected{border-color:#2271b1;box-shadow:0 4px 16px rgba(0,0,0,.10)}
.cps-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;background:#f5f5f5}
.cps-card-name{text-align:center;font-weight:600;padding:9px 3px 4px}
.cps-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;margin-bottom:12px;background:#f5f5f5;border:1px solid #ddd;border-radius:10px}
.cps-toolbar button,.cps-control{font:inherit;border:1px solid #ccc;background:#fff;border-radius:7px;padding:7px 10px;cursor:pointer}
.cps-toolbar button:hover{background:#eee}
.cps-toolbar .active{background:#2271b1;color:#fff;border-color:#2271b1}
.cps-control{display:flex;align-items:center;gap:6px}
.cps-canvas-wrap{width:100%;overflow:hidden;background:#eee;border-radius:10px;line-height:0;text-align:center}
#cps-canvas{max-width:100%;height:auto;touch-action:none;display:block;margin:auto;cursor:crosshair}
.cps-download{font-weight:700!important}
@media(max-width:600px){
 .cps-backgrounds{grid-template-columns:repeat(2,1fr);gap:10px}
 .cps-toolbar{gap:6px;padding:8px}
 .cps-toolbar button,.cps-control{font-size:13px;padding:6px 8px}
 .cps-title{font-size:20px}
}