.acp-wrap{border:1px solid #e5e7eb;padding:16px;border-radius:12px;max-width:980px;margin:20px auto;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial}
.acp-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.acp-actions{margin-top:12px}
#acp-msg.bad{color:#b91c1c}
.acp-specs{margin-top:8px;color:#111;background:#f8fafc;border:1px dashed #cbd5e1;padding:8px;border-radius:8px;display:inline-block}
@media(max-width:720px){.acp-row{grid-template-columns:1fr}}
#acp-modal{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:99999}
.acp-modal-inner{background:#fff;padding:16px;border-radius:10px;min-width:320px}


.acp-palette{margin-top:8px}
.acp-pal-title{font-weight:600;margin:10px 0 6px}
.acp-swatches{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.acp-swatch{width:28px;height:28px;border-radius:4px;border:1px solid rgba(0,0,0,.1);position:relative;cursor:pointer}
.acp-swatch .badge{position:absolute;bottom:-8px;right:-2px;background:#111;color:#fff;font-size:9px;line-height:1;padding:1px 3px;border-radius:3px}
.acp-swatch.active{outline:2px solid #111;box-shadow:0 0 0 2px #fff inset}

.acp-preview{display:flex;align-items:center;gap:12px;margin:8px 0}
.acp-rope{width:360px;height:38px;border-radius:20px;overflow:hidden;background:#ddd;position:relative}
.acp-rope .seg{position:absolute;inset:0;background:repeating-linear-gradient(75deg,var(--c1) 0 18px, var(--c2) 18px 36px)}
.acp-serving{width:110px;height:30px;border-radius:6px;background:var(--serving,#0b6b3a)}