:root{
  --mpu-bg:#f7f7f9;--mpu-card:#fff;--mpu-text:#111213;--mpu-sub:#6b7280;--mpu-border:#e5e7eb;
  --mpu-accent:#b48b57;--mpu-accent-2:#a27a49;--mpu-radius:16px;--mpu-radius-lg:20px;
  --mpu-shadow:0 10px 30px rgba(0,0,0,.06);--mpu-shadow-hover:0 16px 40px rgba(0,0,0,.10);
}
@media (prefers-color-scheme: dark){
  :root{--mpu-bg:#0f1115;--mpu-card:#131722;--mpu-text:#eef2ff;--mpu-sub:#a8b3cf;--mpu-border:#202534;
  --mpu-shadow:0 10px 30px rgba(0,0,0,.35);--mpu-shadow-hover:0 16px 40px rgba(0,0,0,.45);}
}
.mpu-wrapper{max-width:980px;margin:40px auto 60px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,"Helvetica Neue",Arial,sans-serif;color:var(--mpu-text);padding:0 16px}
.mpu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.mpu-brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.2px}
.mpu-brand-badge{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,var(--mpu-accent),var(--mpu-accent-2));box-shadow:inset 0 1px 0 rgba(255,255,255,.25),var(--mpu-shadow)}
.mpu-badge-text{font-size:18px}
.mpu-stepper{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,.2));border:1px solid var(--mpu-border);border-radius:var(--mpu-radius-lg);padding:8px;box-shadow:var(--mpu-shadow)}
.mpu-stepper .mpu-step-pill{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;border:1px solid transparent;background:rgba(255,255,255,.6);color:var(--mpu-sub);font-weight:700;transition:transform .12s ease,box-shadow .12s ease,background .12s ease}
.mpu-stepper .mpu-step-pill:hover{transform:translateY(-1px);box-shadow:var(--mpu-shadow)}
.mpu-stepper .mpu-step-pill.is-active{background:linear-gradient(145deg,#fff,rgba(255,255,255,.8));color:var(--mpu-text);border-color:var(--mpu-accent)}
.mpu-step{display:block;background:var(--mpu-card);border:1px solid var(--mpu-border);border-radius:var(--mpu-radius-lg);padding:22px;margin-top:16px;box-shadow:var(--mpu-shadow)}
.mpu-step h2{font-size:24px;margin:0 0 6px;letter-spacing:.2px}
.mpu-sub{color:var(--mpu-sub);margin-bottom:16px}
.mpu-drop{border:2px dashed var(--mpu-accent);padding:34px;text-align:center;border-radius:18px;background:rgba(255,255,255,.6);transition:background .12s ease,border-color .12s ease,transform .12s ease}
.mpu-drop.drag{background:rgba(180,139,87,.08);transform:translateY(-1px)}
#mpu-file{display:none}#mpu-browse{margin-left:6px}
.mpu-previews{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mpu-previews li{position:relative;border:1px solid var(--mpu-border);border-radius:16px;overflow:hidden;background:var(--mpu-card);box-shadow:var(--mpu-shadow)}
.mpu-previews img{width:100%;height:160px;object-fit:cover;display:block}
.mpu-remove{position:absolute;top:6px;right:6px;background:#111;color:#fff;border:none;padding:6px 8px;border-radius:10px;cursor:pointer;opacity:.9}
.mpu-grid-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.mpu-card{display:block;background:var(--mpu-card);border:1px solid var(--mpu-border);border-radius:18px;padding:14px;box-shadow:var(--mpu-shadow)}
.mpu-card-body{display:flex;gap:12px;justify-content:space-between;align-items:center}
.mpu-card-title{font-weight:800;letter-spacing:.3px}
.mpu-add{appearance:none;border:none;cursor:pointer;font-weight:800;letter-spacing:.3px;border-radius:10px;padding:8px 12px;background:linear-gradient(145deg,var(--mpu-accent),var(--mpu-accent-2));color:#fff;box-shadow:var(--mpu-shadow)}
.mpu-add.is-active{outline:2px solid var(--mpu-accent);box-shadow:var(--mpu-shadow-hover)}
.mpu-summary{margin-top:12px;padding:14px 16px;border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.4));border:1px solid var(--mpu-border);display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap}
.button,.button-primary{appearance:none;border:none;cursor:pointer;font-weight:800;letter-spacing:.3px;border-radius:12px;padding:12px 18px;transition:transform .08s ease,box-shadow .12s ease,background .12s ease}
.button{background:#e9edf3;color:#111}
.button-primary{background:linear-gradient(145deg,var(--mpu-accent),var(--mpu-accent-2));color:#fff;box-shadow:var(--mpu-shadow)}
.button:hover,.button-primary:hover{transform:translateY(-1px);box-shadow:var(--mpu-shadow-hover)}
.button[disabled],.button-primary[disabled]{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}
.mpu-notes{width:100%;border-radius:12px;border:1px solid var(--mpu-border);padding:12px;background:rgba(255,255,255,.7);color:var(--mpu-text)}
.mpu-actions{margin-top:16px;display:flex;gap:10px;justify-content:flex-end}
@media (max-width:900px){.mpu-previews{grid-template-columns:repeat(3,minmax(0,1fr))}.mpu-stepper{grid-template-columns:1fr}}
@media (max-width:640px){.mpu-previews{grid-template-columns:repeat(2,minmax(0,1fr))}.mpu-grid-services{grid-template-columns:1fr}.mpu-header{flex-direction:column;gap:10px;align-items:flex-start}}
