/* ── Scoreboard: mirrors battery on right side of bulb-strip ── */
/* Height derivation from battery:
   battery-housing: border 1+1, padding 3+3           = 8px shell
   battery-bay:     border 1+1, padding 4+5           = 11px shell
   battery content: cell nub clamp(2,0.5vw,4)+1mb
                  + cell-body clamp(22,4vw,35)
                  + charge-dots margin-top 4 + h 3    = 7px
   Total battery outer = 8 + 11 + clamp(25,4.5vw,40) + 7
   Scoreboard must match. Same 8px housing shell + 11px bay shell = 19px.
   So sb-digit height = clamp(25,4.5vw,40) + 7 = clamp(32, calc(4.5vw + 7px), 47) */
.bulb-strip .scoreboard-housing {
  position: absolute;
  left: calc(50% + 132px + clamp(4px, 1vw, 10px));
  top: 50%;
  transform: translateY(-50%);
  width: auto;
  min-width: 60px;
  max-width: 120px;
  background:
    repeating-linear-gradient(
      90deg,
      transparent, transparent 2px,
      rgba(255,255,255,0.008) 2px,
      rgba(255,255,255,0.008) 4px
    ),
    linear-gradient(180deg, #282a22 0%, #222418 50%, #1c1e14 100%);
  border-radius: 4px;
  border-top: 1px solid #1a1c12;
  border-left: 1px solid #1e2016;
  border-right: 1px solid #2a2c22;
  border-bottom: 1px solid #2e3026;
  box-shadow:
    inset 0 2px 8px rgba(0,0,0,0.9),
    inset 0 1px 3px rgba(0,0,0,0.6),
    0 1px 0 rgba(255,255,255,0.04);
  padding: 3px 5px 3px;
  z-index: 2;
}

.scoreboard-bay {
  position: relative;
  border-radius: 4px;
  padding: 4px 4px 5px;
  background: linear-gradient(180deg, #0c0e09 0%, #111309 60%, #0e1008 100%);
  box-shadow:
    inset 0 3px 8px rgba(0,0,0,0.9),
    inset 0 1px 3px rgba(0,0,0,0.7),
    inset -1px 0 2px rgba(0,0,0,0.5),
    inset 1px 0 0 rgba(255,255,255,0.025);
  border: 1px solid #0a0b07;
}

.scoreboard-digits {
  display: flex;
  gap: clamp(2px, 0.5vw, 5px);
  justify-content: center;
  align-items: stretch;
}

.sb-digit {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(7, 1fr);
  gap: clamp(1px, 0.15vw, 2px);
  height: clamp(32px, calc(4.5vw + 7px), 47px);
  aspect-ratio: 4 / 7;
}

.sb-dot {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(255,140,0,0.07);
  transition: background 0.12s ease, box-shadow 0.12s ease;
}

.sb-dot.on {
  background: radial-gradient(circle at 35% 35%, #ffe0a0, #ff8c00 60%, #cc6600);
  box-shadow:
    0 0 clamp(1px, 0.3vw, 3px) rgba(255,140,0,0.8),
    0 0 clamp(3px, 0.8vw, 6px) rgba(255,140,0,0.4);
}

.sb-dot.on-green {
  background: radial-gradient(circle at 35% 35%, #b8ffb0, #39ff14 60%, #20cc10);
  box-shadow:
    0 0 clamp(1px, 0.3vw, 3px) rgba(57,255,20,0.8),
    0 0 clamp(3px, 0.8vw, 6px) rgba(57,255,20,0.4);
}

.scoreboard-window {
  position: absolute;
  inset: 0;
  border-radius: 4px;
  background: linear-gradient(180deg, rgba(255,140,0,0.02) 0%, transparent 40%);
  pointer-events: none;
}
