body { font-family: Arial, sans-serif; margin: 2rem; background: #f4f8fb; }
h1 { color: #004080; margin-top: 0; }
.stelling { background: #fff; border: 1px solid #ddd; padding: 1rem; margin: 0 0 1rem 0; border-radius: 6px; }
.actions { margin: 1rem 0; }
button { padding: .55rem 1rem; border: 1px solid #bbb; border-radius: 6px; background: #fff; cursor: pointer; }
button:hover { background: #f0f4ff; }
#resultaat { margin-top: 1.5rem; }
.muted { color: #666; font-size: .95rem; }
.badge { display: inline-block; padding: .1rem .45rem; border: 1px solid #ccd; border-radius: 4px; background: #eef; margin-left: .25rem; font-size: .85rem; }
/* Modal */
.overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: none; align-items: center; justify-content: center; z-index: 1000; }
.modal { max-width: 900px; width: 92%; max-height: 85vh; overflow: auto; background: #fff; border-radius: 10px; border: 1px solid #ddd; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.modal header { position: sticky; top: 0; background: #fff; border-bottom: 1px solid #eee; padding: 1rem; }
.modal .content { padding: 1rem; }
.right { float: right; }
.banner {
  background: #eaf4ff;
  border: 1px solid #bcd;
  border-radius: 8px;
  padding: 1.5rem;
  margin: 1.5rem 0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.banner h2 {
  margin-top: 0;
  color: #003366;
}
.banner p {
  margin: 0.5rem 0 0 0;
  line-height: 1.5;
  color: #333;
}
.banner a {
  color: #004080;
  text-decoration: underline;
}