/* Ausgelagert aus gamenight.html Zeile 24672 (Block 17). */
:root{
  --rbc711-reel-left:url("assets/matchomat_reel_left_v711.png?v=711");
  --rbc711-reel-center:url("assets/matchomat_reel_center_v711.png?v=711");
  --rbc711-reel-right:url("assets/matchomat_reel_right_v711.png?v=711");
  --rbc711-terminal:url("assets/matchomat_terminal_trapezoid_v711.png?v=711");
}

/* Hauptasset bleibt im Vordergrund */
#panel-luckyslot .rbc683-single-img{
  z-index:70!important;
  pointer-events:none!important;
}

/* Walzen bleiben hinter dem freigestellten Automaten */
#panel-luckyslot .rbc638-reels{
  z-index:31!important;
  pointer-events:none!important;
}

#panel-luckyslot .rbc638-reel{
  overflow:hidden!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Fenster müssen mit den schrägen Ausschnitten arbeiten */
#panel-luckyslot .rbc638-reel:nth-child(1){
  clip-path:polygon(2.5% 1%, 100% 0%, 97.5% 100%, 0% 99%)!important;
  border-radius:18px 10px 14px 18px!important;
}
#panel-luckyslot .rbc638-reel:nth-child(2){
  clip-path:polygon(1% 0%, 99% 0%, 99.5% 100%, .5% 100%)!important;
  border-radius:16px!important;
}
#panel-luckyslot .rbc638-reel:nth-child(3){
  clip-path:polygon(0% 0%, 97.5% 1%, 100% 99%, 2.5% 100%)!important;
  border-radius:10px 18px 18px 14px!important;
}

/* Unterlay füllt den kompletten ausgeschnittenen Bereich, nicht nur die Content-Karte */
#panel-luckyslot .rbc638-reel-window{
  position:relative!important;
  z-index:5!important;
  overflow:hidden!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  border-radius:inherit!important;
  background:transparent!important;
}
#panel-luckyslot .rbc638-reel-window::before{
  content:""!important;
  position:absolute!important;
  pointer-events:none!important;
  z-index:1!important;
  display:block!important;
  background-repeat:no-repeat!important;
  background-size:156% 154%!important;
  background-position:center 56%!important;
  left:-24px!important;
  right:-24px!important;
  top:-18px!important;
  bottom:-32px!important;
}
#panel-luckyslot .rbc638-reel:nth-child(1) .rbc638-reel-window::before{
  background-image:var(--rbc711-reel-left)!important;
  background-position:47.5% 56%!important;
  left:-30px!important;
  right:-18px!important;
}
#panel-luckyslot .rbc638-reel:nth-child(2) .rbc638-reel-window::before{
  background-image:var(--rbc711-reel-center)!important;
  background-position:50% 56%!important;
}
#panel-luckyslot .rbc638-reel:nth-child(3) .rbc638-reel-window::before{
  background-image:var(--rbc711-reel-right)!important;
  background-position:52.5% 56%!important;
  left:-18px!important;
  right:-30px!important;
}

/* Glas-/Zylinder-Shading im Ausschnitt */
#panel-luckyslot .rbc638-reel-window::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  border-radius:inherit!important;
  background:
    linear-gradient(90deg, rgba(43,20,8,.26), transparent 16%, transparent 84%, rgba(43,20,8,.24)),
    linear-gradient(180deg, rgba(43,20,8,.22), transparent 22%, transparent 78%, rgba(43,20,8,.20)),
    radial-gradient(120% 78% at 50% 50%, rgba(255,245,210,.10), rgba(255,245,210,0) 55%)!important;
  box-shadow:inset 0 0 0 1px rgba(142,93,43,.18)!important;
}

/* Inhalt sitzt über dem Unterlay, aber die Karte selbst ist transparent,
   damit keine geraden Rechtecke mehr sichtbar sind. */
#panel-luckyslot .rbc638-reel-window > .rbc638-item,
#panel-luckyslot .rbc644-reel-cell .rbc638-item{
  position:relative!important;
  z-index:4!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:20px 12px 20px!important;
  margin:0!important;
  overflow:hidden!important;
  background:none!important;
  border-radius:0!important;
}

/* Beim echten Drehen: jede Spin-Zelle bekommt die passende Form als Hintergrund,
   aber wieder übergroß, damit keine Lücken entstehen. */
