.jc-banner{--jc-ink:7,30,40;--jc-light:132,233,211;position:relative;isolation:isolate;min-height:292px;overflow:hidden;background:#092f40;color:#fff;display:flex;align-items:center;padding:35px 38px 51px}
.jc-banner-sunrise{--jc-ink:57,30,35;--jc-light:255,201,132;background:#502e32}
.jc-banner-indigo{--jc-ink:25,28,66;--jc-light:182,182,255;background:#202e53}
.jc-banner-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3;pointer-events:none}
.jc-banner-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(var(--jc-ink),.96),rgba(var(--jc-ink),.82) 26%,rgba(var(--jc-ink),.15) 62%,transparent),linear-gradient(0deg,rgba(var(--jc-ink),.8),transparent 36%)}
.jc-banner::after{content:"";position:absolute;inset:12px;border:1px solid rgba(var(--jc-light),.16);border-radius:10px;pointer-events:none;z-index:-1}
.jc-banner-copy{width:48%;max-width:370px;position:relative}
.jc-banner-copy>p{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:.61rem;line-height:1.5;font-weight:650;letter-spacing:.15em;text-transform:uppercase;color:#d0eee6}
.jc-banner-copy>p>span{width:6px;height:6px;border-radius:50%;background:rgb(var(--jc-light));box-shadow:0 0 16px rgba(var(--jc-light),.7);flex-shrink:0}
.jc-banner-copy h2{font-family:Georgia,serif;font-size:clamp(1.65rem,3.3vw,2.55rem);font-weight:500;line-height:1.13;letter-spacing:-.035em;color:#fff;margin:0 0 23px;text-wrap:balance;text-shadow:0 2px 16px #061c3866}
.jc-banner-stage{display:inline-flex;align-items:center;gap:7px;border:1px solid #ffffff45;border-radius:30px;padding:6px 11px;background:#062c3c70;font-size:.7rem;line-height:1.4;max-width:100%;color:#f8f5ea}
.jc-stage-steps{display:flex;align-items:center;gap:3px}.jc-stage-steps i{width:4px;height:10px;display:block;background:#ffffff30;border-radius:3px}.jc-stage-steps i.is-reached{background:var(--theme-tint, #bce6db)}.jc-stage-steps i:nth-child(2){height:13px}.jc-stage-steps i:nth-child(3){height:16px}.jc-stage-steps i:nth-child(4){height:19px}.jc-level-1 .jc-banner-stage{border-color:#dba883}.jc-level-2 .jc-banner-stage{border-color:var(--theme-border, #d4e3ee)}.jc-level-3 .jc-banner-stage{border-color:#f2cc77;background:#60491990}.jc-level-3 .jc-stage-steps i.is-reached{background:var(--theme-warm-bg, #f2cc77)}
.jc-canvas-emblem{position:absolute;right:26px;top:48px;width:58px;height:58px;color:#bce6db;filter:drop-shadow(0 3px 12px #061b36)}.jc-canvas-emblem svg{display:block;width:100%;height:100%;fill:#0a304466;stroke:currentColor;stroke-width:.8}.jc-canvas-emblem path{fill:currentColor;stroke:none;opacity:.85}.jc-level-1 .jc-canvas-emblem{color:#e3b593}.jc-level-2 .jc-canvas-emblem{color:#d9ecf5}.jc-level-3 .jc-canvas-emblem{color:#ffdb89;filter:drop-shadow(0 0 14px #b4874d88)}
.jc-banner-caption{position:absolute;right:26px;bottom:21px;font-size:.62rem;line-height:1.4;color:#f0fbf7;letter-spacing:.035em;text-shadow:0 1px 7px #05273d}.jc-banner-caption>span{color:rgb(var(--jc-light));font-size:.58rem;letter-spacing:.12em}.jc-banner-ai{position:absolute;top:20px;right:24px;border:1px solid #ffffff40;border-radius:4px;background:#092f45dd;padding:2px 5px;font-size:.55rem;color:#fff}
.jc-banner-preview{border:1px solid var(--theme-border, #d9e4e2);border-radius:18px;overflow:hidden;margin:22px 0 8px}.jc-banner-preview .jc-banner{min-height:280px}
.jc-banner-help{color:var(--theme-muted, #526d75);font-size:.82rem;line-height:1.6;margin:9px 0 24px}
.jc-milestones{margin:28px 0}.jc-milestone-heading h2,.jc-milestones-private h2{font-size:1.25rem;line-height:1.35;margin:0 0 6px}.jc-milestone-heading>p,.jc-milestones-private>p{font-size:.86rem;line-height:1.65;color:var(--theme-muted, #526d75);margin:0 0 18px}
.jc-milestone-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.jc-milestone{background:var(--theme-surface, #fff);border:1px solid var(--theme-border, #d9e4e2);border-radius:14px;padding:18px;min-width:0}.jc-milestone-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:17px}.jc-medallion{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;border-radius:12px;border:1px solid var(--theme-border, #d0e3df);background:var(--theme-soft, #f0f6f4);color:var(--theme-muted, #537871);font-size:1.3rem}.jc-earned-1 .jc-medallion{background:var(--theme-warm-bg, #fbede2);color:var(--theme-warm, #865534);border-color:var(--theme-border, #eacdb6)}.jc-earned-2 .jc-medallion{background:var(--theme-soft, #eaf0f6);color:var(--theme-muted, #3d5b76);border-color:var(--theme-border, #c4d2df)}.jc-earned-3 .jc-medallion{background:var(--theme-soft, #fbf1d3);color:var(--theme-muted, #735920);border-color:var(--theme-border, #e5d194)}.jc-milestone-state{color:var(--theme-muted, #607574);font-size:.64rem;font-weight:600}.jc-milestone-category{color:var(--theme-accent, #14746f);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;line-height:1.5;margin:0 0 5px}.jc-milestone h3{font-size:1rem;line-height:1.4;margin:0 0 12px;min-height:2.8em;color:var(--theme-text, #0b2d40)}.jc-milestone-total{font-size:.75rem;color:var(--theme-muted, #526d75);line-height:1.6;min-height:2.9em;margin:0 0 12px}.jc-milestone-total strong{font-size:1.15rem;color:var(--theme-text, #0b2d40)}.jc-milestone progress{display:block;width:100%;height:6px;border:0;border-radius:10px;margin:0 0 9px;accent-color:#087f78;background:var(--theme-soft, #eaf2ee);overflow:hidden}.jc-milestone progress::-webkit-progress-bar{background:var(--theme-soft, #eaf2ee)}.jc-milestone progress::-webkit-progress-value{background:#087f78;border-radius:10px}.jc-milestone small,.jc-milestone-complete{font-size:.7rem;line-height:1.5;color:var(--theme-muted, #526d75);margin:0}.jc-milestone-rules{margin-top:15px;padding:14px 17px;border:1px solid var(--theme-border, #d9e4e2);border-radius:12px;background:var(--theme-soft, #f2f7f4);font-size:.8rem;line-height:1.7;color:var(--theme-muted, #405e64)}.jc-milestone-rules summary{cursor:pointer;font-weight:600}.jc-milestone-rules li{margin:8px 0}.jc-milestone-rules ul{padding-left:20px}.jc-milestone-rules p{margin-bottom:0}.jc-milestones-private{border:1px solid var(--theme-border, #d9e4e2);padding:20px;border-radius:14px;background:var(--theme-soft, #f2f7f4)}.jc-milestones-private>p{margin:0}
@media(max-width:680px){.jc-banner{min-height:300px;padding:30px 23px 50px;align-items:flex-end}.jc-banner-copy{width:88%;max-width:300px}.jc-banner-art{object-position:66% center}.jc-banner-shade{background:linear-gradient(90deg,rgba(var(--jc-ink),.82),rgba(var(--jc-ink),.08)),linear-gradient(0deg,rgba(var(--jc-ink),.94),rgba(var(--jc-ink),.55) 48%,transparent)}.jc-banner-copy h2{font-size:1.95rem;max-width:245px;margin-bottom:18px}.jc-banner-copy>p{font-size:.54rem;letter-spacing:.09em}.jc-banner-stage{font-size:.65rem}.jc-banner-caption{right:22px;bottom:21px;font-size:.54rem}.jc-canvas-emblem{width:45px;height:45px;top:48px;right:20px}.jc-banner-preview .jc-banner{min-height:300px}.jc-milestone-grid{grid-template-columns:1fr}.jc-milestone{display:grid;grid-template-columns:1fr auto;column-gap:14px;align-items:start}.jc-milestone-top{grid-column:2;grid-row:1/4;flex-direction:column;margin:0}.jc-milestone h3,.jc-milestone-total{min-height:0}.jc-milestone progress,.jc-milestone>small,.jc-milestone-complete{grid-column:1/-1}.jc-milestone-category{margin-top:0}}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.jc-banner-art{transition:transform 1.1s ease}.jc-banner:hover .jc-banner-art{transform:scale(1.025)}}