/* UI V4 — 官网角色立绘与金箔蝶影。展示层增强，不改变内容、账号或审核合同。 */
.hero-stage{overflow:hidden}
.hero-stage .name-ribbon{display:none}
.hero-character{position:absolute;z-index:6;bottom:8px;width:48%;height:96%;margin:0;display:flex;justify-content:center;pointer-events:none;transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.hero-character img{position:relative;z-index:2;width:100%;height:100%;display:block;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 18px 15px rgba(0,0,0,.38))}
.hero-character-keigetsu{left:4%}.hero-character-reirin{right:2%}
.hero-character figcaption{position:absolute;z-index:4;bottom:14px;min-width:152px;padding:9px 12px;border:1px solid rgba(245,222,154,.55);border-radius:3px;background:rgba(16,24,63,.83);box-shadow:0 8px 18px rgba(0,0,0,.25);color:var(--paper);text-align:center;backdrop-filter:blur(7px)}
.hero-character-keigetsu figcaption{left:4%}.hero-character-reirin figcaption{right:3%;background:rgba(100,25,45,.86)}
.hero-character figcaption strong{display:block;font:650 20px/1.2 var(--serif);letter-spacing:.08em}.hero-character figcaption span{display:block;margin-top:3px;color:var(--gold-soft);font:8px/1.3 var(--mono);letter-spacing:.04em}
.official-art-fallback{position:absolute;z-index:1;inset:22% 8% auto;padding:14px;border:1px solid rgba(214,181,119,.4);border-radius:5px;background:rgba(17,28,83,.88);color:var(--gold-soft);font:11px/1.7 var(--sans);text-align:center}
.hero-character .official-art-fallback{visibility:hidden}.hero-character.image-failed img{display:none}.hero-character.image-failed .official-art-fallback{visibility:visible}.hero-character.image-failed figcaption{opacity:.95}
.art-caption{z-index:11;right:4%;bottom:3px}.art-caption a,.character-art-source a,.site-footer a{color:inherit;text-decoration-color:rgba(214,181,119,.5);text-underline-offset:3px}.art-caption a:hover,.art-caption a:focus-visible,.character-art-source a:hover,.character-art-source a:focus-visible,.site-footer a:hover,.site-footer a:focus-visible{color:var(--gold-soft)}

