.lure-viewer {
  min-width: 0;
  overflow: hidden;
  background: #e9ece3;
  border-radius: 12px;
  padding: 10px;
}
.lure-stage {
  position: relative;
  isolation: isolate;
  aspect-ratio: 1.6;
  min-height: 190px;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 76%, #394653, #1b252d 75%);
  border-radius: 8px;
  color: #fcfdf9;
}
.lure-stage [data-lure-slot], .lure-stage img, .lure-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lure-stage img { display: block; object-fit: cover; }
.lure-stage[data-lure-state="ready"] img { visibility: hidden; }
.lure-canvas {
  display: block;
  outline-offset: -4px;
  touch-action: pan-y;
  cursor: grab;
}
.lure-canvas.is-dragging { cursor: grabbing; }
.lure-stage :focus-visible { outline-color: var(--lime, #cbf443); }
.lure-stage [data-lure-status] {
  position: absolute;
  z-index: 2;
  top: 8px;
  right: 10px;
  max-width: calc(100% - 20px);
  pointer-events: none;
  text-align: right;
  font-size: .72rem;
  color: #f5f8f5;
  text-shadow: 0 1px 7px #10181f;
}
.lure-stage [data-lure-retry], .lure-rotation {
  position: absolute;
  z-index: 2;
  bottom: 9px;
  left: 9px;
}
.lure-rotation { display: flex; gap: 5px; }
.lure-viewer button {
  min-height: 40px;
  padding: 5px 9px;
  border: 1px solid #bcc4b1;
  border-radius: 6px;
  background: transparent;
  color: #252c20;
  font: 650 .79rem/1.2 var(--body, system-ui);
  white-space: nowrap;
}
.lure-viewer button:hover { background: #d8e1cb; }
.lure-viewer button[aria-pressed="true"] {
  border-color: #20281f;
  background: #20281f;
  color: #fcfdf9;
}
.lure-stage button {
  border-color: #75858a;
  background: #172129;
  color: #fcfdf9;
}
.lure-stage button:hover {
  border-color: var(--lime, #cbf443);
  background: var(--lime, #cbf443);
  color: #18201a;
}
.lure-rotation button:nth-child(-n + 2) {
  min-width: 40px;
  font-size: 1rem;
}
.lure-models { display: flex; gap: 5px; }
.lure-variants { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 9px; }
.lure-viewer [data-lure-controls] {
  display: grid;
  gap: 7px;
  padding: 9px 1px 1px;
}
.lure-swatches { display: flex; gap: 5px; }
.lure-swatches button { display: inline-flex; gap: 4px; align-items: center; }
.lure-swatch {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 1px solid #777f74;
  border-radius: 50%;
}
.lure-color-label {
  flex: 0 0 100%;
  color: #3f4a38;
  font-size: .79rem;
  line-height: 1.3;
}
@media (max-width: 420px) {
  .lure-viewer { padding: 7px; }
  .lure-viewer button { min-height: 44px; }
  .lure-rotation button:nth-child(-n + 2) { min-width: 44px; }
}
