/* Barking Llama: Llama Roulette - minimal, override-friendly */

.llama-roulette {
  --lr-max-width: 960px;
  --lr-aspect-ratio: 16/9;

  --lr-gap: 12px;
  --lr-radius: 12px;

  --lr-bg: transparent;
  --lr-border: rgba(0,0,0,0.12);

  --lr-btn-bg: #111;
  --lr-btn-fg: #fff;
  --lr-btn-radius: 10px;
  --lr-btn-pad-y: 10px;
  --lr-btn-pad-x: 14px;

  max-width: var(--lr-max-width);
  background: var(--lr-bg);
}

.llama-roulette.left { margin-right: auto; }
.llama-roulette.center { margin-left: auto; margin-right: auto; }
.llama-roulette.right { margin-left: auto; }

.llama-roulette-player {
  position: relative;
  width: 100%;
  aspect-ratio: var(--lr-aspect-ratio);
  border-radius: var(--lr-radius);
  overflow: hidden;
  border: 1px solid var(--lr-border);
}

.llama-roulette-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.llama-roulette-loading,
.llama-roulette-error {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 12px;
  text-align: center;
}

.llama-roulette-actions {
  margin-top: var(--lr-gap);
}

.llama-roulette-btn {
  appearance: none;
  border: 0;
  cursor: pointer;
  background: var(--lr-btn-bg);
  color: var(--lr-btn-fg);
  border-radius: var(--lr-btn-radius);
  padding: var(--lr-btn-pad-y) var(--lr-btn-pad-x);
  font: inherit;
}

.llama-roulette-btn:hover { opacity: 0.92; }
.llama-roulette-btn:active { transform: translateY(1px); }

.llama-roulette-title {
  font-size: 1.1rem;
  font-weight: 600;
  margin-top: 12px;
  line-height: 1.4;
  color: #111;
}