:root{ --brand:#0f172a; --accent:#22c55e; --muted:#64748b; --border:#e2e8f0; --bg:#f8fafc; }
.mxexp-wrap{ font-family: 'Plus Jakarta Sans', system-ui, -apple-system, Segoe UI, Roboto, Arial; color:#0f172a; }
.mxexp-header{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:8px 0; }
.mxexp-brand{ display:flex; align-items:center; gap:.5rem; font-weight:700; }
.mxexp-brand .dot{ width:10px; height:10px; background:var(--accent); border-radius:50%; display:inline-block; }
.mxexp-tag{ color:var(--muted); font-size:.95rem; }
.mxexp-grid{ display:grid; grid-template-columns: 1fr; gap:1rem; }
@media(min-width: 960px){ .mxexp-grid{ grid-template-columns: 2fr 1fr; } }
.mxexp-card{ background:#fff; border:1px solid var(--border); border-radius:16px; padding:16px 18px; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.mxexp-h{ margin:4px 0 12px; }
.mxexp-form{ display:grid; gap:12px; }
.mxexp-rows{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.mxexp-actions{ display:flex; gap:10px; }
.mxexp-btn{ background:var(--brand); color:#fff; border:none; border-radius:12px; padding:10px 14px; font-weight:600; cursor:pointer; }
.mxexp-btn-secondary{ background:#334155; }
.mxexp-form input,.mxexp-form select{ width:100%; padding:10px 12px; border:1px solid #cbd5e1; border-radius:12px; font-size:1rem; }
.mxexp-results ol{ list-style:decimal inside; padding-left:0; }
.mxexp-step{ border-left:3px solid var(--border); padding:.5rem .75rem; margin:.35rem 0; }
.mxexp-side .mxexp-ad{ margin-top:12px; }
.mxexp-ad{ min-height:120px; border:1px dashed #cbd5e1; border-radius:12px; display:flex; align-items:center; justify-content:center; color:#64748b; background:#f1f5f9; }
.mxexp-list{ margin:0; padding-left:1.2rem; }
