/* E–S artwork. Presentation only; authored wallpaper/living-scene layers stay untouched. */
.module-renown .renown-board{grid-template-rows:minmax(0,1fr);align-items:center}
.module-renown .renown-board[data-avatar-card="true"]{left:26%;top:10%;width:48%;height:86%;display:flex;justify-content:center;align-items:center;z-index:7;perspective:1200px}
/* Shade both the still and animated wallpaper layers evenly; keep the card above it. */
.module-renown:has(.renown-avatar-card) .paradise-scene:before{content:"";display:block;position:absolute;inset:0;height:auto;opacity:1;z-index:6;pointer-events:none;background:radial-gradient(ellipse 30% 80% at 50% 49%,#030202f5 0%,#030202e6 44%,#030202a6 65%,#03020240 83%,transparent 100%)}
.module-renown:has(.renown-avatar-card) .renown-pager{left:50%;top:1%;transform:translateX(-50%);width:min(40%,400px);max-width:none;flex-wrap:wrap;justify-content:center;box-sizing:border-box;z-index:8}
.module-renown:has(.renown-avatar-card) .renown-pager div{white-space:normal;flex-direction:column;gap:2px}
.renown-avatar-card{width:min(100%,calc((100dvh - 145px)*.667));max-width:550px;min-width:0;position:relative;margin:0;container-type:inline-size;filter:drop-shadow(0 20px 24px #0009);color:#fff1d7;isolation:isolate;--card-ink:#ffe6bc;--card-label:#ecca9d;--foil-hue:0deg;--foil-strength:.95;--gleam-strength:1;--name-top:9.3%}
.renown-avatar-card[data-card-rank="E"]{--card-ink:#e2e6ea;--card-label:#c9ced5;--foil-strength:.4;--gleam-strength:.4}
.renown-avatar-card[data-card-rank="C"]{--card-ink:#e2f4ff;--card-label:#c8e3f7;--foil-hue:170deg;--foil-strength:1;--name-top:8.4%}
.renown-avatar-card[data-card-rank="B"]{--card-ink:#ffeab0;--card-label:#f6d68b;--foil-hue:10deg;--foil-strength:1;--name-top:8.3%}
.renown-avatar-card[data-card-rank="A"]{--card-ink:#f9e3ff;--card-label:#eec4fa;--foil-hue:260deg;--foil-strength:1;--name-top:8%}
.renown-avatar-card[data-card-rank="S"]{--card-ink:#fff1ce;--card-label:#f3e9d3;--foil-strength:1;--name-top:7.9%}
.renown-card-float{position:relative;isolation:isolate;animation:renown-card-float 7s ease-in-out infinite;animation-play-state:paused}
/* Static feathered aura rides the existing float: no extra animation or blur. */
.renown-card-float:before{content:"";position:absolute;inset:-1% -7% 2%;z-index:-1;pointer-events:none;border-radius:12%;background:linear-gradient(90deg,transparent 0%,#0009 12%,#000e 27% 73%,#0009 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 12% 86%,transparent 100%)}
body[data-module="renown"] .renown-card-float{animation-play-state:running}
.renown-card-surface{position:relative;aspect-ratio:2/3;transform:perspective(1100px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg));transition:transform .35s ease;transform-style:preserve-3d;touch-action:pan-y;outline:none;--light-x:50%;--light-y:35%}
/* Card labels are artwork, not selectable text. Keep keyboard focus and tilt intact. */
.renown-card-surface,.renown-card-surface *{-webkit-user-select:none;user-select:none}
.renown-card-surface.is-tilting{transition:transform .09s linear}
.renown-card-surface:focus-visible{outline:2px solid #f6d4a5;outline-offset:2px;border-radius:6%}
.renown-card-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;clip-path:inset(3.1% 4.4% 6.2% 4.4% round 3%);pointer-events:none;user-select:none}
.renown-card-name{position:absolute;left:26%;top:var(--name-top);width:44%;height:4.6%;margin:0;display:flex;align-items:center;justify-content:center;text-align:center;font:700 clamp(12px,5.4cqw,27px)/1.1 Georgia,serif;color:var(--card-ink);text-shadow:0 2px 3px #000;letter-spacing:0;white-space:nowrap;z-index:2}
.renown-card-character{position:absolute;left:18%;right:18%;top:15%;bottom:24.5%;display:grid;place-items:center;z-index:2;pointer-events:none}
.renown-card-character img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 7px #000b);user-select:none}
.renown-card-empty{font:600 4cqw/1.4 system-ui;text-align:center;color:#eac799}
.renown-card-outfit{position:absolute;left:29%;top:76%;width:40%;height:2.8%;display:flex;align-items:center;justify-content:center;margin:0;color:#ffe4b7;font:700 clamp(10px,2.7cqw,15px)/1 system-ui,sans-serif;letter-spacing:.025em;text-align:center;z-index:2}
.renown-card-stat{position:absolute;top:80.7%;width:30%;height:7.5%;text-align:center;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:1%;z-index:2}
.renown-card-renown{left:15%}.renown-card-gold{right:15%}
.renown-card-stat b{width:100%;font:700 clamp(24px,8.2cqw,43px)/1 Georgia,serif;color:var(--card-ink);text-shadow:0 2px 4px #000}
.renown-card-gold b{transform:translateY(-.16em)}
.renown-card-renown b{font-size:clamp(18px,6.1cqw,31px)}
.renown-card-stat span{position:absolute;top:71%;width:112%;padding:2px 0 4px;background:#0e0e0d;color:var(--card-label);font:700 clamp(9px,2.8cqw,15px)/1.1 Georgia,serif;letter-spacing:.08em}
.renown-card-foil,.renown-card-glass{position:absolute;inset:3.1% 4.4% 6.2%;border-radius:3%;pointer-events:none;z-index:3}
.renown-card-foil{padding:3.5%;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#fff4d2e6,transparent 43%),linear-gradient(115deg,transparent 15%,#ffbf6280 29%,#fff2cdd9 34%,transparent 42% 68%,#d7914980 78%,transparent);background-size:100% 100%,240% 100%;background-position:center,var(--light-x) center;mix-blend-mode:screen;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:.95;overflow:hidden}
.renown-card-glass{background:linear-gradient(115deg,transparent 30%,#fff2d80c 43%,#fff5dc33 49%,transparent 57%);background-size:260% 100%;background-position:var(--light-x) center;mix-blend-mode:screen;opacity:.7;overflow:hidden}
.renown-card-foil:after,.renown-card-glass:after{content:"";position:absolute;inset:0;background:linear-gradient(112deg,transparent 30%,#ffda9733 43%,#fff7dfeb 49%,#ffce7455 54%,transparent 67%);transform:translateX(-130%);animation:renown-card-gleam 7s ease-in-out infinite;animation-play-state:paused}
.renown-card-foil{opacity:var(--foil-strength);filter:hue-rotate(var(--foil-hue))}
.renown-card-foil:after{opacity:var(--gleam-strength)}
.renown-avatar-card[data-card-rank="E"] .renown-card-foil{filter:grayscale(1)}
.renown-avatar-card[data-card-rank="S"] .renown-card-foil{background-image:radial-gradient(ellipse at var(--light-x) var(--light-y),#fff8e6,transparent 43%),linear-gradient(115deg,transparent 10%,#b7f5ffb3 25%,#f2c5ffb3 38%,#fff2cdd9 50%,#ccffe2b3 63%,#ffe7aab3 77%,transparent 90%)}
.renown-card-glass:after{opacity:.16}
body[data-module="renown"] .renown-card-foil:after,body[data-module="renown"] .renown-card-glass:after{animation-play-state:running}
@keyframes renown-card-float{0%,100%{transform:translateY(0) rotate(-.45deg)}50%{transform:translateY(-8px) rotate(.45deg)}}
@keyframes renown-card-gleam{0%,12%{transform:translateX(-130%)}62%,100%{transform:translateX(130%)}}
@media(max-width:900px){
 .module-renown .renown-board[data-avatar-card="true"]{position:relative;left:auto;top:auto;width:100%;height:auto;padding:0 0 90px;margin:0;z-index:7}
 .renown-avatar-card{width:min(94vw,460px);max-width:100%}
 .module-renown:has(.renown-avatar-card) .renown-pager{position:relative;left:auto;top:auto;transform:none;max-width:none;width:fit-content;margin:16px auto 0}
 .module-renown:has(.renown-avatar-card) .renown-pager div{flex-direction:row}
}
@media(prefers-reduced-motion:reduce){.renown-card-float,.renown-card-foil:after,.renown-card-glass:after{animation:none}.renown-card-surface{transform:none!important;transition:none}}
/* Photoreal metal light (renown-card-shine.js). The canvas covers the frame art exactly; the CSS foil steps aside. */
.renown-card-shine{position:absolute;inset:0;width:100%;height:100%;clip-path:inset(3.1% 4.4% 6.2% 4.4% round 3%);pointer-events:none;opacity:0;transition:opacity .45s ease}
.renown-shine-on .renown-card-shine{opacity:1}
.renown-shine-on .renown-card-foil{display:none}
/* Renown level: number as large as Gold, with a progress bar toward the next level. */
.renown-card-renown:has(.renown-card-level-bar:not([hidden])) b{font-size:clamp(24px,8.2cqw,43px);transform:translateY(-.16em)}
.renown-card-level-bar{position:absolute;top:61.5%;left:14%;width:72%;height:max(4px,1.05cqw);border-radius:99px;background:#ffffff26;box-shadow:inset 0 0 0 1px #000a,0 0 0 1px #ffffff14;overflow:hidden}
.renown-card-level-bar i{display:block;height:100%;width:var(--level-pct,0%);border-radius:inherit;background:linear-gradient(90deg,var(--card-label),var(--card-ink));box-shadow:0 0 6px var(--card-ink);transition:width .6s ease}