/* Difficulty Picker */
#difficulty-picker {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 210;
  pointer-events: all;
}

.picker-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: calc(16px * var(--ui-scale));
  width: min(800px, 90vw);
}

.picker-card {
  padding: calc(14px * var(--ui-scale));
  background: rgba(10, 0, 32, 0.5);
  border: calc(3px * var(--ui-scale)) solid rgba(0,255,255,0.1);
  border-radius: calc(10px * var(--ui-scale));
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.picker-card.active,
.picker-card:hover {
  border-color: #00ffff;
  box-shadow: 0 0 calc(18px * var(--ui-scale)) rgba(0,255,255,0.1);
  transform: translateY(calc(-2px * var(--ui-scale)));
}

.picker-name {
  font-family: monospace;
  font-weight: 800;
  font-size: calc(20px * var(--ui-scale));
  margin-bottom: calc(6px * var(--ui-scale));
  color: #00ffff;
  text-shadow: 0 0 calc(8px * var(--ui-scale)) #00ffff;
}

.picker-desc {
  font-family: monospace;
  font-size: calc(14px * var(--ui-scale));
  color: rgba(255,255,255,0.55);
  line-height: 1.25;
  min-height: calc(40px * var(--ui-scale));
}