.morality-rank-stars{display:flex;align-items:center;justify-content:center;gap:2px;margin-top:2px;line-height:1}
.rank-star-mark{display:inline-grid;place-items:center;flex:none;width:14px;height:14px;color:var(--metal);opacity:.32;filter:saturate(.55)}
.rank-star-mark svg{display:block;width:100%;height:100%;overflow:visible}
.rank-star-mark .star-outline{fill:var(--depth);stroke:var(--shine);stroke-width:.9;stroke-linejoin:round}
.rank-star-mark .star-core{fill:var(--metal)}
.rank-star-mark .star-facet{fill:var(--shine);opacity:.8}
.rank-star-mark .star-cut{fill:none;stroke:var(--shine);stroke-width:.65;opacity:.75}
.rank-star-mark.is-earned{opacity:1;filter:drop-shadow(0 0 2px var(--shine)) drop-shadow(0 1px 1px var(--depth))}
.rank-promotion[open]{display:block;position:fixed;inset:0;width:100%;min-width:100%;max-width:100%;height:100dvh;max-height:100dvh;box-sizing:border-box;margin:0;padding:0;border:0;border-radius:0;overflow:auto;background:#060c19;color:#fff;z-index:99999;transform:none;cursor:pointer;touch-action:manipulation}
.rank-promotion::backdrop{background:#060c19}
.promotion-stage{--metal:#aa7145;--shine:#f3d3a4;--depth:#6c442a;--gem:#d5a36e;position:relative;isolation:isolate;width:100%;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:35px 24px 24px;overflow:hidden;text-align:center;box-sizing:border-box}
.promotion-aura{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--gem) 27%,transparent),transparent 58%)}
.promotion-aura::after{content:'';position:absolute;left:50%;top:43%;width:300px;height:300px;border:1px solid var(--shine);border-radius:50%;transform:translate(-50%,-50%);opacity:0;animation:promotion-ring 2s 1.4s ease-out both}
.promotion-kicker{font-size:13px;font-weight:600;letter-spacing:4px;color:#e1d4b4;margin:0 0 12px;text-shadow:0 0 12px color-mix(in srgb,var(--gem) 50%,transparent)}
.promotion-stars{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:14px}
.promotion-stars .rank-star-mark{position:relative;width:34px;height:34px;opacity:1;filter:drop-shadow(0 0 6px var(--gem)) drop-shadow(0 0 14px color-mix(in srgb,var(--gem) 45%,transparent));animation:promotion-star .55s ease-out both}
.promotion-stars .rank-star-mark:nth-child(2){width:43px;height:43px;animation-delay:.4s}
.promotion-stars .rank-star-mark:nth-child(3){animation-delay:.8s}
.promotion-emblem{position:relative;isolation:isolate;width:clamp(180px,27vh,280px);height:clamp(180px,27vh,280px);display:grid;place-items:center;animation:promotion-crest 1s 1.3s both}.promotion-emblem>span{font-size:25px;font-weight:800;color:var(--shine);text-shadow:0 2px 12px #000}.promotion-emblem .rank-panel{fill:#0c172c}.promotion-emblem .rank-frame-art{filter:drop-shadow(0 0 12px color-mix(in srgb,var(--gem) 50%,transparent))}
.promotion-title{font-size:clamp(30px,5vw,46px);letter-spacing:10px;margin:20px 0 10px;color:var(--shine);animation:promotion-text .65s 1.7s both}.promotion-name{font-size:24px;font-weight:700;margin:0 0 10px;overflow-wrap:anywhere}.promotion-route{font-size:16px;color:#d6deee;margin:0}.promotion-route span{padding:0 15px;color:var(--shine)}.promotion-score{font-size:13px;color:#a9b6ca;margin:10px 0 0}
.promotion-tap-hint{font-size:12px;letter-spacing:2px;color:#b9c5d7;margin:20px 0 0;opacity:.8;animation:promotion-text .5s 2s both}
.rank-promotion:focus-visible{outline:2px solid var(--shine,#f1d8a0);outline-offset:-8px}
.promotion-rays{position:absolute;left:50%;top:43%;z-index:-1;pointer-events:none}.promotion-rays i{position:absolute;width:2px;height:90px;background:linear-gradient(transparent,var(--shine),transparent);opacity:0;transform:rotate(var(--angle)) translateY(-150px);animation:promotion-ray 1.6s calc(1.4s + var(--delay)) ease-out both}
@keyframes promotion-star{from{opacity:0;transform:scale(.2) translateY(12px)}70%{transform:scale(1.2)}to{opacity:1;transform:scale(1)}}
@keyframes promotion-crest{from{opacity:0;transform:scale(.65) translateY(20px)}65%{opacity:1;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}
@keyframes promotion-text{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes promotion-ring{from{opacity:.65;transform:translate(-50%,-50%) scale(.55)}to{opacity:0;transform:translate(-50%,-50%) scale(2.5)}}
@keyframes promotion-ray{15%{opacity:.65}to{opacity:0;transform:rotate(var(--angle)) translateY(-400px)}}
@media(max-width:600px){.morality-rank-stars{gap:1px;margin-top:0}.morality-rank-stars .rank-star-mark{width:12px;height:12px}.promotion-stage{padding:24px 16px max(24px,env(safe-area-inset-bottom))}.promotion-kicker{letter-spacing:2px}.promotion-title{letter-spacing:6px}.promotion-stars .rank-star-mark{width:28px;height:28px}.promotion-stars .rank-star-mark:nth-child(2){width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.rank-promotion *{animation:none!important}.promotion-rays,.promotion-aura::after{display:none}}

.promotion-stage.rank-silver { --metal:#8197ac; --shine:#eef5ff; --depth:#445a72; --gem:#bddef2; }
.promotion-stage.rank-gold { --metal:#d5a12a; --shine:#fff0a0; --depth:#846018; --gem:#f4c13a; }
.promotion-stage.rank-platinum { --metal:#37a39a; --shine:#c4fff0; --depth:#256a74; --gem:#56ead6; }
.promotion-stage.rank-diamond { --metal:#548fdd; --shine:#d9f5ff; --depth:#364987; --gem:#7bd8ff; }
.promotion-stage.rank-star { --metal:#9165cf; --shine:#f0d9ff; --depth:#553274; --gem:#d09cff; }
.promotion-stage.rank-king { --metal:#cc8324; --shine:#fff2be; --depth:#814822; --gem:#ef6354; }
.promotion-stage.rank-legend { --metal:#d47836; --shine:#fff2ad; --depth:#9c3d32; --gem:#fa8b4e; }
.promotion-stage.rank-myth { --metal:#b55798; --shine:#ffe1ac; --depth:#643065; --gem:#f69be3; }
.promotion-stage.rank-practice { --metal:#9b9ba1; --shine:#e7e8ec; --depth:#676874; --gem:#aeb1bb; }
.promotion-stage.rank-warning { --metal:#cc5252; --shine:#ffdddd; --depth:#9b3038; --gem:#e85454; }