/* ── Blockly Workspace ───────────────────────────────────── */
#blocklyDiv {
  width: 400px;
  height: 300px;
  border-radius: 2px;
  overflow: hidden;
  border: 0.5px solid rgba(0, 0, 0, 0.24)
  background: white;
}


/* ── Lamp Side ───────────────────────────────────────────── */
#lamp-side {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#lamp-wrap {
  max-width:400px;
  margin-top:-40px;
}

/* Lit states */
#lampoff.lit      { display:none;}
#lampon  { display:none; }
#lampon.lit  { display:block;}


/* ── Hint Text ───────────────────────────────────────────── */
#cubicodehint {
    color: #004172;
    letter-spacing: 0.5px;
}

/* ── Blockly-internal: glow animation for action block ───── */
@keyframes blockGlow {
  0%, 100% {
    filter: drop-shadow(0 0 3px rgba(99,102,241,0.35));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(99,102,241,0.85));
  }
}

.action-hint {
  animation: blockGlow 1.8s ease-in-out infinite;
}

.examples__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.examples__card {
  background: #fff;
  border-radius: 2px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.examples__card-image img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 900px) {
  .examples__cards {
    grid-template-columns: 1fr;
  }
}