/* UI fixes on top of the original stylesheet (linked from index.html by tools/port.py). */

/* How → "How to earn points": badge column + text column, so badges line up and wrapped text never runs under them */
.roles li:has(> .pp) { display: flex; align-items: center; gap: 12px; padding: 5px 0; }
.roles li > .pp { flex: none; width: 48px; min-width: 0; box-sizing: border-box; padding: 4px 0; line-height: 1.15; }
.roles li > .pp + span { flex: 1; min-width: 0; line-height: 1.35; }
.roles li > .pp.shop { background: #dff1ff; font-size: 16px; }