.levels-card { display: grid; align-content: start; gap: 14px; }
.levels-heading, .level-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.levels-heading h3 { margin: 5px 0 0; font: 700 18px/1.2 var(--serif); }
.levels-points { flex: 0 0 auto; color: var(--green); font-size: 14px; }
.levels-status { margin: 0; color: var(--muted); font-size: 12px; }
.levels-rules { margin: -7px 0 0; color: var(--muted); font-size: 10px; }
.levels-details { display: grid; gap: 9px; }
.level-name { font: 700 16px var(--serif); }
.level-number, .level-next, .levels-stats { color: var(--muted); font-size: 11px; }
.level-progress { height: 7px; overflow: hidden; border-radius: 6px; background: var(--line); }
.level-progress span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--green); transition: width .25s ease; }
.level-next, .levels-stats { margin: 0; }
.badge-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.level-badge { display: flex; align-items: center; gap: 6px; min-width: 0; padding: 7px 8px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); font-size: 10px; }
.level-badge.earned { border-color: #a9d1b8; background: #edf7ef; color: #175e4b; font-weight: 700; }
.badge-mark { display: grid; flex: 0 0 17px; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: #e8eee9; }
.level-badge.earned .badge-mark { background: #d2ead9; }
.dark-theme .level-badge.earned { background: #214b3b; border-color: #477663; color: #d2ead9; }
.dark-theme .badge-mark { background: #244a3d; }
.dark-theme .level-badge.earned .badge-mark { background: #397358; }
.chat-helpful { display: inline-flex; align-items: center; gap: 5px; margin-top: 7px; padding: 4px 7px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); font-size: 10px; cursor: pointer; }
.chat-helpful:hover:not(:disabled), .chat-helpful.voted { border-color: var(--green); color: var(--green); }
.chat-helpful:disabled { cursor: default; opacity: .7; }
.chat-helpful-error { display: block; margin-top: 4px; color: #994b39; font-size: 10px; }
.goal-picker-dialog { width: min(680px, calc(100% - 28px)); max-height: min(86vh, 760px); padding: 24px; border: 1px solid var(--line); border-radius: 10px; background: var(--cream); color: var(--ink); box-shadow: 0 24px 70px #102d2540; }
.goal-picker-dialog::backdrop { background: #122d27a8; }
.goal-picker-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.goal-picker-header h2 { margin: 5px 0 0; font: 700 24px/1.2 var(--serif); }
.goal-picker-close { flex: 0 0 32px; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; font-size: 20px; line-height: 1; }
.goal-picker-copy { margin: 8px 0 4px; color: var(--muted); font-size: 12px; }
.goal-picker-count { margin: 0 0 12px; color: var(--green); font-size: 12px; font-weight: 700; }
.goal-picker-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; max-height: 52vh; overflow-y: auto; padding: 2px 2px 12px; }
.goal-picker-group { min-width: 0; margin: 0; padding: 0; border: 0; }
.goal-picker-group legend { margin-bottom: 6px; color: var(--coral); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.goal-picker-choice-grid { display: grid; gap: 3px; }
.goal-picker-choice { display: flex; align-items: flex-start; gap: 8px; min-width: 0; padding: 6px 4px; border-radius: 4px; color: var(--ink); font-size: 12px; line-height: 1.4; cursor: pointer; }
.goal-picker-choice:hover { background: var(--mint); }
.goal-picker-choice input { flex: 0 0 auto; margin: 2px 0 0; accent-color: var(--green); }
.goal-picker-choice input:disabled { cursor: not-allowed; }
.goal-picker-status { min-height: 18px; margin: 4px 0; color: var(--green); font-size: 11px; }
.goal-picker-status.error { color: #994b39; }
.goal-picker-actions { display: flex; justify-content: flex-end; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.goal-picker-actions .primary-btn { justify-content: space-between; gap: 16px; }
.goal-picker-actions .primary-btn:disabled { cursor: wait; opacity: .65; }
.dark-theme .goal-picker-dialog { background: #193c33; border-color: #315747; }
.dark-theme .goal-picker-choice:hover { background: #214b3b; }
@media (max-width: 480px) { .badge-list { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .goal-picker-dialog { padding: 18px; } .goal-picker-options { grid-template-columns: 1fr; max-height: 56vh; } .goal-picker-header h2 { font-size: 21px; } .goal-picker-actions { flex-direction: column-reverse; } .goal-picker-actions button { width: 100%; justify-content: center; } }