.reward-sequence{width:min(620px,calc(100% - 32px));text-align:left;padding:28px 32px}.reward-topline{display:flex;align-items:center;justify-content:space-between;gap:16px}.reward-topline .eyebrow{margin:0;font:9px 'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--muted)}.reward-sequence .reward-skip{font-size:11px;min-height:40px;margin:0;padding:6px 0}.reward-sequence h2{font-size:34px;margin:18px 0 12px}.reward-subtitle{font-size:14px;line-height:1.6;color:var(--muted);margin:0 0 26px;text-wrap:pretty}.reward-track{position:relative;padding:16px 0}.reward-character{border:1px solid var(--line);border-radius:6px;padding:20px;background:var(--reward-tint)}.reward-track-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.reward-track-heading strong{font-size:14px;font-weight:550}.reward-gain{font:13px 'IBM Plex Mono',monospace;color:var(--accent);font-variant-numeric:tabular-nums}.reward-track-stats{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font:10px 'IBM Plex Mono',monospace;margin:12px 0 10px;font-variant-numeric:tabular-nums}.reward-bar{height:5px;border-radius:2px;background:var(--line);overflow:hidden}.reward-fill{display:block;width:100%;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left center}.reward-skills{padding-top:24px}.reward-skills>.eyebrow{font:9px 'IBM Plex Mono',monospace;letter-spacing:.12em;margin:0 0 4px;color:var(--muted)}.reward-skills .reward-track+.reward-track{border-top:1px solid var(--line)}.reward-skills .reward-fill{background:var(--reward)}.reward-level-up{display:inline-block;font:9px 'IBM Plex Mono',monospace;letter-spacing:.08em;color:var(--green);margin-top:10px}.reward-track[data-level-up=true] .reward-bar{box-shadow:0 0 12px var(--reward-glow)}.reward-class{display:flex;align-items:center;flex-wrap:wrap;gap:18px;padding:22px 0;margin-top:14px;border-block:1px solid var(--reward-rule)}.reward-class .class-insignia{width:76px;height:90px;margin:0;filter:none}.reward-class-copy{flex:1;min-width:160px}.reward-class-copy .eyebrow{font:9px 'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--accent);margin:0 0 8px}.reward-class h3{font-size:23px;font-weight:550;letter-spacing:-.025em;margin:0 0 8px}.reward-class-copy>p:last-child{font-size:12px;line-height:1.6;color:var(--muted);margin:0}.reward-sequence .reward-equip{margin:0 0 0 94px;color:var(--accent);min-height:40px;font-size:12px}.reward-status{font-size:11px;line-height:1.6;color:var(--muted);margin:22px 0}.reward-actions{display:flex;gap:12px;justify-content:space-between}.reward-sequence .reward-actions button{font-size:12px;min-height:44px;flex:1;width:auto;padding:10px 16px}.reward-sequence .error{margin:14px 0;font-size:12px}
@media(max-width:760px){.reward-sequence{padding:22px 20px}.reward-sequence h2{font-size:29px}.reward-subtitle{font-size:13px}.reward-topline .eyebrow{font-size:8px}.reward-character{padding:16px}.reward-class{gap:14px}.reward-class .class-insignia{width:62px;height:74px}.reward-class-copy{min-width:140px}.reward-class h3{font-size:21px}.reward-sequence .reward-equip{margin-left:76px}.reward-actions{gap:8px}.reward-sequence .reward-actions button{font-size:11px;padding:10px}}
@media(prefers-reduced-motion:reduce){.reward-sequence{animation:none}.reward-track[data-level-up=true] .reward-bar{box-shadow:none}}
.reward-sequence{max-width:620px;overflow:hidden}.reward-sequence[open]{display:flex;flex-direction:column}.reward-topline,.reward-actions{flex:none}.reward-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 10px;margin:0 -10px}.reward-actions{padding-top:18px;background:var(--surface)}.reward-class[data-pending=true]{visibility:hidden}.reward-class[data-pending=false]{visibility:visible}.reward-sequence .reward-status{min-height:2.8em}
.reward-topline{min-height:40px}
.reward-milestones{border-bottom:1px solid var(--line);padding:12px 0}.reward-milestones>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0}.reward-milestones strong{font-size:12px;font-weight:500;color:var(--accent)}.reward-milestones span{font-size:10px;color:var(--muted)}