:root{
  --mhrsf-bg:#f8fafc;
  --mhrsf-card:#ffffff;
  --mhrsf-text:#0f172a;
  --mhrsf-muted:#64748b;
  --mhrsf-border:#e5e7eb;
  --mhrsf-primary:#2563eb;
  --mhrsf-shadow:0 10px 25px rgba(2,6,23,.06);
}

.mhrsf-wrap{ margin-top:10px; }

.mhrsf-app{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--mhrsf-text);
  background:var(--mhrsf-bg);
  border-radius:14px;
  padding:14px;
}

.mhrsf-app.is-dark{
  --mhrsf-bg:#0b1220;
  --mhrsf-card:#0f172a;
  --mhrsf-text:#e2e8f0;
  --mhrsf-muted:#94a3b8;
  --mhrsf-border:rgba(148,163,184,.18);
  --mhrsf-shadow:0 10px 25px rgba(0,0,0,.35);
}

.mhrsf-topbar{
  position: sticky;
  top: 32px;
  z-index: 9;
  background:var(--mhrsf-card);
  border:1px solid var(--mhrsf-border);
  box-shadow:var(--mhrsf-shadow);
  border-radius:14px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.mhrsf-brand{ display:flex; align-items:center; gap:12px; }
.mhrsf-logo{
  width:40px; height:40px;
  border-radius:12px;
  background:linear-gradient(135deg,var(--mhrsf-primary), #22c55e);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:900;
}
.mhrsf-title{ font-size:15px; font-weight:900; line-height:1.1; }
.mhrsf-sub{ font-size:12px; color:var(--mhrsf-muted); margin-top:2px; }

.mhrsf-top-actions{ display:flex; align-items:center; gap:10px; }

.mhrsf-grid{
  display:grid;
  grid-template-columns: 1fr 360px;
  gap:14px;
  margin-top:14px;
}

.mhrsf-main,.mhrsf-side{
  background:var(--mhrsf-card);
  border:1px solid var(--mhrsf-border);
  border-radius:14px;
  box-shadow:var(--mhrsf-shadow);
  overflow:hidden;
}

.mhrsf-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-bottom:1px solid var(--mhrsf-border);
  background:rgba(100,116,139,.06);
}
.mhrsf-toolbar-left,.mhrsf-toolbar-right{ display:flex; align-items:center; gap:8px; }
.mhrsf-sep{ width:1px; height:22px; background:var(--mhrsf-border); margin:0 4px; }

.mhrsf-ibtn{
  min-width:38px; height:34px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  cursor:pointer;
  font-weight:800;
  color:var(--mhrsf-text);
}
.mhrsf-ibtn:hover{ border-color:rgba(37,99,235,.55); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.mhrsf-select{
  height:34px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  color:var(--mhrsf-text);
  padding:0 10px;
}

.mhrsf-editor-shell{ padding:12px; }
.mhrsf-editor{
  min-height:460px;
  border:1px solid var(--mhrsf-border);
  border-radius:12px;
  background:var(--mhrsf-card);
}

/* Quill tweaks */
.mhrsf-app .ql-toolbar{ display:none; }
.mhrsf-app .ql-container{
  border:none !important;
  font-size:15px;
  line-height:1.65;
}
.mhrsf-app .ql-editor{
  padding:14px;
}
.mhrsf-app.is-dark .ql-editor{ color:var(--mhrsf-text); }
.mhrsf-app.is-dark .ql-editor.ql-blank::before{ color:rgba(148,163,184,.7); }

/* Sidebar */
.mhrsf-side-inner{ padding:12px; }
.mhrsf-acc{
  border:1px solid var(--mhrsf-border);
  border-radius:12px;
  background:var(--mhrsf-card);
  margin-bottom:12px;
  overflow:hidden;
}
.mhrsf-acc summary{
  cursor:pointer;
  padding:10px 12px;
  font-weight:900;
  list-style:none;
}
.mhrsf-acc summary::-webkit-details-marker{ display:none; }
.mhrsf-acc-body{ padding:12px; border-top:1px solid var(--mhrsf-border); }

.mhrsf-kv{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:6px 0;
  font-size:13px;
  color:var(--mhrsf-muted);
}
.mhrsf-kv b{ color:var(--mhrsf-text); font-size:14px; }
.mhrsf-kv b.ok{ color:#16a34a; }
.mhrsf-kv b.bad{ color:#f59e0b; }

.mhrsf-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; }

.mhrsf-label{ font-size:12px; color:var(--mhrsf-muted); display:block; margin-bottom:6px; font-weight:700; }
.mhrsf-input{
  width:100%;
  height:36px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  color:var(--mhrsf-text);
  padding:0 10px;
}

.mhrsf-check{ display:flex; align-items:center; gap:8px; color:var(--mhrsf-muted); font-weight:700; font-size:12px; }

.mhrsf-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.mhrsf-tag{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--mhrsf-border);
  background:rgba(37,99,235,.08);
  font-size:12px;
  color:var(--mhrsf-text);
}

.mhrsf-note{
  margin-top:12px;
  font-size:12px;
  color:var(--mhrsf-muted);
  padding:10px 12px;
  border:1px dashed var(--mhrsf-border);
  border-radius:12px;
}

/* Buttons */
.mhrsf-btn{
  height:36px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  color:var(--mhrsf-text);
  font-weight:800;
  cursor:pointer;
}
.mhrsf-btn:hover{ border-color:rgba(37,99,235,.55); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.mhrsf-btn.primary{
  background:var(--mhrsf-primary);
  border-color:var(--mhrsf-primary);
  color:#fff;
}
.mhrsf-btn.primary:hover{ box-shadow:0 0 0 3px rgba(37,99,235,.2); }

/* Status bar */
.mhrsf-statusbar{
  margin-top:14px;
  background:var(--mhrsf-card);
  border:1px solid var(--mhrsf-border);
  border-radius:14px;
  padding:10px 14px;
  display:flex;
  align-items:center;
  gap:14px;
  box-shadow:var(--mhrsf-shadow);
}
.mhrsf-right{ margin-left:auto; color:var(--mhrsf-muted); }

.mhrsf-pill{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--mhrsf-border);
  font-size:12px;
  font-weight:800;
}
.mhrsf-pill.ok{ background:rgba(34,197,94,.10); }
.mhrsf-pill.bad{ background:rgba(245,158,11,.12); }

/* Toast */
.mhrsf-toast{
  position:fixed;
  right:18px;
  bottom:18px;
  background:var(--mhrsf-card);
  border:1px solid var(--mhrsf-border);
  box-shadow:var(--mhrsf-shadow);
  border-radius:12px;
  padding:10px 12px;
  font-weight:800;
  opacity:0;
  transform:translateY(10px);
  transition:all .18s ease;
  pointer-events:none;
}
.mhrsf-toast.show{
  opacity:1;
  transform:translateY(0);
}

/* Toggle switch */
.mhrsf-switch{ position:relative; display:inline-block; width:44px; height:24px; }
.mhrsf-switch input{ opacity:0; width:0; height:0; }
.mhrsf-slider{
  position:absolute; cursor:pointer;
  top:0; left:0; right:0; bottom:0;
  background:rgba(100,116,139,.35);
  transition:.2s; border-radius:999px;
  border:1px solid var(--mhrsf-border);
}
.mhrsf-slider:before{
  position:absolute; content:"";
  height:18px; width:18px; left:3px; top:2px;
  background:var(--mhrsf-card);
  transition:.2s; border-radius:999px;
  border:1px solid var(--mhrsf-border);
}
.mhrsf-switch input:checked + .mhrsf-slider{
  background:rgba(37,99,235,.5);
}
.mhrsf-switch input:checked + .mhrsf-slider:before{
  transform:translateX(20px);
}

@media (max-width: 1200px){
  .mhrsf-grid{ grid-template-columns: 1fr; }
}


/* Font selection (applies to editor) */
.mhrsf-app[data-font="inter"] .ql-editor { font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.mhrsf-app[data-font="poppins"] .ql-editor { font-family: Poppins, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.mhrsf-app[data-font="roboto"] .ql-editor { font-family: Roboto, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.mhrsf-app[data-font="georgia"] .ql-editor { font-family: Georgia, "Times New Roman", serif; }
.mhrsf-app[data-font="mono"] .ql-editor { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }

/* Font size */
.mhrsf-app[data-fontsize="14px"] .ql-editor { font-size:14px; }
.mhrsf-app[data-fontsize="15px"] .ql-editor { font-size:15px; }
.mhrsf-app[data-fontsize="16px"] .ql-editor { font-size:16px; }
.mhrsf-app[data-fontsize="18px"] .ql-editor { font-size:18px; }
.mhrsf-app[data-fontsize="20px"] .ql-editor { font-size:20px; }

/* Bullet styling */
.mhrsf-app[data-bullet="disc"] .ql-editor ul { list-style-type: disc; }
.mhrsf-app[data-bullet="circle"] .ql-editor ul { list-style-type: circle; }
.mhrsf-app[data-bullet="square"] .ql-editor ul { list-style-type: square; }
.mhrsf-app[data-bullet="dash"] .ql-editor ul { list-style: none; padding-left: 1.3em; }
.mhrsf-app[data-bullet="dash"] .ql-editor ul > li { position: relative; }
.mhrsf-app[data-bullet="dash"] .ql-editor ul > li::before {
  content: "–";
  position: absolute;
  left: -1.1em;
  top: 0;
  color: currentColor;
  font-weight: 800;
}

/* Compact selects */
.mhrsf-select.compact{ width: 130px; }

/* Textarea */
.mhrsf-textarea{
  width:100%;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  color:var(--mhrsf-text);
  padding:10px;
  resize: vertical;
  font-size:13px;
  line-height:1.5;
}

/* Template button active */
[data-tpl].is-active{
  border-color: rgba(37,99,235,.8) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}


/* ===== Premium additions v1.2.0 ===== */

/* Mode chips */
.mhrsf-mode{ display:flex; align-items:center; gap:8px; }
.mhrsf-mode-label{ font-size:12px; color:var(--mhrsf-muted); font-weight:900; }
.mhrsf-chip{
  height:30px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  color:var(--mhrsf-text);
  font-weight:900;
  cursor:pointer;
}
.mhrsf-chip.is-active{
  border-color: rgba(37,99,235,.85);
  box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

/* Small controls */
.mhrsf-btn.small{ height:32px; padding:0 10px; font-size:12px; }
.mhrsf-input.small{ height:32px; font-size:12px; padding:0 10px; }

/* List */
.mhrsf-list{ margin-top:10px; display:flex; flex-direction:column; gap:10px; }
.mhrsf-item{
  display:flex;
  gap:10px;
  align-items:flex-start;
  justify-content:space-between;
  border:1px solid var(--mhrsf-border);
  background:rgba(100,116,139,.06);
  border-radius:12px;
  padding:10px;
}
.mhrsf-item-title{ font-weight:900; font-size:13px; }
.mhrsf-item-sub{ color:var(--mhrsf-muted); font-size:12px; margin-top:4px; }
.mhrsf-item-actions{ display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.mhrsf-mini{
  height:28px;
  padding:0 10px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  color:var(--mhrsf-text);
  font-weight:900;
  cursor:pointer;
  font-size:12px;
}
.mhrsf-mini:hover{ border-color:rgba(37,99,235,.55); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.mhrsf-mini.danger, .mhrsf-btn.danger{
  border-color: rgba(239,68,68,.35);
}
.mhrsf-btn.danger:hover, .mhrsf-mini.danger:hover{
  border-color: rgba(239,68,68,.65);
  box-shadow:0 0 0 3px rgba(239,68,68,.14);
}
.mhrsf-empty{ color:var(--mhrsf-muted); font-weight:800; font-size:12px; padding:6px 2px; }

/* Emoji popover */
.mhrsf-pop{
  position:absolute;
  width: 320px;
  background:var(--mhrsf-card);
  border:1px solid var(--mhrsf-border);
  box-shadow:var(--mhrsf-shadow);
  border-radius:14px;
  padding:10px;
  display:none;
  z-index: 999;
}
.mhrsf-pop.show{ display:block; }
.mhrsf-pop-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-bottom:8px;
  border-bottom:1px solid var(--mhrsf-border);
  margin-bottom:8px;
}
.mhrsf-pop-title{ font-weight:900; }
.mhrsf-pop-x{
  width:32px;
  height:32px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:var(--mhrsf-card);
  cursor:pointer;
  font-weight:900;
  color:var(--mhrsf-text);
}
.mhrsf-emoji-grid{
  display:grid;
  grid-template-columns: repeat(10, 1fr);
  gap:6px;
}
.mhrsf-emoji{
  height:30px;
  border-radius:10px;
  border:1px solid var(--mhrsf-border);
  background:rgba(100,116,139,.06);
  cursor:pointer;
  font-size:16px;
  line-height:1;
}
.mhrsf-emoji:hover{ border-color:rgba(37,99,235,.55); box-shadow:0 0 0 3px rgba(37,99,235,.12); }

/* Modal */
.mhrsf-modal{
  position:fixed;
  inset:0;
  background: rgba(2,6,23,.45);
  display:none;
  z-index: 1000;
  padding: 18px;
}
.mhrsf-modal.show{ display:flex; align-items:center; justify-content:center; }
.mhrsf-modal-card{
  width:min(720px, 100%);
  background:var(--mhrsf-card);
  border:1px solid var(--mhrsf-border);
  border-radius:16px;
  box-shadow:var(--mhrsf-shadow);
  overflow:hidden;
}
.mhrsf-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid var(--mhrsf-border);
}
.mhrsf-modal-title{ font-weight:900; }
.mhrsf-modal-body{ padding:14px; }
.mhrsf-modal-foot{
  padding:12px 14px;
  border-top:1px solid var(--mhrsf-border);
  display:flex;
  gap:10px;
  justify-content:flex-end;
}


/* ===== v1.3.0 additions ===== */
.mhrsf-select.wide{ width: 190px; }


/* Public embed */
.mhrsf-public-wrap{ max-width: 1200px; margin: 18px auto; padding: 0 12px; }


/* keep toolbar items visible */
.mhrsf-toolbar{ flex-wrap: wrap; }
.mhrsf-toolbar-left{ flex-wrap: wrap; }
.mhrsf-toolbar-right{ flex-wrap: wrap; }