.learning-rewards{--reward-accent:#d8eaff;--reward-muted:#b9c6d4;--reward-line:#3b424c;border:1px solid var(--reward-line);border-radius:24px;background:linear-gradient(145deg,#22262c,#17191d 70%);padding:28px;min-width:0;overflow:hidden;color:#f4f6f8}.learning-rewards-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.learning-rewards-heading>div{min-width:0}.learning-rewards-eyebrow{font-size:11px;letter-spacing:.08em;color:var(--reward-muted);margin-bottom:12px}.learning-rewards h2{font-size:clamp(22px,3vw,30px);line-height:1.25;letter-spacing:-.04em;overflow-wrap:anywhere;margin:0 0 20px}.learning-xp-total{display:flex;align-items:center;gap:13px;min-width:0}.learning-xp-total>strong{font-size:clamp(28px,5vw,44px);line-height:1.15;font-variant-numeric:tabular-nums;letter-spacing:-.05em}.learning-xp-total>strong>span{font-size:.43em;letter-spacing:.01em;color:var(--reward-accent);font-weight:650}.learning-xp-emblem{width:45px;height:45px;display:grid;place-items:center;flex-shrink:0;border-radius:50%;border:1px solid #a7c6ec60;color:var(--reward-accent);background:radial-gradient(circle at 30% 25%,#a4c8ee3b,#5b7fa22b 65%,#151d28);box-shadow:inset 0 2px 2px #edf6ff20,0 4px 14px #0003}.learning-xp-emblem>svg{width:29px;height:29px}.learning-rewards-art{object-fit:contain;width:clamp(90px,16vw,150px);height:auto;flex-shrink:0;filter:drop-shadow(0 12px 20px #0004)}.learning-xp-meter{appearance:none;-webkit-appearance:none;display:block;width:100%;height:15px;margin-top:24px;background:#090b10;border:1px solid #75819155;border-radius:999px;overflow:hidden;color:var(--reward-accent)}.learning-xp-meter::-webkit-progress-bar{background:#090b10;border-radius:999px}.learning-xp-meter::-webkit-progress-value{background:linear-gradient(90deg,#b9d8f8,#f0f6ff);border-radius:999px;box-shadow:0 0 12px #c4e1ff40;transition:width .3s ease}.learning-xp-meter::-moz-progress-bar{background:linear-gradient(90deg,#b9d8f8,#f0f6ff);border-radius:999px}.learning-rewards-next{font-size:14px;line-height:1.65;color:#d8e1eb;margin:14px 0 0;overflow-wrap:anywhere}.learning-rewards-breakdown{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0 0}.learning-rewards-breakdown>div{min-width:0;border-radius:14px;border:1px solid #68788c4d;background:#edf6ff04;padding:16px}.learning-rewards-breakdown dt{font-size:12px;line-height:1.55;color:#dce5ef;min-height:2.9em;overflow-wrap:anywhere}.learning-rewards-breakdown dd{display:flex;flex-direction:column;gap:9px;margin:12px 0 0}.learning-rewards-breakdown dd>strong{font-size:28px;line-height:1;font-weight:650;font-variant-numeric:tabular-nums}.learning-rewards-breakdown dd>span{font-size:11px;line-height:1.55;color:var(--reward-muted);overflow-wrap:anywhere}.learning-milestones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:25px}.learning-milestone{min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:#b0bdca}.learning-milestone-symbol{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#11161d;border:1px solid #626e7e75;color:#8b9db2}.learning-milestone-symbol>svg{width:25px;height:25px}.learning-milestone>strong{font-size:16px;line-height:1;font-variant-numeric:tabular-nums}.learning-milestone>span:last-child{font-size:10px;line-height:1.4;overflow-wrap:anywhere}.learning-milestone[data-reached=true]{color:var(--reward-accent)}.learning-milestone[data-reached=true] .learning-milestone-symbol{background:#d5e8ff;color:#172437;border-color:#edf6ff;box-shadow:0 0 0 4px #d5e8ff09}.learning-rewards-footnote{font-size:11px;line-height:1.65;color:var(--reward-muted);margin:22px 0 0;overflow-wrap:anywhere}.learning-rewards-rules{margin-top:16px;border-top:1px solid #6d7f9655;padding-top:12px}.learning-rewards-rules summary{cursor:pointer;min-height:44px;align-content:center;font-size:12px;line-height:1.7;color:#e2ebf5}.learning-rewards-rules summary:focus-visible{outline:3px solid #e2ebf5;outline-offset:4px;border-radius:4px}.learning-rewards-rules p{font-size:12px;color:var(--reward-muted);line-height:1.7;margin:12px 0 0}.learning-rewards-compact{display:flex;align-items:center;gap:15px;border-radius:17px;padding:18px 20px}.learning-xp-compact-main{flex:1;min-width:0}.learning-rewards-compact .learning-xp-total{justify-content:space-between;flex-wrap:wrap;gap:8px}.learning-rewards-compact .learning-xp-total>strong{font-size:25px}.learning-rewards-compact .learning-xp-total>span{font-size:11px;line-height:1.5;color:var(--reward-muted)}.learning-rewards-compact .learning-xp-meter{height:9px;margin-top:10px}.learning-rewards-compact .learning-rewards-footnote{font-size:10px;margin-top:8px}.learning-reward-notice{display:flex;align-items:center;gap:15px;border:1px solid #9fc5ed66;border-radius:18px;padding:18px 20px;margin:18px 0;background:linear-gradient(115deg,#34485b,#202a34 60%);color:#f2f7ff;animation:learning-reward-enter .45s ease-out both}.learning-reward-notice>div{min-width:0}.learning-reward-notice strong{font-size:18px;line-height:1.4;font-variant-numeric:tabular-nums}.learning-reward-notice p{font-size:13px;line-height:1.6;margin-top:5px;color:#d3e0ee}.learning-reward-notice .learning-xp-emblem{animation:learning-reward-spark .65s ease-out both}@keyframes learning-reward-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes learning-reward-spark{0%{transform:scale(.8) rotate(-12deg)}65%{transform:scale(1.08) rotate(4deg)}100%{transform:scale(1) rotate(0)}}@media(max-width:600px){.learning-rewards{padding:22px 19px;border-radius:19px}.learning-rewards-heading{gap:10px}.learning-rewards-art{width:92px}.learning-rewards h2{font-size:23px}.learning-rewards-breakdown{gap:8px}.learning-rewards-breakdown>div{padding:12px 10px}.learning-rewards-breakdown dt{font-size:11px;min-height:3.4em}.learning-rewards-breakdown dd>strong{font-size:24px}.learning-rewards-breakdown dd>span{font-size:10px}.learning-milestones{gap:8px}.learning-rewards-compact{padding:16px 17px}.learning-reward-notice{padding:17px;gap:12px}.learning-reward-notice strong{font-size:17px}.learning-rewards-eyebrow{font-size:10px;letter-spacing:.04em}}@media(max-width:360px){.learning-rewards-heading{align-items:flex-start}.learning-rewards-art{width:66px}.learning-rewards h2{font-size:21px}.learning-rewards-breakdown{grid-template-columns:1fr}.learning-rewards-breakdown>div{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:12px}.learning-rewards-breakdown dt{min-height:0;font-size:12px}.learning-rewards-breakdown dd{margin:0;align-items:flex-end;gap:6px}.learning-rewards-breakdown dd>span{max-width:100px;text-align:right}.learning-rewards-compact .learning-xp-emblem{width:35px;height:35px}.learning-rewards-compact .learning-xp-total>strong{font-size:23px}}@media(prefers-reduced-motion:reduce){.learning-reward-notice,.learning-reward-notice .learning-xp-emblem{animation:none}.learning-xp-meter::-webkit-progress-value{transition:none}}
.learning-rewards{--reward-accent:#58b8ff;--reward-muted:#c7ced7;--reward-line:#42454c;background:#202227;border:2px solid #0d0e12;box-shadow:0 5px 0 #0a0b0e}.learning-xp-emblem{color:#202227;background:#ffd35a;border:2px solid #11151d;box-shadow:inset 0 -4px 0 #e1ac35,0 3px 0 #101116}.learning-xp-total>strong{color:#fff4dc}.learning-xp-meter{border-color:#11151d;background:#101318}.learning-xp-meter::-webkit-progress-bar{background:#101318}.learning-xp-meter::-webkit-progress-value{background:linear-gradient(90deg,#58b8ff,#bfe7ff);box-shadow:none}.learning-xp-meter::-moz-progress-bar{background:linear-gradient(90deg,#58b8ff,#bfe7ff)}.learning-rewards-breakdown>div{border:1px solid #0d1118;background:#223447;box-shadow:0 3px 0 #101318}.learning-rewards-breakdown>div:nth-child(2){background:#3a3324}.learning-rewards-breakdown>div:nth-child(3){background:#3c2d33}.learning-rewards-breakdown>div:nth-child(1) dd>strong{color:#86cdff}.learning-rewards-breakdown>div:nth-child(2) dd>strong{color:#ffd35a}.learning-rewards-breakdown>div:nth-child(3) dd>strong{color:#ffaaa8}.learning-rewards-breakdown dt{color:#fff4dc}.learning-milestone-symbol{background:#292e37;border:2px solid #13171e;color:#9fc6e6;box-shadow:0 3px 0 #101318}.learning-milestone[data-reached=true]{color:#fff4dc}.learning-milestone[data-reached=true] .learning-milestone-symbol{color:#202227;background:#ffd35a;border-color:#171b23;box-shadow:inset 0 -3px 0 #e1ac35,0 3px 0 #101318}.learning-reward-notice{border:2px solid #58b8ff;background:#20374b;color:#fff4dc;box-shadow:0 5px 0 #101318}.learning-reward-notice p{color:#e2eff9}