/* 固定 12 枚金箔/蝶翼碎片：外层下降、中层摆动、内层翻面，避免 transform 互相覆盖。 */
.foil-fall-layer{position:absolute;z-index:4;inset:0;overflow:hidden;border-radius:12px;pointer-events:none}
.foil-fall{--x:10%;--size:9px;--fall-duration:14s;--sway-duration:4.8s;--delay:-2s;position:absolute;top:-15%;left:var(--x);width:var(--size);height:var(--size);display:block;animation:v4-foil-fall var(--fall-duration) linear var(--delay) infinite}
.foil-fall>b{display:block;width:100%;height:100%;animation:v4-foil-sway var(--sway-duration) ease-in-out var(--delay) infinite alternate}
.foil-fall span{display:block;width:100%;height:100%;border:1px solid rgba(255,239,180,.72);background:linear-gradient(135deg,#fff1b5 0,#c99b3b 48%,#fff0ae 52%,#8e6425 100%);clip-path:polygon(18% 0,100% 25%,76% 100%,0 72%);box-shadow:0 0 8px rgba(245,211,126,.42);animation:v4-foil-flip 3.2s ease-in-out var(--delay) infinite}
.foil-2 span,.foil-5 span,.foil-8 span,.foil-11 span{border-radius:95% 12% 88% 20%;clip-path:none;background:linear-gradient(145deg,rgba(255,240,178,.92),rgba(177,119,41,.72) 67%,rgba(124,45,52,.74))}
.foil-1{--x:5%;--size:7px;--fall-duration:13s;--sway-duration:4.1s;--delay:-7s}.foil-2{--x:13%;--size:12px;--fall-duration:17s;--sway-duration:5.6s;--delay:-14s}.foil-3{--x:23%;--size:8px;--fall-duration:11s;--sway-duration:4.4s;--delay:-3s}.foil-4{--x:32%;--size:10px;--fall-duration:16s;--sway-duration:6.1s;--delay:-10s}.foil-5{--x:41%;--size:13px;--fall-duration:18s;--sway-duration:5.2s;--delay:-5s}.foil-6{--x:49%;--size:6px;--fall-duration:12s;--sway-duration:3.8s;--delay:-9s}.foil-7{--x:58%;--size:9px;--fall-duration:15s;--sway-duration:5.5s;--delay:-1s}.foil-8{--x:67%;--size:12px;--fall-duration:18s;--sway-duration:6.3s;--delay:-13s}.foil-9{--x:75%;--size:7px;--fall-duration:10s;--sway-duration:4.2s;--delay:-6s}.foil-10{--x:83%;--size:10px;--fall-duration:14s;--sway-duration:4.9s;--delay:-11s}.foil-11{--x:91%;--size:13px;--fall-duration:17s;--sway-duration:5.8s;--delay:-4s}.foil-12{--x:97%;--size:7px;--fall-duration:12s;--sway-duration:4.5s;--delay:-8s}
@keyframes v4-foil-fall{0%{translate:0 -8%}100%{translate:0 690px}}
@keyframes v4-foil-sway{0%{transform:translateX(-12px) rotate(-9deg)}100%{transform:translateX(18px) rotate(13deg)}}
@keyframes v4-foil-flip{0%,100%{transform:rotateY(0) rotateZ(0);opacity:.38}50%{transform:rotateY(78deg) rotateZ(145deg);opacity:.9}}

/* V4 让官方人物成为焦点，降低 V3 星点和柔光存在感。 */
.v3-depth-far{opacity:.42}.v3-depth-near{opacity:.38}.dust-4,.dust-5,.orb-b{display:none}.silk-glint{opacity:.35}.mini-butterfly{z-index:3;opacity:.76}.butterfly-gold{left:5%;top:18%}.butterfly-red{right:5%;top:12%}.butterfly-pale{right:11%;bottom:13%}
.intro-running .hero-character-keigetsu{animation:v4-character-left 1.1s .12s cubic-bezier(.18,.75,.2,1) both}.intro-running .hero-character-reirin{animation:v4-character-right 1.1s .24s cubic-bezier(.18,.75,.2,1) both}
@keyframes v4-character-left{0%{opacity:0;transform:translate3d(-32px,14px,0) scale(.97)}100%{opacity:1;transform:translate3d(var(--px,0),var(--py,0),0) scale(1)}}
@keyframes v4-character-right{0%{opacity:0;transform:translate3d(32px,14px,0) scale(.97)}100%{opacity:1;transform:translate3d(var(--px,0),var(--py,0),0) scale(1)}}

/* 角色区与首屏共用同一组入替后官网立绘和身份映射。 */
.character-panel{grid-template-columns:minmax(210px,260px) 1fr;min-height:440px;padding:28px 58px 24px;gap:52px;overflow:hidden}
.character-portrait{position:relative;align-self:end;width:100%;height:390px;display:grid;place-items:end center}
.character-portrait:after{content:"";position:absolute;z-index:0;left:3%;right:3%;bottom:7px;height:35px;border-radius:50%;background:rgba(34,25,49,.16);filter:blur(12px)}
.character-portrait img{position:relative;z-index:2;max-width:100%;width:auto;height:100%;display:block;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 16px 14px rgba(35,24,43,.2));transition:opacity .18s ease}
.character-portrait .official-art-fallback{inset:36% 2% auto}.character-portrait:not(.image-failed) .official-art-fallback{visibility:hidden}.character-portrait.image-failed img{display:none}.character-portrait.image-failed .official-art-fallback{visibility:visible}
.character-art-source{margin:17px 0 0;color:var(--muted);font-size:11px}.character-panel.is-changing .character-portrait img{animation:v4-portrait-settle .46s ease both}@keyframes v4-portrait-settle{0%{opacity:.25;transform:translateX(10px)}100%{opacity:1;transform:none}}
.footer-inner{gap:8px 24px;flex-wrap:wrap}.footer-inner span:nth-child(2){margin-left:auto}.footer-inner span:nth-child(3){width:100%;color:rgba(251,246,236,.44);font-size:10px}

body.motion-paused .foil-fall,body.motion-paused .foil-fall>b,body.motion-paused .foil-fall span{animation-play-state:paused!important}
.motion-simple .foil-fall-layer{display:none}.motion-simple .hero-character{transition:none!important;transform:none!important}.motion-simple .character-portrait img{animation:none!important;transition:none!important}
@media(hover:hover) and (pointer:fine){.hero-stage.is-parallax-active .hero-character{transition-duration:.08s}}
@media(max-width:800px){.hero-stage{height:280px}.hero-character{width:47%;height:98%}.hero-character-keigetsu{left:5%}.hero-character-reirin{right:3%}.hero-character figcaption{bottom:8px;min-width:132px;padding:7px 9px}.hero-character figcaption strong{font-size:17px}.character-panel{grid-template-columns:190px 1fr;min-height:370px;padding:24px 35px;gap:32px}.character-portrait{height:330px}.footer-inner span:nth-child(2){margin-left:0}}
@media(max-width:620px){.hero-stage{height:250px}.hero-character{bottom:3px;width:49%;height:98%}.hero-character-keigetsu{left:1%}.hero-character-reirin{right:0}.hero-character figcaption{bottom:5px;min-width:0;width:92px;padding:5px 4px}.hero-character figcaption strong{font-size:14px}.hero-character figcaption span{font-size:6px}.hero-character-keigetsu figcaption{left:1%}.hero-character-reirin figcaption{right:1%}.art-caption{right:3%;bottom:1px;max-width:135px;text-align:right;font-size:7px}.foil-fall:nth-child(n+7){display:none}.foil-fall{opacity:.72}.butterfly-pale{display:block;right:7%;bottom:18%;transform:scale(.45)}.dust-3,.silk-glint{display:none}.character-panel{grid-template-columns:1fr;min-height:0;padding:22px;gap:18px}.character-portrait{justify-self:center;width:180px;height:260px}.character-copy{text-align:left}.character-art-source{font-size:10px}.footer-inner span:nth-child(3){font-size:9px}}