/* html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  overflow: hidden;
  background: #f7f7fb;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
} */

.mount {
  position: relative;
  width: 80%;
  height: 600px;
}

/* Fixed control panel (outside the canvas) */
#ec-panel {
  /* position: fixed;
  top: 16px;
  right: 16px;
  left: auto;
  background: rgba(255,255,255,0.6);
  border: 1px solid #ddd;
  border-radius: 12px; */
  padding: 10px 12px;
  font-size: 12px;
  /* box-shadow: 0 2px 8px rgba(0,0,0,0.08); */
  z-index: 10;
  min-width: 320px;
  max-width: min(520px, calc(100vw - 32px));
  /* color: black; */
}

#ec-panel button {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 6px 10px;
  background: #fff;
  cursor: pointer;
  /* color: gray; */
}

#ec-panel input[type="number"] {
  width: 70px;
  background: #fff;
  color: gray;
}

#panelHeader {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  cursor:pointer;
  user-select:none;
}

#panelBody {
  margin-top: 8px;
}

.small-muted {
  margin-bottom: 6px;
  /* color: #374151; */
}