[data-theme="bonbon"] {
  --candy-shell: linear-gradient(165deg, #fffaff, #fbeefa 46%, #efd5f4);
  --candy-button: linear-gradient(155deg, #ffe3f3, #f7b8e2 60%, #eda8d7);
  --candy-button-shadow: inset 0 1px 1px #ffffffcc,
    inset 0 -1px 2px #b865a72b, 0 2px 6px #914c9426;
}
[data-theme="bonbon"] body {
  background: radial-gradient(ellipse at 95% 5%, #d9c6f52e, transparent 60%),
    linear-gradient(120deg, #faf0f6, #f3edf9);
  min-height: 100vh;
}
[data-theme="bonbon"] dialog,
[data-theme="bonbon"] .clone-popover {
  border-color: #ffffffcc;
  background: var(--candy-shell);
  box-shadow: inset 0 1px 2px #fff, 0 15px 45px #9753a329;
}
[data-theme="bonbon"] .repository-card,
[data-theme="bonbon"] .repository-panel,
[data-theme="bonbon"] .quiet-button {
  background: var(--candy-shell);
  box-shadow: 6px 6px 16px #d9c9dc80, -6px -6px 16px #ffffffba,
    inset 0 1px 1px #ffffffd9;
}
[data-theme="bonbon"] .search,
[data-theme="bonbon"] .field input,
[data-theme="bonbon"] .field select,
[data-theme="bonbon"] .branch-control,
[data-theme="bonbon"] .clone-popover input,
[data-theme="bonbon"] .readme-body pre {
  background: linear-gradient(#efdbed, #f8eaf5);
  box-shadow: inset 0 2px 4px #ae70a826, 0 1px 0 #ffffffb3;
}
[data-theme="bonbon"] .primary {
  position: relative;
  border: 1px solid #cf7fbc;
  border-radius: 10px;
  background: var(--candy-button);
  box-shadow: var(--candy-button-shadow);
  color: #702657;
}
[data-theme="bonbon"] .primary::before {
  content: "";
  position: absolute;
  top: 1px;
  right: 3px;
  left: 3px;
  height: 64%;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% 0, #ffffffad, transparent 75%);
  pointer-events: none;
}
[data-theme="bonbon"] .primary:hover { filter: brightness(1.03); }
[data-theme="bonbon"] .primary:active {
  transform: translateY(1px);
  box-shadow: inset 0 1px 3px #98589540;
}
[data-theme="bonbon"] .swatch-bonbon {
  background: radial-gradient(circle at 30% 20%, #fff, #ff83c6 45%, #b53280);
  box-shadow: 0 1px 2px #71316f33;
}
@media (prefers-reduced-motion: no-preference) {
  [data-theme="bonbon"] .primary:hover { transform: translateY(-1px); }
}