/* Frontend styles */
.wpwc-section{
  --digit-width: 46px;
  --digit-height: 64px;
  --digit-font-size: 40px;
  --digit-bg-top: #0a0a0a;
  --digit-bg-bottom: #1b1b1b;
  --digit-text: #f5f5f5;
  --label-font: 16px;
  --label-color: #222;
  width:100%;
  padding: var(--container-padding, 16px);
  box-sizing: border-box;
}
.wpwc-center{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  overflow:hidden;
}
.win-counter{
  display:flex;
  gap:10px;
  padding:16px 18px;
  border-radius:14px;
  border:1px solid #e8e8e8;
  background:linear-gradient(180deg,#ffffff 0%,#f6f6f6 100%);
  box-shadow:0 6px 20px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.6);
  width:max-content;
  align-items:center;
  transform-origin:center;
  max-width:100%;
}
.win-counter .currency{
  font-family: ui-monospace, monospace;
  font-size: var(--digit-font-size);
  font-weight:700;
  color:#0a0a0a;
  line-height: var(--digit-height);
  margin-right:4px;
}
.win-counter .digit{
  position:relative;
  width: var(--digit-width);
  height: var(--digit-height);
  overflow:hidden;
  border-radius:10px;
  background:linear-gradient(180deg,var(--digit-bg-top) 0%, var(--digit-bg-bottom) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(0,0,0,.4),
    0 4px 12px rgba(0,0,0,.25);
}
.win-counter .digit .reel{
  position:absolute;
  left:0; top:0;
  width:100%;
  transition:transform 900ms cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.win-counter .digit .cell{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height: var(--digit-height);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size: var(--digit-font-size);
  font-weight:700;
  letter-spacing:1px;
  color: var(--digit-text);
  text-shadow:0 1px 0 rgba(0,0,0,.6), 0 0 8px rgba(255,255,255,.08);
}
.win-counter .digit.dim .cell{
  color: transparent !important;
  text-shadow: none !important;
}
.win-counter .digit::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 35%, rgba(0,0,0,.25) 100%);
  pointer-events:none;
  border-radius:10px;
}
.wpwc-rand{
  margin:8px 0 0 0;
  font-size: var(--label-font);
  line-height:1.35;
  text-align:center;
  width:100%;
  color: var(--label-color);
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.wpwc-note{
  color:#555;
  margin:6px 0 0 0;
  font-size:14px;
  text-align:center;
  width:100%;
}
@media (max-width:480px){
  .win-counter{ padding:12px 14px; gap:8px; }
}