/* General editor styling */
#editor {
  font-family: monospace;
  background: #1e1e1e;
  color: #ddd;
  padding: 10px;
  border-radius: 10px;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

/* Each editable line */
#editor p {
  margin: 4px 0;
  padding: 2px 6px;
  border-left: 3px solid transparent;
}

/* Highlight line when editing */
#editor p:focus-within {
  border-left: 3px solid #4cafef;
  background: rgba(255,255,255,0.05);
}

/* Editable text */
#editor span[contenteditable="true"] {
  outline: none;
  padding: 0 2px;
  border-bottom: 1px dashed #666;
  cursor: text;
}

/* Editable on hover */
#editor span[contenteditable="true"]:hover {
  border-bottom-color: #aaa;
}

/* Fake link for booleans */
#editor .link {
  color: #4cafef;
  cursor: pointer;
  text-decoration: underline;
}

/* Nested objects/arrays */
#editor div {
  margin-left: 20px;
  border-left: 1px dashed #444;
  padding-left: 10px;
}