/* XGORONE V8 — kontrol dasar menyatu dengan preview wajah. */
.love-fit-preview > .preview-basic-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(164, 114, 255, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(116, 64, 237, .12), rgba(3, 2, 9, .38));
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}

.love-fit-preview > .preview-basic-controls .fit-controls-heading,
.love-fit-preview > .preview-basic-controls > .drag-note {
  grid-column: 1 / -1;
}

.love-fit-preview > .preview-basic-controls .fit-controls-heading {
  margin-bottom: 1px;
}

.love-fit-preview > .preview-basic-controls label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(255, 255, 255, .085);
  border-radius: 11px;
  background: rgba(0, 0, 0, .2);
}

.love-fit-preview > .preview-basic-controls label span {
  color: #ddd3e9;
  font-size: 7.5px;
}

.love-fit-preview > .preview-basic-controls label output {
  color: #fff;
  text-align: right;
  font-size: 7.5px;
  font-variant-numeric: tabular-nums;
}

.love-fit-preview > .preview-basic-controls label input {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  margin-top: 1px;
}

.love-fit-preview > .preview-basic-controls > .drag-note {
  margin-top: 1px;
}

.fit-controls.v8-control-source {
  display: none !important;
}

@media (max-width: 430px) {
  .love-fit-preview > .preview-basic-controls { gap: 6px; padding: 9px; }
  .love-fit-preview > .preview-basic-controls label { padding: 8px 7px; }
  .love-fit-preview > .preview-basic-controls label span,
  .love-fit-preview > .preview-basic-controls label output { font-size: 7px; }
}
