.mbl-builder {
  --mb-ink: #382b32;
  --mb-muted: #84737d;
  --mb-border: #eadbe2;
  --mb-soft: #fff5f8;
  --mb-pink: #c96587;
  --mb-pink-dark: #a94b6d;
  --mb-paper: #fffdfd;
  --mb-shadow: 0 14px 36px rgba(87, 43, 62, .09);
  color: var(--mb-ink);
  font: 500 13px/1.45 Manrope, system-ui, sans-serif;
  min-width: 0;
}
.mbl-builder *, .mbl-builder *::before, .mbl-builder *::after { box-sizing: border-box; }
.mbl-builder button, .mbl-builder input, .mbl-builder select, .mbl-builder textarea { font: inherit; }
.mbl-builder button { color: inherit; }
.mb-head {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 0 0 19px; margin-bottom: 18px; border-bottom: 1px solid var(--mb-border);
}
.mb-head-title { min-width: 0; }
.mb-kicker { margin: 0 0 5px; color: var(--mb-pink-dark); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.mb-head h1 { margin: 0; font: 600 clamp(29px, 3vw, 39px)/1 "Cormorant Garamond", Georgia, serif; letter-spacing: -.025em; }
.mb-head p { margin: 7px 0 0; color: var(--mb-muted); font-size: 12px; }
.mb-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.mb-btn {
  min-height: 40px; padding: 0 13px; border: 1px solid var(--mb-border); border-radius: 10px;
  background: var(--mb-paper); color: var(--mb-ink); cursor: pointer; font-size: 11px; font-weight: 750;
  transition: background .18s, transform .18s, border-color .18s, opacity .18s;
}
.mb-btn:hover:not(:disabled) { background: var(--mb-soft); border-color: #dcb9c7; transform: translateY(-1px); }
.mb-btn:focus-visible, .mbl-builder :focus-visible { outline: 3px solid rgba(201,101,135,.35); outline-offset: 2px; }
.mb-btn:disabled { cursor: wait; opacity: .52; transform: none; }
.mb-btn.primary { border-color: var(--mb-pink); background: var(--mb-pink); color: white; }
.mb-btn.primary:hover:not(:disabled) { background: var(--mb-pink-dark); }
.mb-btn.quiet { background: var(--mb-soft); border-color: transparent; }
.mb-btn.danger { color: #a34660; }
.mb-btn.small { min-height: 34px; padding: 0 10px; font-size: 10px; }
.mb-state-line { display:flex; align-items:center; gap:9px; min-height:30px; margin:-8px 0 13px; color:var(--mb-muted); font-size:11px; }
.mb-state-dot { width:7px;height:7px;border-radius:50%;background:#9d8992; }
.mb-state-line[data-state="dirty"] .mb-state-dot { background:#d79635; }
.mb-state-line[data-state="saved"] .mb-state-dot { background:#5e9b77; }
.mb-state-line[data-state="error"] { color:#a83d59; }
.mb-state-line[data-state="error"] .mb-state-dot { background:#bd4966; }
.mb-builder-grid { display:grid; grid-template-columns:minmax(205px, .78fr) minmax(360px, 1.65fr) minmax(255px, .92fr); gap:13px; align-items:stretch; min-height:690px; }
.mb-pane { min-width:0; overflow:hidden; border:1px solid var(--mb-border); border-radius:16px; background:var(--mb-paper); box-shadow:0 4px 16px rgba(75,42,56,.035); }
.mb-pane-head { min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px; border-bottom:1px solid var(--mb-border); background:linear-gradient(110deg,#fff9fb,#fff); }
.mb-pane-head h2 { margin:0; font:600 21px/1 "Cormorant Garamond",Georgia,serif; }
.mb-pane-head small { color:var(--mb-muted); font-size:10px; }
.mb-left-inner { padding:13px; }
.mb-field { display:grid; gap:6px; margin:0 0 12px; }
.mb-field label, .mb-label { color:#806e78; font-size:10px; font-weight:800; letter-spacing:.075em; text-transform:uppercase; }
.mb-field input,.mb-field select,.mb-field textarea,.mb-inline-input {
  width:100%; min-width:0; min-height:39px; padding:9px 10px; border:1px solid var(--mb-border); border-radius:9px;
  background:#fff; color:var(--mb-ink); font-size:12px;
}
.mb-field textarea { min-height:76px; resize:vertical; }
.mb-field input[type=color] { height:42px; padding:4px; }
.mb-field input[type=range] { padding:0; accent-color:var(--mb-pink); }
.mb-divider { height:1px; margin:14px 0; background:var(--mb-border); }
.mb-page-select { display:flex; gap:8px; align-items:center; }
.mb-page-select select { flex:1; min-height:44px; padding:8px 10px; border:1px solid var(--mb-border); border-radius:9px; background:#fff; color:var(--mb-ink); font-size:14px; }
.mb-pages-note { margin:0 0 14px; color:var(--mb-muted); font-size:10px; }
.mb-section-label { display:flex; justify-content:space-between; align-items:center; margin:16px 0 8px; font-size:10px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:#927d87; }
.mb-block-list { display:grid; gap:5px; }
.mb-block-row { display:grid; grid-template-columns:25px minmax(0,1fr) auto; align-items:center; gap:7px; min-height:39px; padding:4px 6px 4px 9px; border:1px solid transparent; border-radius:9px; background:#fff; cursor:pointer; }
.mb-block-row:hover { background:#fff7fa; }
.mb-block-row.is-selected { border-color:#e7b9ca; background:#fff3f7; box-shadow:inset 3px 0 var(--mb-pink); }
.mb-block-row.mb-drop-target { border-color:var(--mb-pink); background:#fff0f5; box-shadow:inset 0 3px var(--mb-pink); }
.mb-column-zone { margin:5px 0 8px 17px; padding:7px 8px; border:1px dashed #e8d5de; border-radius:10px; background:#fffbfc; }
.mb-column-zone:has(.mb-drop-target) { border-color:var(--mb-pink); background:#fff5f8; }
.mb-block-row.is-locked { cursor:default; }
.mb-block-row[draggable=true] { cursor:grab; }
.mb-grip { color:#ac99a2; font-size:16px; text-align:center; user-select:none; }
.mb-block-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; font-weight:700; }
.mb-block-type { display:block; color:var(--mb-muted); font-size:9px; font-weight:500; text-transform:capitalize; }
.mb-row-tools { display:flex; gap:2px; }
.mb-icon-btn { width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:#846f79;cursor:pointer;font-size:12px; }
.mb-icon-btn:hover:not(:disabled) { background:#f8e9ef; }
.mb-icon-btn:disabled { opacity:.35;cursor:not-allowed; }
.mb-palette { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.mb-palette-btn { min-height:44px; padding:7px 8px; display:flex;align-items:center;gap:8px;text-align:left;border:1px solid var(--mb-border);border-radius:9px;background:#fff;cursor:grab;font-size:10px;font-weight:700; }
.mb-palette-btn:hover { border-color:#dfaabd;background:#fff7fa; }
.mb-palette-icon { width:25px;height:25px;display:grid;place-items:center;border-radius:7px;background:var(--mb-soft);color:var(--mb-pink-dark);font-size:12px; }
.mb-center { display:flex; flex-direction:column; min-width:0; background:#f7f2f5; }
.mb-preview-toolbar { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 11px; border-bottom:1px solid var(--mb-border); background:#fff; }
.mb-preview-tools { display:flex; align-items:center; gap:5px; }
.mb-view-btn { min-height:31px; padding:0 9px; border:1px solid transparent; border-radius:7px; background:transparent; color:var(--mb-muted); cursor:pointer; font-size:10px; }
.mb-view-btn.active { border-color:#ecd7e0; background:#fff4f8;color:var(--mb-pink-dark); }
.mb-preview-shell { flex:1; min-height:600px; display:flex; justify-content:center; padding:18px 12px; overflow:auto; }
.mb-device { position:relative; flex:none; width:100%; max-width:100%; min-height:600px; overflow:hidden; transition:width .2s ease; }
.mb-iframe{transform-origin:top left;border:0!important}
.mb-device.tablet { width:min(768px,100%); }
.mb-device.mobile { width:min(390px,100%); }
.mb-iframe { width:100%; height:100%; min-height:650px; border:1px solid #e9dbe2; border-radius:9px; background:#fff; box-shadow:0 12px 38px rgba(69,44,57,.12); }
.mb-inspector { padding:14px; max-height:calc(100% - 54px); overflow:auto; }
.mb-inspector-empty { padding:22px 8px; text-align:center; color:var(--mb-muted); }
.mb-inspector-empty strong { display:block; margin-bottom:5px; color:var(--mb-ink); font:600 22px "Cormorant Garamond",Georgia,serif; }
.mb-inline-row { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mb-section-edit { margin:0 0 13px; padding:11px; border:1px solid #f0e4e9; border-radius:11px; background:#fffafb; }
.mb-section-edit h3 { margin:0 0 9px; font:600 17px "Cormorant Garamond",Georgia,serif; }
.mb-editable-field { padding:0 0 12px; margin:0 0 12px; border-bottom:1px solid #f1e8ec; }
.mb-editable-field:last-child { border-bottom:0; margin-bottom:0; }
.mb-image-picker { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:6px; }
.mb-photo-choice { min-height:65px;position:relative;overflow:hidden;border:2px solid transparent;border-radius:8px;background:#f8eef2;cursor:pointer; }
.mb-photo-choice img { display:block;width:100%;height:65px;object-fit:cover; }
.mb-photo-choice.is-active { border-color:var(--mb-pink); }
.mb-photo-choice.is-active::after { content:"Selected";position:absolute;inset:auto 0 0;padding:3px;background:rgba(169,75,109,.9);color:#fff;text-align:center;font-size:8px; }
.mb-photo-none { min-height:65px;display:grid;place-items:center;border:1px dashed #d9c5cf;border-radius:8px;color:var(--mb-muted);font-size:9px;cursor:pointer; }
.mb-photo-none.is-active { border:2px solid var(--mb-pink);color:var(--mb-pink-dark);background:#fff5f8; }
.mb-photo-upload-link { margin:8px 0; }
.mb-image-position { display:grid;gap:8px;margin-top:8px; }
.mb-image-position label { display:grid;grid-template-columns:1fr auto;gap:3px;color:var(--mb-muted);font-size:11px; }
.mb-image-position output { font-variant-numeric:tabular-nums; }
.mb-image-position input { grid-column:1/-1;width:100%;min-height:44px;padding:0;accent-color:var(--mb-pink);cursor:ew-resize; }
.mb-image-position input:focus-visible { outline:2px solid var(--mb-pink);outline-offset:2px; }
.mb-photo-library { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.mb-photo-card { overflow:hidden;border:1px solid var(--mb-border);border-radius:11px;background:#fff; }
.mb-photo-card img { width:100%;height:105px;object-fit:cover;display:block;background:#f8eef2; }
.mb-photo-card-body { padding:8px; }
.mb-photo-card-body .mb-field { margin-bottom:8px; }
.mb-upload { display:block;padding:14px;border:1px dashed #d9b7c6;border-radius:11px;background:#fff8fb;text-align:center;cursor:pointer; }
.mb-upload input { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0); }
.mb-upload strong { display:block;color:var(--mb-pink-dark);font-size:11px; }
.mb-upload span { display:block;margin-top:4px;color:var(--mb-muted);font-size:9px; }
.mb-tabbar { display:flex; gap:3px; padding:5px; border-bottom:1px solid var(--mb-border); background:#fff; }
.mb-tab { flex:1; min-height:36px;border:0;border-radius:8px;background:transparent;color:var(--mb-muted);cursor:pointer;font-size:10px;font-weight:750; }
.mb-tab.active { background:var(--mb-soft);color:var(--mb-pink-dark); }
.mb-toast { position:fixed;z-index:10001;right:22px;bottom:22px;max-width:min(380px,calc(100vw - 32px));padding:13px 16px;border:1px solid #e7cbd6;border-radius:12px;background:#fff;color:var(--mb-ink);box-shadow:var(--mb-shadow);font-size:12px; }
.mb-toast.error { border-color:#e3aebe;color:#983953; }
.mb-loading { min-height:330px;display:grid;align-content:center;gap:12px;padding:20px; }
.mb-skeleton { height:19px;border-radius:9px;background:linear-gradient(90deg,#f6eaf0,#fff8fb,#f6eaf0);background-size:200% 100%;animation:mb-sheen 1.3s infinite; }
.mb-skeleton:nth-child(2){width:74%}.mb-skeleton:nth-child(3){width:52%}
@keyframes mb-sheen { to { background-position:-200% 0; } }
.mb-status-badge { padding:5px 8px;border-radius:30px;background:#f1e8ec;color:#7d6873;font-size:9px;font-weight:800;white-space:nowrap; }
.mb-status-badge.live { color:#47755b;background:#e8f3eb; }
.mb-status-badge.unsaved { color:#94651f;background:#fbf1de; }
.mb-empty-library { padding:20px 10px;text-align:center;color:var(--mb-muted);font-size:11px; }
.mb-inline-check { display:flex;align-items:center;gap:8px;font-size:11px; }
.mb-inline-check input { accent-color:var(--mb-pink); }
.mb-field-help { margin:-2px 0 8px;color:var(--mb-muted);font-size:10px; }
.mb-block-actions { display:flex;gap:6px;flex-wrap:wrap;margin-top:12px; }
.mb-aria-live { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
@media(max-width:1100px) {
  .mb-builder-grid { grid-template-columns:minmax(190px,.75fr) minmax(300px,1.35fr); }
  .mb-right { grid-column:1/-1; }
  .mb-right .mb-inspector { max-height:none; }
}
@media(max-width:767px) {
  .mb-head { align-items:flex-start; flex-direction:column; }
  .mb-actions { width:100%; justify-content:flex-start; }
  .mb-actions .mb-btn { flex:1; }
  .mb-builder-grid { display:flex; flex-direction:column; min-height:0; }
  .mb-center { order:0; }
  .mb-preview-shell { min-height:480px;padding:10px 6px; }
  .mb-device,.mb-device.tablet,.mb-device.mobile { width:100%;min-height:480px; }
  .mb-iframe { min-height:520px; }
  .mb-left { order:1; }
  .mb-right { order:2; }
  .mb-left-inner,.mb-inspector { max-height:none; }
  .mb-pane-head { min-height:49px; }
  .mb-btn { min-height:44px; }
  .mb-view-btn { min-height:40px; }
  .mb-page-select select { font-size:16px; }
  .mb-palette-btn { min-height:48px;font-size:11px; }
  .mb-field input,.mb-field select,.mb-field textarea { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
  .mbl-builder *, .mbl-builder *::before, .mbl-builder *::after { animation:none!important;transition:none!important; }
}