.rank-badge{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.rank-badge i{border-style:solid;border-radius:50%;display:block;position:absolute;transform:translate(-50%,-50%)}.rank-badge b{z-index:1;font-family:var(--font-serif),serif;font-weight:800}.rank-growing .rank-new-ring{animation:1.6s .35s both rank-ring}.rank-mastery{color:#2f4b3c;background:#e8eddf;border-radius:16px;align-items:center;gap:12px;padding:14px;animation:.5s both rank-banner;display:flex}.rank-mastery p{margin:4px 0 0;font-size:12px}.rank-overlay{z-index:1000;color:#eadcc3;overscroll-behavior:contain;background:#17261c88;justify-content:center;align-items:center;animation:.42s both rank-fade;display:flex;position:fixed;inset:0;overflow:auto}.rank-title,.rank-master{background:#1b2e24}.rank-star{align-items:flex-end}.rank-dialog{isolation:isolate;width:min(100%,520px);padding:32px 24px max(28px,env(safe-area-inset-bottom));text-align:center;position:relative;overflow:hidden}.rank-star .rank-dialog{background:#1b2e24;border-radius:28px 28px 0 0;animation:.42s both rank-up}.rank-kicker{letter-spacing:3px;color:#bfd89a;margin-bottom:18px;font-size:12px}.rank-celebration-badge{justify-content:center;display:flex;position:relative}.rank-old{animation:.5s .3s both rank-old;position:absolute}.rank-title .rank-incoming,.rank-master .rank-incoming{animation:.9s .8s both rank-arrive}.rank-dialog h2{margin:20px 0 8px;font-size:30px;font-weight:700;animation:.6s 1s both rank-fade}.rank-dialog p{line-height:1.7}.rank-master .rank-count,.rank-reason{animation:.5s 1.2s both rank-fade}.rank-reason{color:#b9c4b0;margin-top:8px;font-size:13px}.rank-next{background:#ffffff09;border:1px solid #52604c;border-radius:14px;margin:22px auto 0;padding:14px;animation:.5s 1.5s both rank-fade}.rank-next small{color:#b9c4b0}.rank-actions{gap:8px;margin-top:24px;animation:.5s 1.5s both rank-fade;display:grid}.rank-actions button{cursor:pointer;border-radius:14px;min-height:48px;padding:14px}.rank-actions button:first-child{color:#1b2e24;background:#d8bf96;font-weight:700}.rank-actions button:focus-visible{outline-offset:3px;outline:3px solid #bfd89a}.rank-ripples{z-index:-1;position:absolute;top:100px;left:50%}.rank-ripples i{opacity:0;border:1px solid #bfd89a;border-radius:50%;width:120px;height:120px;animation:1.8s both rank-ripple;position:absolute;top:-60px;left:-60px}.rank-ripples.ember i{border-color:#e0945a}.rank-master .rank-badge i{animation:rank-fade .4s var(--ring-delay) both}.rank-stats{justify-content:space-around;margin-top:20px;display:flex}.rank-stats b,.rank-stats small{display:block}.rank-stats b{font-size:24px}.rank-stats small{color:#b9c4b0;font-size:11px}.rank-route-text{margin-top:18px;font-size:13px;animation:.5s 1.5s both rank-fade}.rank-finished *{animation:none!important}.rank-finished .rank-old,.rank-finished .rank-ripples{display:none}.rank-bar{background:#e2d6c2;border-radius:9px;height:5px;overflow:hidden}.rank-bar>i{background:#2f4b3c;height:100%;transition:width .6s;display:block}.rank-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.rank-card{text-align:left;cursor:pointer;background:#fbf7ef;border:1px solid #e2d6c2;border-radius:18px;min-width:0;padding:18px 14px}.rank-card[aria-expanded=true]{border-color:#2f4b3c;box-shadow:0 0 0 2px #e8eddf}.rank-card-head{align-items:center;gap:12px;margin-bottom:12px;display:flex}.rank-card p{color:#6a6257;margin:10px 0;font-size:12px}.rank-new{color:#8a4a22;background:#f6e1cf;border-radius:20px;padding:2px 7px;font-size:11px}.rank-near{color:#8a4a22;background:#f6e1cf;border-radius:14px;margin-top:10px;padding:12px 14px;font-size:13px;display:block}.rank-chip{align-items:center;gap:7px;font-size:12px;display:inline-flex}.rank-state{color:#6a6257;padding:16px 0;font-size:14px}@media (max-width:640px){.rank-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.rank-card{padding:12px}.rank-card-head{flex-wrap:wrap;gap:6px}.rank-detail{padding:18px}.rank-dialog h2{font-size:26px}.rank-dialog{padding:24px 18px}}@keyframes rank-ring{0%{border-color:#bfd89a;transform:translate(-50%,-50%)scale(.55)}to{transform:translate(-50%,-50%)scale(1)}}@keyframes rank-fade{0%{opacity:0}to{opacity:1}}@keyframes rank-banner{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes rank-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes rank-ripple{0%{opacity:.3;transform:scale(.5)}to{opacity:0;transform:scale(6)}}@keyframes rank-old{to{opacity:0;transform:scale(.4)}}@keyframes rank-arrive{0%{opacity:0;transform:scale(.4)rotate(-12deg)}70%{opacity:1;transform:scale(1.06)rotate(2deg)}to{opacity:1;transform:scale(1)rotate(0)}}@media (prefers-reduced-motion:reduce){.rank-overlay,.rank-mastery{animation:.2s both rank-fade}.rank-overlay *,.rank-growing .rank-new-ring{animation:none!important}.rank-ripples,.rank-old{display:none}.rank-bar>i{transition:none}}.rank-stars span{display:inline-block}.rank-star-pop{animation:.6s 1s both rank-star-pop}@keyframes rank-star-pop{0%{opacity:0;transform:scale(2.2)}65%{opacity:1;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.rank-handle{background:#ffffff40;border-radius:4px;width:36px;height:4px;margin:-12px auto 22px}.rank-next .rank-bar{background:#ffffff20;margin-bottom:12px}.rank-next .rank-bar>i{background:#bfd89a}.rank-count-window{vertical-align:bottom;font-variant-numeric:tabular-nums;height:1.7em;display:inline-block;position:relative;overflow:hidden}.rank-count-window>span{position:absolute;inset:0}.rank-count-old{animation:.5s 1.2s both rank-count-out}.rank-count-new{animation:.5s 1.2s both rank-count-in}.rank-finished .rank-count-old{display:none}@keyframes rank-count-out{to{opacity:0;transform:translateY(-100%)}}@keyframes rank-count-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.rank-count-old{display:none}}.rank-detail{background:#fbf7ef;border:1px solid #e6dac6;border-radius:24px;grid-template-columns:300px minmax(0,1fr);align-items:start;gap:36px;margin-top:20px;padding:26px;display:grid}.rank-hero{text-align:center;flex-direction:column;align-items:center;gap:6px;display:flex}.rank-hero h2{margin-top:10px;font-size:24px;font-weight:700}.rank-hero p{color:#6a6257;font-size:13px}.rank-hero .rank-bar{width:100%;margin:6px 0 2px}.rank-hero .rank-route-wrap{width:100%;margin-top:14px}.rank-recent{color:#6a6257;text-align:left;align-self:flex-start;margin-top:8px;font-size:12px;line-height:1.7}.rank-route{grid-template-columns:repeat(10,1fr);align-items:center;height:22px;display:grid;position:relative}.rank-route:before{content:"";background:#e2d6c2;height:2px;position:absolute;top:50%;left:5%;right:5%;transform:translateY(-50%)}.rank-route-fill{background:#2f4b3c;height:2px;transition:width .6s;position:absolute;top:50%;left:5%;transform:translateY(-50%)}.rank-route i{background:#fbf7ef;border:2px solid #e2d6c2;border-radius:50%;justify-self:center;width:14px;height:14px;position:relative}.rank-route i.done{background:#2f4b3c;border-color:#2f4b3c}.rank-route i.next{border-color:#2f4b3c;box-shadow:0 0 0 4px #e8eddf}.rank-route i.top{border-color:#e0945a;width:18px;height:18px}.rank-route i.top.done{background:#e0945a}.rank-route-labels{color:#6a6257;text-align:center;grid-template-columns:3fr 3fr 3fr 1fr;margin-top:6px;font-size:11px;display:grid}.rank-route-labels .cur{color:#2f4b3c;font-weight:700}.rank-lists{flex-direction:column;gap:10px;min-width:0;display:flex}.rank-group{flex-direction:column;gap:10px;display:flex}.rank-group-head{justify-content:space-between;align-items:baseline;margin-top:6px;display:flex}.rank-group-head h3{font-size:14px;font-weight:700}.rank-group-head span{color:#6a6257;font-size:12px}.rank-course{color:inherit;background:#f3ece0;border-radius:16px;grid-template-columns:1fr auto;align-items:center;gap:8px 12px;padding:14px 16px;text-decoration:none;display:grid}.rank-course:hover{box-shadow:0 0 0 2px #c5d0be}.rank-course:focus-visible{outline-offset:2px;outline:3px solid #2f4b3c}.rank-course-title{min-width:0;font-size:15px;font-weight:600}.rank-course b{font-family:var(--font-serif),serif;font-variant-numeric:tabular-nums;font-size:18px}.rank-course .rank-bar.thin{grid-column:1/3;height:4px}.rank-course-next{color:#6a6257;grid-column:1/3;align-items:center;gap:8px;font-size:12px;display:flex}.rank-course-next small{font-size:12px}.rank-tag{color:#2f4b3c;background:#e8eddf;border-radius:99px;padding:2px 8px;font-size:11px;font-style:normal;font-weight:700}.rank-tag.ember{color:#8a4a22;background:#f6e1cf}.rank-more{color:#2f4b3c;cursor:pointer;align-self:flex-start;min-height:44px;padding:0 4px;font-size:13px}.rank-more:focus-visible{outline-offset:2px;outline:3px solid #2f4b3c}.rank-fold{background:#f3ece0;border-radius:16px;overflow:hidden}.rank-fold summary{cursor:pointer;justify-content:space-between;align-items:center;min-height:48px;padding:0 16px;font-size:14px;list-style:none;display:flex}.rank-fold summary::-webkit-details-marker{display:none}.rank-fold summary small{color:#6a6257;font-size:13px}.rank-fold summary small:after{content:" · 展开"}.rank-fold[open] summary small:after{content:" · 收起"}.rank-fold>.rank-course{background:0 0;border-top:1px solid #e2d6c2;border-radius:0}@media (max-width:860px){.rank-detail{grid-template-columns:minmax(0,1fr);gap:24px;padding:18px}}.rank-recent span{white-space:nowrap;margin-right:12px;display:inline-block}
