/* Minimal, clean tweaks on top of Bootstrap */

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.card {
  border: 1px solid rgba(0,0,0,.06);
}

.card-header {
  background: #fff;
}

.small-muted {
  color: rgba(0,0,0,.55);
  font-size: .9rem;
}

.badge-soft {
  background: rgba(0,0,0,.06);
  color: rgba(0,0,0,.75);
  border: 1px solid rgba(0,0,0,.06);
}

pre.code-inline {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  white-space: pre-wrap;
}


/* Number picker (mobile-friendly) */
.picker-box {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 12px;
  background: #fff;
}

.nums-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.nums-grid button {
  width: 44px;
  height: 38px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  border-radius: 12px;
  cursor: pointer;
}

.nums-grid button.selected {
  border: 2px solid rgba(0,0,0,.85);
  font-weight: 700;
}

@media (max-width: 576px) {
  .nums-grid button {
    width: 42px;
    height: 38px;
  }
}