/* Custom Highlighting Engine - Ink CSS Variable Presets */

:root {
  --ink-color: #000000;
  --ink-text-color: #fffcf2;
  --ink-height: 0.8em;
  --ink-y-offset: 50%;
  --ink-x-offset: 0px;
}

.custom-char {
  position: relative;
  display: inline;
}

.custom-char.selected {
  color: var(--ink-text-color) !important;
  background-color: transparent !important;
}

.custom-char.selected::before {
  content: '';
  position: absolute;
  left: var(--ink-x-offset);
  right: var(--ink-x-offset);
  top: var(--ink-y-offset);
  transform: translateY(-50%);
  height: var(--ink-height);
  background-color: var(--ink-color);
  z-index: -1;
}