/* Spellen Direct — easter egg overlay */
.sdee { position: fixed; inset: 0; z-index: 2147483000; display: none; background: #04081A; }
.sdee.on { display: block; animation: sdee-in .8s ease both; }
@keyframes sdee-in { from { opacity: 0; } to { opacity: 1; } }
html.sdee-lock, html.sdee-lock body { overflow: hidden; }
.sdee canvas { position: absolute; inset: 0; display: block; }
.sdee-x {
  position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid rgba(242, 218, 155, .35); background: rgba(15, 22, 48, .6); color: #F2DA9B;
  font: 400 26px/1 sans-serif; cursor: pointer;
}
.sdee-x:hover { background: rgba(212, 162, 58, .25); }
.sdee-cap {
  position: absolute; left: 16px; right: 16px; bottom: 9vh; text-align: center; pointer-events: none;
  opacity: 0; transform: translateY(10px); transition: opacity .6s, transform .6s;
}
.sdee-cap.on { opacity: 1; transform: none; }
.sdee-cap span {
  display: block; font: 700 clamp(22px, 4vw, 40px)/1.2 Cinzel, 'Times New Roman', serif; letter-spacing: .06em;
  color: #F7E6B5; text-shadow: 0 2px 6px rgba(4, 8, 26, .9), 0 0 18px rgba(212, 162, 58, .8), 0 0 40px rgba(212, 162, 58, .4);
}
.sdee-cap small { display: block; margin-top: 6px; font: 600 14px/1.4 Nunito, sans-serif; letter-spacing: .3em; text-transform: uppercase; color: #C9D2EE; }
.sdee-end {
  position: absolute; inset: 0; display: none; align-items: center; justify-content: center; padding: 16px;
  background: rgba(4, 8, 26, .55);
}
.sdee-end.on { display: flex; animation: sdee-in .6s ease both; }
.sdee-card {
  max-width: 420px; width: 100%; text-align: center; padding: 30px 26px 24px; border-radius: 18px;
  background: linear-gradient(180deg, #1A1F3D, #0F1630); border: 1px solid rgba(212, 162, 58, .55);
  box-shadow: 0 0 60px rgba(212, 162, 58, .25); color: #E1E5EE; font: 400 16px/1.5 Nunito, sans-serif;
}
.sdee-star { font-size: 34px; color: #F2DA9B; text-shadow: 0 0 20px #D4A23A; }
.sdee-card h2 { margin: 6px 0 10px; font: 700 22px/1.25 Cinzel, serif; color: #F7E6B5; }
.sdee-card p { margin: 0 0 12px; }
.sdee-code {
  display: inline-block; margin-bottom: 18px; padding: 10px 18px; border: 2px dashed #D4A23A; border-radius: 10px;
  font: 800 22px/1 Nunito, sans-serif; letter-spacing: .12em; color: #F2DA9B; user-select: all;
}
.sdee-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.sdee-btns button {
  min-height: 44px; padding: 0 18px; border-radius: 999px; cursor: pointer; font: 700 15px Nunito, sans-serif;
  border: 1px solid #D4A23A; background: transparent; color: #F2DA9B;
}
.sdee-btns button[data-again] { background: #D4A23A; color: #0F1630; }
.sdee-star-btn {
  position: absolute; right: 14px; bottom: 10px; width: 28px; height: 28px; padding: 0; border: 0; background: none;
  color: #D4A23A; opacity: .28; font-size: 16px; line-height: 28px; cursor: pointer; transition: opacity .3s, transform .3s;
}
.sdee-star-btn:hover, .sdee-star-btn:focus-visible { opacity: 1; transform: scale(1.3) rotate(20deg); text-shadow: 0 0 10px #D4A23A; }
