/* AutoHelper supplies: cyan hover, gold selection, no movement or animation.
   Inset halos remain inside each control and never escape the compact panel. */
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball,
html body .auto-helper-panel #helper-potion-name {
  position:relative;
  isolation:isolate;
  border-color:#496a76!important;
  background-color:#091b26!important;
  box-shadow:inset 0 0 0 1px #071017!important;
  transition:none!important;
  transform:none!important;
  animation:none!important;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball b {
  position:relative;
  z-index:1;
  color:#f5fbff!important;
  text-shadow:0 1px 2px #000;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball:not(:disabled):not(.ball-blocked):is(:hover,:focus-visible),
html body .auto-helper-panel #helper-potion-name:not(:disabled)[data-supply-available="true"]:is(:hover,:focus-visible) {
  border-color:#83edff!important;
  background-color:#103b48!important;
  box-shadow:inset 0 0 0 1px #74e8ff,inset 0 0 13px 2px #37cffb88!important;
  outline:0!important;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball.active:not(:disabled):not(.ball-blocked),
html body .auto-helper-panel #helper-potion-name:not(:disabled)[data-supply-available="true"] {
  border-color:#ffe284!important;
  background-color:#34321d!important;
  box-shadow:inset 0 0 0 1px #f8c954,inset 0 0 12px 2px #f0bd3970!important;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball.active:not(:disabled):not(.ball-blocked):is(:hover,:focus-visible),
html body .auto-helper-panel #helper-potion-name:not(:disabled)[data-supply-available="true"]:is(:hover,:focus-visible) {
  border-color:#fff6cf!important;
  background-color:#494326!important;
  box-shadow:inset 0 0 0 1px #fff0a4,inset 0 0 15px 3px #ffd65ca6!important;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball.active:not(:disabled):not(.ball-blocked)::after {
  content:"\2713";
  position:absolute;
  top:1px;
  right:1px;
  display:grid;
  place-items:center;
  width:9px;
  height:9px;
  border-radius:3px;
  background:#fff1a8;
  color:#152019;
  font:900 8px/1 Arial,sans-serif;
  pointer-events:none;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball:not(:disabled):not(.ball-blocked):is(:hover,:focus-visible) .helper-ball-sprite {
  filter:drop-shadow(0 0 3px #6ce7ff);
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball.active:not(:disabled):not(.ball-blocked) .helper-ball-sprite {
  filter:drop-shadow(0 0 3px #ffdc69);
}
/* Keep the native potion selector, its names/counts and its existing input event. */
html body .auto-helper-panel .helper-config label:has(>#helper-potion-name) {
  position:relative;
}
html body .auto-helper-panel #helper-potion-name {
  padding-inline-start:15px!important;
}
html body .auto-helper-panel .helper-config label:has(>#helper-potion-name:not(:disabled)[data-supply-available="true"])::after {
  content:"\2713";
  position:absolute;
  left:calc(51px + 8px);
  top:50%;
  transform:translateY(-50%);
  color:#fff1a8;
  font:900 10px/1 Arial,sans-serif;
  pointer-events:none;
}
html body .auto-helper-panel .helper-care-module:has(#helper-potion-name[data-supply-available="true"]) .helper-potion-switch:has(#helper-potion:checked)>img {
  filter:drop-shadow(0 0 3px #ffdc69);
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball:is(:disabled,.ball-blocked),
html body .auto-helper-panel #helper-potion-name:is(:disabled,[data-supply-available="false"]) {
  border-color:#46525b!important;
  background-color:#14202a!important;
  box-shadow:none!important;
  color:#9baab3!important;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball:is(:disabled,.ball-blocked) {
  opacity:.5!important;
  cursor:not-allowed;
}
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball:is(:disabled,.ball-blocked) .helper-ball-sprite {
  filter:none!important;
}
/* Keyboard focus remains distinguishable even when a selected potion is empty. */
html body .auto-helper-panel #helper-potion-name:focus-visible,
html body .auto-helper-panel :is(#helper-normal-balls,#helper-shiny-balls) .helper-ball:not(:disabled):focus-visible {
  outline:1px dashed #fff!important;
  outline-offset:-4px!important;
}