#panel-luckyslot .rbc644-reel-cell{
  width:100%!important;
  height:100%!important;
  display:grid!important;
  place-items:center!important;
  background-repeat:no-repeat!important;
  background-size:156% 154%!important;
  background-position:center 56%!important;
  overflow:hidden!important;
  border:0!important;
}
#panel-luckyslot .rbc638-reel:nth-child(1) .rbc644-reel-cell{
  background-image:var(--rbc711-reel-left)!important;
  background-position:47.5% 56%!important;
}
#panel-luckyslot .rbc638-reel:nth-child(2) .rbc644-reel-cell{
  background-image:var(--rbc711-reel-center)!important;
  background-position:50% 56%!important;
}
#panel-luckyslot .rbc638-reel:nth-child(3) .rbc644-reel-cell{
  background-image:var(--rbc711-reel-right)!important;
  background-position:52.5% 56%!important;
}

/* Verhindert doppelte gerade Kartenflächen aus älteren Patches */
#panel-luckyslot .rbc638-reel-window > .rbc638-item::before,
#panel-luckyslot .rbc638-reel-window > .rbc638-item::after,
#panel-luckyslot .rbc644-reel-cell .rbc638-item::before,
#panel-luckyslot .rbc644-reel-cell .rbc638-item::after{
  display:none!important;
  content:none!important;
}

/* Inhalt lesbarer, aber nicht zu groß */
#panel-luckyslot .rbc638-avatar{
  width:58px!important;
  height:58px!important;
  margin:0 0 8px!important;
  z-index:5!important;
}
#panel-luckyslot .rbc638-mapicon{
  width:68px!important;
  height:58px!important;
  margin:0 0 8px!important;
  z-index:5!important;
}
#panel-luckyslot .rbc638-name{
  z-index:5!important;
  font-size:12.4px!important;
  line-height:1.06!important;
  max-width:88%!important;
  color:#150d08!important;
  text-shadow:0 1px 0 rgba(255,255,255,.38)!important;
}
#panel-luckyslot .rbc638-map .rbc638-name{
  font-size:11px!important;
  line-height:1.05!important;
}
#panel-luckyslot .rbc638-meta{
  z-index:5!important;
  font-size:7px!important;
  letter-spacing:1.2px!important;
  color:rgba(38,26,17,.68)!important;
}

/* --- TRAPEZ-DISPLAY UNTEN --- */
#panel-luckyslot .rbc638-led{
  position:relative!important;
  overflow:hidden!important;
  margin:13px 4px 0!important;
  min-height:88px!important;
  padding:13px 40px 14px 42px!important;
  border:0!important;
  border-radius:0!important;
  background:var(--rbc711-terminal) center center / 104% 106% no-repeat!important;
  clip-path:polygon(4% 0%, 96% 0%, 100% 100%, 0% 100%)!important;
  box-shadow:none!important;
}
#panel-luckyslot .rbc638-led::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    repeating-linear-gradient(180deg, rgba(105,255,120,.055) 0 1px, rgba(0,0,0,0) 1px 4px),
    linear-gradient(90deg, rgba(5,255,88,.08), transparent 15%, transparent 85%, rgba(5,255,88,.06))!important;
  z-index:0!important;
}
#panel-luckyslot .rbc638-led::after{
  content:""!important;
  position:absolute!important;
  inset:2px 8px 4px 8px!important;
  pointer-events:none!important;
  border-radius:10px!important;
  box-shadow:inset 0 0 18px rgba(88,255,105,.13)!important;
  z-index:1!important;
}
#panel-luckyslot .rbc638-led-title,
#panel-luckyslot .rbc638-led-lines{
  position:relative!important;
  z-index:2!important;
  font-family:'Courier New',Consolas,monospace!important;
  text-transform:uppercase!important;
}
#panel-luckyslot .rbc638-led-title{
  margin:0 0 5px!important;
  color:#82ff76!important;
  font-size:10.5px!important;
  font-weight:700!important;
  letter-spacing:2px!important;
  text-shadow:0 0 10px rgba(112,255,118,.35)!important;
}
#panel-luckyslot .rbc638-led-lines{
  color:#72ff72!important;
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.22!important;
  letter-spacing:1.05px!important;
  text-shadow:0 0 10px rgba(92,255,108,.34)!important;
}
#panel-luckyslot .rbc638-led-lines div{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
@media (max-width:1500px){
  #panel-luckyslot .rbc638-led-lines{font-size:12.3px!important;}
  #panel-luckyslot .rbc638-led-title{font-size:9.4px!important;}
}
