.acmm{
  --navy:#182737;--ink:#17212b;--muted:#687685;--line:#d7dfe6;
  --bg:#f4f7fa;--white:#fff;--green:#edf7f0;--pink:#fbf0f7;--blue:#eff5fa;
  max-width:1180px;margin:2rem auto;border:1px solid var(--line);border-radius:18px;
  overflow:hidden;background:var(--bg);color:var(--ink);
  box-shadow:0 12px 34px rgba(22,38,52,.08);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
.acmm *{box-sizing:border-box}
.acmm-header{background:var(--navy);color:#fff;padding:25px 28px;display:flex;gap:20px;justify-content:space-between;align-items:flex-start}
.acmm-header h2{color:#fff;margin:.15rem 0 .35rem;font-size:clamp(1.55rem,3vw,2.3rem);line-height:1.1}
.acmm-header p{margin:0;opacity:.82}
.acmm-kicker{font-weight:900;letter-spacing:.14em;font-size:.76rem;opacity:.8}
.acmm-chip{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.07);border-radius:999px;padding:.55rem .8rem;white-space:nowrap;font-weight:800;font-size:.78rem}
.acmm-body{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.acmm-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}
.acmm-mix-card{grid-column:1/-1}
.acmm-step{position:absolute;right:17px;top:17px;width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:900}
.acmm-section-head{padding-right:42px;margin-bottom:1rem}
.acmm-section-head h3{margin:0;font-size:1.18rem}
.acmm-section-head p{margin:.25rem 0 0;color:var(--muted);font-size:.87rem}
.acmm-label{display:block;margin:.7rem 0 .3rem;color:var(--muted);font-size:.8rem;font-weight:800}
.acmm-input{width:100%;border:1px solid #cbd5df;border-radius:9px;background:#fff;padding:.7rem .8rem;color:var(--ink);font:inherit}
.acmm-input:focus{outline:3px solid rgba(75,130,170,.13);border-color:#78a3c3}
.acmm-input-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:12px}
.acmm-rgb{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.acmm-source-preview{display:flex;gap:12px;align-items:center;margin-top:14px}
.acmm-source-swatch{width:100px;height:58px;border-radius:9px;border:1px solid rgba(0,0,0,.18)}
.acmm-source-text{font-size:.9rem}
.acmm-btn{margin-top:15px;border:0;border-radius:9px;background:var(--navy);color:#fff;padding:.78rem 1rem;font-weight:900;cursor:pointer}
.acmm-btn:hover:not(:disabled){filter:brightness(1.08)}
.acmm-btn:disabled{opacity:.45;cursor:not-allowed}
.acmm-message,.acmm-mix-status{min-height:1.4em;margin-top:.7rem;color:var(--muted);font-size:.86rem}
.acmm-empty{border:1px dashed var(--line);border-radius:10px;padding:2rem;text-align:center;color:var(--muted)}
.acmm-pkl-swatch{min-height:180px;border:1px solid rgba(0,0,0,.28);border-radius:12px;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px}
.acmm-pkl-caption{font-size:.75rem;font-weight:900;letter-spacing:.05em}
.acmm-ref{font-size:1.55rem;line-height:1.15}
.acmm-row,.acmm-rgbhex{font-weight:800}
.acmm-dl{margin:14px 0 0}
.acmm-dl div{display:flex;justify-content:space-between;gap:20px;padding:.44rem 0;border-bottom:1px solid #edf1f4}
.acmm-dl dt{color:var(--muted)}
.acmm-dl dd{margin:0;font-weight:850;text-align:right}
.acmm-posthoc{margin-top:12px;padding:10px 12px;background:var(--blue);border-radius:8px;font-size:.8rem;color:var(--muted)}
.acmm-mix-intro{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.acmm-mix-intro>div{padding:12px;border-radius:10px;background:#f7f9fb;border:1px solid #e6ebef}
.acmm-mix-intro strong,.acmm-mix-intro span{display:block}
.acmm-mix-intro strong{font-size:.78rem;margin-bottom:.25rem}
.acmm-mix-intro span{font-size:.82rem;color:var(--muted)}
.acmm-warning{margin-top:12px;padding:11px 13px;background:#fff8e7;border:1px solid #ead8a6;border-radius:9px;font-size:.82rem}
.acmm-best{margin-top:15px;border:1px solid #cfe0d4;background:var(--green);border-radius:12px;overflow:hidden}
.acmm-best-title{display:flex;justify-content:space-between;gap:20px;padding:13px 15px;border-bottom:1px solid #d9e8dd}
.acmm-best-title span{font-weight:900}
.acmm-ingredient{display:flex;justify-content:space-between;gap:20px;padding:12px 15px}
.acmm-ingredient+.acmm-ingredient{border-top:1px solid rgba(0,0,0,.06)}
.acmm-top-details{margin-top:12px;border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.acmm-top-details summary{cursor:pointer;font-weight:850}
.acmm-top-row{display:grid;grid-template-columns:1.3fr 1fr;gap:15px;padding:9px 0;border-bottom:1px solid #edf1f4;font-size:.8rem}
.acmm-top-row>div:last-child{text-align:right}
.acmm-model-data{margin-top:12px}
.acmm-status-card{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.acmm-status-card>div{background:#fff;padding:12px 14px}
.acmm-status-card strong,.acmm-status-card span{display:block}
.acmm-status-card strong{font-size:.72rem;color:var(--muted);margin-bottom:3px}
.acmm-status-card span{font-size:.84rem;font-weight:850}
.acmm-footer{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:12px 20px;background:#edf2f5;border-top:1px solid var(--line);font-size:.74rem;color:var(--muted)}
@media(max-width:800px){
  .acmm-header{flex-direction:column}.acmm-body{grid-template-columns:1fr}.acmm-mix-card,.acmm-status-card{grid-column:auto}
  .acmm-input-grid,.acmm-mix-intro,.acmm-status-card{grid-template-columns:1fr}.acmm-top-row{grid-template-columns:1fr}
  .acmm-top-row>div:last-child{text-align:left}
}