/* ASCENSION (Ranked V2) and CASUAL REPUTATION's looks (src/ui/ascension.js draws them; docs/ranked/ASCENSION_SYSTEM.md).
   A tier's colour comes in as --asc and a Reputation title's as --rep (ASC_UI in ascension.js); everything else reuses
   the game's own variables (style.css :root) and the account screens' pieces (.pfCell, .rrMove, .rrMmr). Sizes in rem.
   Reduced motion, the system's or Settings' Fight effects at Reduced (body.fxReduced), stills every animation here. */

/* ---------- the insignia (inline SVG) ---------- */
.ascIns{flex:none;display:block;color:var(--asc);overflow:visible}
.ascIns .aiF{fill:color-mix(in srgb,var(--asc) 22%,#0a1022)}
.ascIns .aiF2{fill:var(--asc)}
.ascIns .aiS{fill:none;stroke:var(--asc);stroke-width:3;stroke-linejoin:round}
.ascIns .aiS.dim{stroke:#4a577c}
.ascIns .aiS.dash{stroke-width:1.5;stroke-dasharray:3 3;opacity:.6}
.ascIns .aiL{fill:none;stroke:var(--asc);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.ascIns .aiL.thin{stroke-width:1.5;opacity:.7}
.ascIns .aiN{fill:var(--asc)}
.ascIns .aiN.off{fill:#2a3560}
.ascIns .aiT{fill:#fff;font-family:var(--disp);font-size:17px;text-anchor:middle}
.ascIns.gm{filter:drop-shadow(0 0 .35rem color-mix(in srgb,var(--asc) 60%,transparent))}

/* ---------- the badge, the bar, the title ---------- */
.ascBadge{display:inline-flex;align-items:center;gap:.5rem;min-width:0}
.ascBadge .abTx{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.ascBadge b{font-family:var(--disp);font-size:.8125rem;letter-spacing:.04em;color:var(--asc);white-space:nowrap}
.ascBadge small{font-size:.6875rem;color:#c6d0ec;white-space:nowrap}
.ascBadge.big b{font-size:1.25rem}.ascBadge.big small{font-size:.8125rem}
.ascBar{position:relative;display:block;height:.375rem;min-width:5rem;border-radius:999px;background:#151d3a;overflow:hidden;border:1px solid #26325c}
.ascBar i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,color-mix(in srgb,var(--asc,var(--gold)) 70%,#fff0),var(--asc,var(--gold)));border-radius:inherit;transition:width .6s ease-out}
.ascBar.xp{--asc:var(--ki)}.ascBar.xp.rep{--asc:var(--violet)}
.repTag{display:inline-flex;align-items:center;gap:.375rem;padding:.1875rem .5rem;border:1px solid var(--rep);border-radius:999px;background:color-mix(in srgb,var(--rep) 14%,#0a0f20);white-space:nowrap;line-height:1.2;min-width:0}
.repTag b{font-family:var(--disp);font-size:.75rem;letter-spacing:.03em;color:var(--rep);overflow:hidden;text-overflow:ellipsis}
.repTag small{font-size:.6875rem;color:#d7def0}
.repTag.big{padding:.375rem .875rem}.repTag.big b{font-size:1rem}
.repIc{width:.875rem;height:.875rem;flex:none;fill:var(--rep,var(--asc))}
.repMeter{position:relative;display:block;height:.5rem;min-width:6rem;border-radius:999px;background:#151d3a;border:1px solid #26325c;overflow:hidden}
.repMeter i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#3a2a6a,var(--rep));border-radius:inherit;transition:width .6s ease-out}
.repMeter u{position:absolute;top:0;bottom:0;width:1px;background:#0b0e1a99}
.repMeter.thin{height:.375rem}
.ascPlaces{display:inline-flex;gap:.25rem}.ascPlaces i{font-style:normal;font-family:var(--disp);font-size:.75rem;padding:.0625rem .375rem;border-radius:.3125rem;background:#18213f;color:#c6d0ec;border:1px solid #2a3560}
.ascPlaces i.top{color:#e8f0ff;border-color:#4a7dff}.ascPlaces i.win{color:#171106;background:var(--gold);border-color:var(--gold)}
.ascPlaces.none{font-size:.75rem;color:var(--dim)}

/* ---------- the start screen's two cards ---------- */
.ascStart{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.5rem 0 .25rem}
.ascCard{display:flex;flex-direction:column;align-items:stretch;gap:.5rem;min-width:0;padding:.625rem .75rem;text-align:left;font-family:var(--body);border-radius:.75rem;background:linear-gradient(180deg,#121a36,#0a0f22);border:1px solid #2c3a66;cursor:pointer;transition:border-color .15s,transform .15s}
.ascCard.ranked{border-color:color-mix(in srgb,var(--asc) 45%,#2c3a66)}.ascCard.casual{border-color:color-mix(in srgb,var(--rep) 45%,#2c3a66)}
.ascCard:hover{transform:translateY(-.0625rem);border-color:#9fb4d8}
.ascCard .acHead{font-family:var(--disp);font-size:.625rem;letter-spacing:.14em;color:var(--dim)}
.ascCard .ascBar,.ascCard .repMeter{width:100%;height:.375rem;margin-top:auto}
.ascCard .ascBadge{gap:.5rem;align-self:flex-start;max-width:100%}.ascCard .ascIns{width:2rem;height:2rem;flex:none}
.ascCard .abTx{min-width:0}.ascCard .ascBadge b,.ascCard .ascBadge small{white-space:normal;line-height:1.15;overflow-wrap:anywhere}   /* (a long title or line wraps inside its card, never out of it) */
.repIns{display:grid;place-items:center;flex:none;width:2rem;height:2rem;border-radius:50%;border:1.5px solid var(--rep);background:color-mix(in srgb,var(--rep) 16%,#0a0f20)}.repIns .repIc{width:1rem;height:1rem;fill:var(--rep)}
.acGoal{font-size:.6875rem;line-height:1.3;color:#c6d0ec}
#acctRank i[style*="--rk"]{display:inline-block;width:.5rem;height:.5rem;margin-right:.3125rem;border-radius:50%;background:var(--rk)}

/* ---------- the lobby's line, the pre-match card ---------- */
.ascLobby{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap;margin:0 0 .5rem;padding:.5rem .625rem;border-radius:.625rem;background:#0b1126;border:1px solid #26325c}
.ascLobby .alHead{flex-basis:100%;font-family:var(--disp);font-weight:400;font-size:.8125rem;letter-spacing:.08em;color:var(--asc,var(--gold))}
.ascLobby .alGoal{flex:1;min-width:10rem;font-size:.75rem;color:#c6d0ec}
.ascIntro{position:absolute;z-index:8;left:50%;top:calc(var(--topH,3.5rem) + 4.25rem);transform:translate(-50%,0);display:flex;flex-direction:column;align-items:center;gap:.375rem;padding:.75rem 1.25rem;min-width:min(22rem,calc(100vw - 2rem));max-width:calc(100vw - 2rem);pointer-events:none;border-color:#3a4a7a;text-align:center}
.ascIntro .aiHead{font-family:var(--disp);font-size:.625rem;letter-spacing:.16em;color:var(--dim)}
.ascIntro .aiRow{display:flex;align-items:center;gap:.5rem}.ascIntro .aiRow small{font-size:.625rem;letter-spacing:.1em;color:var(--dim)}
.ascIntro .aiGoal{font-size:.8125rem;color:#e8ecff;max-width:26rem}
.ascIntro.in{animation:ascIn .45s ease-out both}.ascIntro.out{animation:ascOut .4s ease-in both}
@keyframes ascIn{from{opacity:0;transform:translate(-50%,-.75rem)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes ascOut{to{opacity:0;transform:translate(-50%,-.5rem)}}

/* ---------- in the match: the chip, the LIVE MOMENT ---------- */
.ascChip{display:inline-flex;align-items:center;gap:.3125rem;align-self:center;flex:none;height:2rem;padding:0 .5rem 0 .3125rem;border-color:color-mix(in srgb,var(--asc) 50%,var(--line));border-radius:999px;pointer-events:auto}
.ascChip b{font-family:var(--disp);font-size:.6875rem;letter-spacing:.06em;color:var(--asc);white-space:nowrap}
.ascChip .repIc{fill:var(--asc)}
#app.mode-combat .ascChip,#app.duel .ascChip,#app.mission .ascChip,#app.spectator .ascChip{display:none}   /* (shown through the warm-up's picks: the match the player joined, before its pre-match card) */
.ascMoment{position:absolute;z-index:9;left:50%;top:calc(var(--topH,3.5rem) + 4rem);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.625rem 1.125rem;max-width:min(26rem,calc(100vw - 2rem));text-align:center;pointer-events:none;border-color:#c69bff;box-shadow:0 0 1.25rem #c69bff55}
.ascMoment .amHead{display:flex;align-items:center;gap:.375rem;font-family:var(--disp);font-size:.625rem;letter-spacing:.16em;color:var(--violet)}
.ascMoment .amHead i{width:.5rem;height:.5rem;border-radius:50%;background:var(--violet);animation:ascPulse 1.2s ease-in-out infinite}
.ascMoment>b{font-family:var(--disp);font-size:1.25rem;color:#fff;letter-spacing:.03em}
.ascMoment>span{font-size:.8125rem;color:#d7def0}.ascMoment>small{font-size:.6875rem;color:var(--dim)}
.ascMoment.in{animation:ascMomIn .5s cubic-bezier(.2,1.4,.4,1) both}.ascMoment.out{animation:ascMomOut .4s ease-in both}
@keyframes ascMomIn{from{opacity:0;transform:translate(-50%,-.5rem) scale(.92)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes ascMomOut{to{opacity:0;transform:translate(-50%,-.375rem)}}
@keyframes ascPulse{50%{opacity:.35}}

/* ---------- the result screen: the panel in #rsRank, the highlights ---------- */
.rsRank.asc{flex-direction:column;align-items:stretch;gap:.5rem}
.arRepeat{display:block;margin-top:.1875rem;font-size:.6875rem;color:#9fb0d6}
.ascHl,.ascRes{display:flex;flex-direction:column;align-items:center;gap:.375rem;text-align:center}
.ascHl{padding-top:.5rem;border-top:1px solid #26325c}   /* (under the rank or the casual panel) */
.arHead{font-family:var(--disp);font-size:.6875rem;letter-spacing:.14em;color:var(--rsA,var(--gold))}
.ascHl ul{display:flex;flex-wrap:wrap;justify-content:center;gap:.375rem;margin:0;padding:0;list-style:none}
.ascHl li{display:flex;flex-direction:column;padding:.3125rem .625rem;border-radius:.5rem;background:#0d1530;border:1px solid #2a3560;text-align:left}
.ascHl li b{font-family:var(--disp);font-size:.8125rem;color:#fff}.ascHl li small{font-size:.6875rem;color:#b5c4e7}
.ascHl li.pend{border-color:var(--violet);border-style:dashed}.ascHl li.pend small{color:var(--violet)}
.ascHl li.ok{border-color:#2f7a4f}.ascHl li.ok small{color:var(--good)}
.ascHl li.badge{border-color:var(--gold)}.ascHl li.badge small{color:var(--gold)}
.ascHl li.no{opacity:.7}.ascHl li.no small{color:#9aa6c4}
.ascRes .arRanks{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}
.ascRes .arTitle{font-family:var(--disp);font-size:1.125rem;letter-spacing:.06em;color:#fff}
.ascRes .ascBar{width:min(22rem,100%)}
.ascRes .repMeter{width:min(22rem,100%)}
.arWait{font-size:.8125rem;color:#b5c4e7;max-width:34rem}
.arHonest{font-size:.8125rem;color:#c6d0ec}.arHonest b{color:#fff;font-family:var(--disp);font-weight:400}
.arXp{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}.arXp b{font-family:var(--disp);font-size:.8125rem;color:var(--ki)}.ascRes.rep .arXp b{color:var(--violet)}.arXp small{font-size:.75rem;color:#b5c4e7}.arXp .ascBar{width:8rem}
.arGoal{font-size:.75rem;color:var(--dim)}
.arPersona{display:flex;flex-direction:column;align-items:center;gap:.0625rem}.arPersona b{font-family:var(--disp);font-size:.875rem;color:var(--rep,#fff)}.arPersona small{font-size:.75rem;color:#b5c4e7}
.arPips{display:flex;gap:.25rem;flex-wrap:wrap;justify-content:center}
.arPips i{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;font-style:normal;font-family:var(--disp);font-size:.75rem;border-radius:.375rem;background:#111833;border:1px dashed #3a4a7a;color:#9fb0d6}
.arPips i.done{border-style:solid;color:#e8ecff;background:#1a2346}.arPips i.top{border:1px solid #4a7dff;color:#fff;background:#1b2b5c}.arPips i.win{border:1px solid var(--gold);background:var(--gold);color:#171106}
.rsRank .rrMove.promoted{animation:none}

/* ---------- the rank reveal ---------- */
.ascRevealOv{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:1rem;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--asc) 22%,#060914ee),#05070fef 70%)}
.arvBox{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:36rem;text-align:center}
.arvHead{font-family:var(--disp);font-size:1rem;letter-spacing:.2em;color:var(--dim)}
.arvPips{display:flex;gap:.375rem;flex-wrap:wrap;justify-content:center}
.arvPips i{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;font-style:normal;font-family:var(--disp);font-size:1rem;border-radius:.5rem;background:#111833;border:1px solid #3a4a7a;color:#e8ecff;animation:arvPip .35s ease-out var(--d) both}
.arvPips i.top{border-color:#4a7dff;background:#1b2b5c}.arvPips i.win{border-color:var(--gold);background:var(--gold);color:#171106}
.arvRank{display:flex;flex-direction:column;align-items:center;gap:.25rem;animation:arvRank .8s cubic-bezier(.2,1.3,.4,1) var(--d) both}
.arvRank b{font-family:var(--disp);font-size:2.25rem;letter-spacing:.05em;color:var(--asc);text-shadow:0 0 1.25rem color-mix(in srgb,var(--asc) 60%,transparent)}
.arvRank small{font-size:.75rem;letter-spacing:.2em;color:var(--dim)}
.arvRank .ascIns{filter:drop-shadow(0 0 1.25rem color-mix(in srgb,var(--asc) 70%,transparent))}
.arvStats{font-size:.875rem;color:#d7def0;animation:arvPip .5s ease-out var(--d) both}
.arvBox .primary{min-width:12rem;animation:arvPip .5s ease-out calc(var(--d,0ms) + 2.6s) both}
@keyframes arvPip{from{opacity:0;transform:translateY(.375rem)}to{opacity:1;transform:none}}
@keyframes arvRank{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
.ascRevealOv.still *{animation:none!important}

/* ---------- the profile's tabs ---------- */
.ascTab{display:flex;flex-direction:column;gap:.75rem}
.ascSec{padding:.75rem .875rem;border-radius:.75rem;background:#0a1122;border:1px solid #233056}
.ascSec h4{margin:0 0 .5rem;font-family:var(--disp);font-size:.75rem;letter-spacing:.12em;color:#c6d0ec}.ascSec h4 small{margin-left:.375rem;font-family:var(--body);font-size:.6875rem;letter-spacing:0;color:var(--dim)}
.ascSec h5{margin:.625rem 0 .375rem;font-family:var(--disp);font-size:.6875rem;letter-spacing:.1em;color:var(--dim)}
.ascSec.top{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;justify-content:space-between;border-color:color-mix(in srgb,var(--asc,var(--rep)) 40%,#233056)}
.ascTopL{display:flex;flex-direction:column;gap:.5rem;min-width:min(16rem,100%);flex:1}
.ascTopR{display:grid;grid-template-columns:repeat(auto-fit,minmax(5rem,1fr));gap:.375rem;flex:1;min-width:min(16rem,100%)}
.ascNote{display:block;margin-top:.375rem;font-size:.6875rem;color:var(--dim)}
.ascChecks{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.25rem .75rem}
.ascChecks li{font-size:.75rem;color:#9aa6c4}.ascChecks li.ok{color:var(--good)}
.ascDossier{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.5rem}
.adCard{display:flex;flex-direction:column;gap:.125rem;padding:.5rem .625rem;border-radius:.5rem;background:#0d1530;border:1px solid #2a3560}
.adCard b{font-family:var(--disp);font-size:.75rem;color:#e8ecff}.adCard .adVal{font-family:var(--disp);font-size:1.5rem;color:var(--gold)}.adCard small{font-size:.6875rem;color:#9fb0d6}
.adCard.none .adVal{font-size:.75rem;letter-spacing:.08em;color:var(--dim)}
.ascPairs{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.25rem}
.ascPairs li{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;font-size:.75rem}.ascPairs li b{color:#e8ecff;font-family:var(--disp);font-weight:400}.ascPairs li small{color:#9fb0d6}
.ascHist{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.1875rem}
.ascHist li{display:grid;grid-template-columns:2.5rem 1fr auto 3rem 3.5rem;gap:.5rem;align-items:center;padding:.25rem .5rem;border-radius:.375rem;background:#0d1530;font-size:.75rem;color:#c6d0ec}
.ascHist .p{font-family:var(--disp)}.ascHist .p.top{color:#8fb8ff}.ascHist .p.win{color:var(--gold)}
.ascHist .d,.ascHist .x{text-align:right}.ascHist em,.ascRes em{font-style:normal}.ascHist em.up,.ascRes em.up{color:var(--good)}.ascHist em.down,.ascRes em.down{color:var(--foe)}
.repParts{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.375rem}
.repParts li{display:grid;grid-template-columns:7rem 1fr 3rem;gap:.5rem;align-items:center;font-size:.75rem;color:#c6d0ec}.repParts b{text-align:right;font-family:var(--disp);font-weight:400;color:#fff}
.repBadges,.overlay .repBadges{margin:0;padding:0;list-style:none;line-height:1.3;display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.375rem}
.repBadges li{display:flex}
/* ---------- the moment badges: a picture (assets/badges/<key>.webp) on a medallion's ground, so a picture that never
   comes still leaves a badge; earned ones lit, locked ones dimmed; a button each, the card (#badgeOv) opens on it ---------- */
.bdgIc{position:relative;flex:none;display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:radial-gradient(circle at 50% 40%,#2a3560 0 55%,#5c4a1f 56% 70%,transparent 71%)}
.bdgIc img{width:100%;height:100%;object-fit:contain;display:block}
.bdgIc.sm{width:1.75rem;height:1.75rem}.bdgIc.big{width:min(9rem,40vw);height:min(9rem,40vw)}
.bdgIc.locked,.bdgBtn.locked .bdgIc{filter:grayscale(1) brightness(.55);opacity:.7}
.bdgBtn{display:flex;align-items:center;gap:.5rem;width:100%;min-height:2.75rem;padding:.375rem .5rem;border-radius:.5rem;background:#0d1530;border:1px solid #5c4a1f;color:inherit;font:inherit;text-align:left;cursor:pointer}
.bdgBtn:hover,.bdgBtn:focus-visible{border-color:var(--gold);background:#141f42}.bdgBtn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.bdgBtn.locked{border-color:#2a3560;border-style:dashed}
.bdgTx{display:flex;flex-direction:column;min-width:0}.bdgTx b{font-family:var(--disp);font-weight:400;font-size:.75rem;color:var(--gold)}.bdgTx small{font-size:.625rem;letter-spacing:.04em;color:#b5c4e7}
.bdgBtn.locked .bdgTx b{color:#9aa6c4}
.bdgBtn.sm{width:auto;min-height:0;padding:.125rem;border-radius:50%;border-color:transparent;background:none}.bdgBtn.sm .bdgIc{width:2.75rem;height:2.75rem}
.box .bdgRow .bdgBtn.sm,.box .bdgRow .bdgAll,.box .bdgActs .bdgAll{width:auto}   /* (the boxes' buttons are full width: style.css .overlay .box button) */
.bdgStrip{margin-top:.75rem}.bdgStrip h3{margin:0 0 .375rem}
.bdgRow{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .375rem}.bdgNone{font-size:.75rem;color:#9fb0d6}
.bdgAll{margin-left:auto;min-height:2.75rem;padding:.25rem .625rem;border-radius:.5rem;background:none;border:1px solid #3d568a;color:#c6d0ec;font:inherit;font-size:.75rem;cursor:pointer}.bdgAll:hover,.bdgAll:focus-visible{border-color:var(--gold);color:#fff}
.bdgActs .bdgAll{margin-left:0}.bdgGo{border-color:var(--gold)!important;color:var(--gold)!important}
.bdgOv .bdgBox{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center;width:min(22rem,100%)}
.bdgOv.all .bdgBox{width:min(34rem,100%)}.bdgOv.all .bdgArt{width:100%;order:3}.bdgOv.all .repBadges{text-align:left}
.bdgBox h2{margin:.25rem 0 0;font-family:var(--disp);font-weight:400;color:var(--gold)}.bdgLine{margin:0;color:#c6d0ec;font-size:.875rem}.bdgWhen{margin:0;font-size:.75rem;letter-spacing:.06em;color:#9fb0d6}
.bdgActs{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.25rem}.bdgActs:empty,.bdgWhen:empty{display:none}
.ascHl li.badge{display:grid;grid-template-columns:auto 1fr;column-gap:.5rem;align-items:center}.ascHl li.badge .bdgIc{grid-row:span 2}
.repSpark{display:block;width:100%;height:3.5rem}.repSpark polyline{fill:none;stroke:var(--rep);stroke-width:1.5;vector-effect:non-scaling-stroke}
.pfRk.asc{flex-wrap:wrap}.pfRk.asc .pfLp{flex:1;min-width:10rem;display:flex;flex-direction:column;gap:.375rem}

/* ---------- the leaderboard ---------- */
#lbNexus:empty{display:none}
.ascNexus{display:flex;align-items:center;gap:.75rem;margin:0 0 .625rem;padding:.625rem .875rem;border-radius:.75rem;background:linear-gradient(90deg,#3a1d14,#0d1530 70%);border:1px solid #ff8f6b;--asc:#ff8f6b}
.ascNexus .anWho{flex:1;min-width:0;display:flex;flex-direction:column}.ascNexus .anWho small{font-size:.6875rem;color:#ffd3c2;letter-spacing:.06em}.ascNexus .anWho b{font-family:var(--disp);font-size:1.125rem;color:#fff}
.ascNexus .anN{font-size:.6875rem;color:#ffd3c2;text-align:right}
.ascNexus.empty{flex-direction:column;align-items:flex-start;gap:.25rem;background:#0d1530;border-style:dashed}.ascNexus.empty b{font-family:var(--disp);letter-spacing:.14em;color:#ff8f6b}.ascNexus.empty small{font-size:.75rem;color:#b5c4e7}
.lbSort{display:flex;gap:.25rem;justify-content:flex-end;margin:0 0 .5rem}
.lbRow.prime{border-color:#ff8f6b;background:linear-gradient(90deg,rgba(255,143,107,.16),#0d1530 60%)}
.lbRow.cal .n{color:var(--dim)}
.lbRow .ascBadge small{display:none}
.lbRow .repTag{max-width:11rem}
/* Hype drawn on the leaderboard (2026-10-18, the owner: Hype and the rest shown, not only a number; ascension.js repRadar, repBars, repChaos, repForm) */
.repRadar{display:block;height:auto;max-width:100%;overflow:visible}
.repRadar .rrRing{fill:none;stroke:rgba(255,255,255,.12);stroke-width:.6}
.repRadar .rrRing:first-child{fill:rgba(8,13,30,.62);stroke:rgba(255,255,255,.24)}
.repRadar .rrAx{stroke:rgba(255,255,255,.12);stroke-width:.6}
.repRadar .rrShape{fill:color-mix(in srgb,var(--rep) 34%,transparent);stroke:var(--rep);stroke-width:1.6;stroke-linejoin:round}
.repRadar .rrLab{font-family:var(--disp);font-style:italic;letter-spacing:.04em}
.repRadar .rrV{fill:#fff}
.repStats{display:inline-flex;align-items:center;gap:.625rem;flex:none}
.repBars{display:inline-flex;align-items:stretch;gap:.1875rem;height:2rem;padding:.1875rem .25rem;background:rgba(8,13,30,.7);border:1px solid #22305c}
.repBars i{position:relative;display:block;width:.5rem;background:rgba(255,255,255,.08)}
.repBars i::after{content:"";position:absolute;left:0;right:0;bottom:0;height:var(--v);background:var(--c)}
.repBars.none{width:2.375rem;opacity:.35}
.repChaos{display:inline-flex;flex-direction:column;gap:.1875rem;min-width:2.75rem}
.repChaos b{font-family:var(--disp);font-style:italic;font-size:.75rem;line-height:1;letter-spacing:.04em;color:#ffb547}
.repChaos i{position:relative;display:block;height:.25rem;background:rgba(255,255,255,.1)}
.repChaos i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--p);background:linear-gradient(90deg,#ff7a1c,#ffd25a)}
.repForm{display:inline-flex;flex-wrap:wrap;gap:.1875rem}
.repForm i{display:grid;place-items:center;width:1.625rem;height:1.625rem;font-family:var(--disp);font-style:italic;font-size:.8125rem;background:#1a2346;color:#8f9bc4;clip-path:polygon(.25rem 0,100% 0,calc(100% - .25rem) 100%,0 100%)}
.repForm i.t{background:#123a3a;color:#5fe3c9}
.repForm i.w{background:#ffc94a;color:#160c00}
.repLegend{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .875rem;margin-right:auto;font-size:.75rem;color:#9aa6d6}
.repLegend span{display:inline-flex;align-items:center;gap:.375rem}
.repLegend i{display:inline-block;width:.375rem;height:.875rem}
.repLegend i.ch{width:.875rem;height:.25rem;background:linear-gradient(90deg,#ff7a1c,#ffd25a)}

/* ---------- phones ---------- */
@media (max-width:760px){
  .ascStart{grid-template-columns:1fr}
  .ascChip:not(.cal) b,.ascChip .acLong{display:none}.ascChip{padding:0 .25rem}.ascChip.cal{padding-right:.4375rem}
  .ascIntro,.ascMoment{top:calc(var(--topH,3.5rem) + 6rem)}
  .ascHist li{grid-template-columns:2.25rem 1fr 3rem;}.ascHist .o,.ascHist .x{display:none}
  .repParts li{grid-template-columns:5.5rem 1fr 2.5rem}
  .lbRow .ascBadge .abTx,.lbRow .repTag small{display:none}
  .lbRow .repStats,.repLegend{display:none}   /* a phone's row keeps the name and the title chip; the bars and Chaos show from 761px */
  .arvRank b{font-size:1.75rem}
  .repBadges{grid-template-columns:1fr}.bdgAll{margin-left:0}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){.ascIntro,.ascMoment,.ascMoment .amHead i,.arvPips i,.arvRank,.arvStats,.arvBox .primary{animation:none!important}.ascBar i,.repMeter i{transition:none}}
body.fxReduced .ascIntro,body.fxReduced .ascMoment,body.fxReduced .ascMoment .amHead i{animation:none!important}
