.shot-apply-options {
  display: flex;
  align-items: center;
  margin: 5px 0;
}

.shot-apply-toggle {
  position: relative;
  display: flex;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

/* 保留原生复选框的键盘操作，以可见按钮显示焦点。 */
.shot-apply-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  clip-path: inset(50%);
}

.shot-apply-face {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 55px;
  height: 32px;
  padding: 2px 8px;
  overflow: hidden;
  background-color: rgba(0, 0, 0, .16);
  color: rgba(255, 255, 255, .7);
  box-shadow: inset 0 2px 1px rgba(0, 0, 0, .15), 0 1px 1px rgba(255, 255, 255, .17);
  transition: color 300ms cubic-bezier(.25, .8, .25, 1), background-color 300ms cubic-bezier(.25, .8, .25, 1), box-shadow 300ms cubic-bezier(.25, .8, .25, 1);
}

.shot-apply-inner {
  font-size: 13px;
  font-weight: 900;
  pointer-events: none;
  transform: translateY(0);
  transition: transform 300ms cubic-bezier(.25, .8, .25, 1);
}

.shot-apply-toggle:first-child .shot-apply-face { border-radius: 5px 0 0 5px; }
.shot-apply-toggle:last-child .shot-apply-face { border-radius: 0 5px 5px 0; }

.shot-apply-toggle:hover .shot-apply-face {
  background-color: #2c2c2c;
  color: white;
  box-shadow: inset 0 -4px 1px rgba(0, 0, 0, .23), 0 -1px 1px rgba(255, 255, 255, .17), 0 2px 4px 1px rgba(0, 0, 0, .17);
}

.shot-apply-toggle input:checked + .shot-apply-face {
  background-color: #2d6737;
  color: white;
  box-shadow: inset 0 -4px 1px rgba(0, 0, 0, .23), 0 -1px 1px rgba(255, 255, 255, .17), 0 2px 4px 1px rgba(0, 0, 0, .17);
}

.shot-apply-toggle:hover .shot-apply-inner,
.shot-apply-toggle input:checked + .shot-apply-face .shot-apply-inner {
  transform: translateY(-2px);
}

.shot-apply-toggle:hover input:checked + .shot-apply-face {
  background-color: #34723f;
  box-shadow: inset 0 -4px 1px rgba(0, 0, 0, .26), 0 -1px 1px rgba(255, 255, 255, .17), 0 3px 6px 2px rgba(0, 0, 0, .15);
}

.shot-apply-toggle input:focus-visible + .shot-apply-face {
  z-index: 1;
  outline: 2px solid #c4dfc8;
  outline-offset: 2px;
}

.shot-apply-prev[hidden] + .shot-apply-options { display: none; }
@media (prefers-reduced-motion: reduce) {
  .shot-apply-face, .shot-apply-inner { transition: none; }
}