.is-shared-item {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.is-shared-item > :not(.shared-item-wisp-canvas) {
  position: relative;
  z-index: 3;
}

.shared-item-wisp-canvas {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.88;
  transition: opacity 180ms ease, filter 180ms ease;
}

.is-shared-item:hover .shared-item-wisp-canvas,
.is-shared-item:focus-visible .shared-item-wisp-canvas,
.is-shared-item.selected .shared-item-wisp-canvas,
.is-shared-item.is-selected .shared-item-wisp-canvas {
  opacity: 1;
  filter: brightness(1.08) saturate(1.08);
}

.discussion-response-option.is-shared-item {
  overflow: visible;
}

.discussion-response-option.is-shared-item .discussion-response-option-frame {
  overflow: hidden;
  clip-path: polygon(2% 11%, 91% 0, 100% 18%, 96% 92%, 84% 100%, 7% 95%, 0 79%);
}

.discussion-response-option.is-shared-item .discussion-response-option-frame::before {
  z-index: 0;
}

.discussion-response-option.is-shared-item .shared-item-wisp-canvas {
  z-index: -1;
}

.discussion-response-option.is-shared-item:nth-child(2n) .discussion-response-option-frame {
  clip-path: polygon(6% 2%, 96% 8%, 100% 83%, 91% 100%, 4% 93%, 0 18%);
}

.discussion-response-option.is-shared-item:nth-child(3n) .discussion-response-option-frame {
  clip-path: polygon(1% 18%, 8% 5%, 87% 0, 100% 11%, 95% 95%, 76% 100%, 3% 90%);
}

.is-shared-item::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  border: 0;
  box-shadow:
    inset 0 0 12px rgba(110, 224, 255, 0.08),
    0 0 14px rgba(255, 215, 123, 0.08);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .shared-item-wisp-canvas {
    display: none;
  }

  .is-shared-item::after {
    box-shadow:
      inset 0 0 16px rgba(104, 218, 255, 0.2),
      0 0 12px rgba(255, 219, 130, 0.22);
  }
}