/* Difficulty picker in the briefing (a light card) and the Expert badge on contract cards. */
.difficulty-picker { margin: 0 0 .9rem; }
.difficulty-options { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin: 0; padding: 0; border: 0; min-width: 0; }
.difficulty-options legend { float: left; margin: 0 .4rem 0 0; padding: 0; color: #35495b; font-size: var(--sj-label, 12px); font-weight: 900; letter-spacing: .14em; line-height: 2.75rem; }
.difficulty-option { position: relative; display: inline-flex; }
.difficulty-option input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.difficulty-option span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .8rem; border: 2px solid #3d5968; border-radius: 999px; background: #e9f0f5; color: #0b1620; font-weight: 800; }
.difficulty-option input:checked + span { border-color: #0b1620; background: #ffd447; color: #0b1620; box-shadow: 0 2px 0 #0b1620; }
.difficulty-option input:focus-visible + span { outline: 3px solid #0b1620; outline-offset: 2px; }
.difficulty-blurb { margin: .45rem 0 0; color: #2b3f50; font-size: var(--sj-text, 15px); max-width: 62ch; }
.expert-badge { display: block; margin-top: .2rem; color: #ffd447; font-weight: 900; letter-spacing: .06em; }
@media (max-height: 500px) { .difficulty-blurb { display: none; } }