:root{color-scheme:dark;--base:#111d29;--ink:#f7f3e8;--muted:#d7d8d8;--gold:#dcc69a;--scene:#102e35;--accent:#bde3cc;--serif:'Noto Serif SC','Source Han Serif SC','Songti SC','STSong','SimSun',serif;--sans:'Microsoft YaHei','PingFang SC',system-ui,sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--base);color:var(--ink)}body{font-family:var(--sans);overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button{border:0;background:none}a{color:inherit}.skip{position:fixed;top:-90px;left:20px;background:var(--base);z-index:30;padding:15px}.skip:focus{top:10px}.topbar{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 4.5vw;background:#111d29;position:relative;z-index:5;border-bottom:1px solid #dcc69a35}.identity{display:flex;gap:15px;align-items:center;text-decoration:none;font:24px var(--serif);letter-spacing:3px}.identity small{font:12px var(--sans);letter-spacing:1.5px;margin-left:22px;color:var(--muted)}.diamond{display:inline-block;width:12px;height:12px;border:1px solid var(--gold);transform:rotate(45deg)}.review-tools{display:flex;align-items:center;gap:30px}.version{color:#c6c7ca;font-size:12px;letter-spacing:2px}.review-tools button{font-size:14px;border-left:1px solid #dcc69a45;padding:7px 0 7px 25px}.review-tools button span{color:var(--gold);margin-left:14px}.stage{height:calc(100svh - 198px);min-height:575px;isolation:isolate;position:relative;overflow:hidden;background:var(--scene);transition:background .5s}.backdrop{position:absolute;inset:0;background:center/cover no-repeat;z-index:-4;opacity:.56;transition:background .2s}.scene-shade{position:absolute;inset:0;background:linear-gradient(90deg,var(--scene) 0%,color-mix(in srgb,var(--scene) 95%,transparent) 24%,color-mix(in srgb,var(--scene) 75%,transparent) 43%,transparent 77%),linear-gradient(0deg,var(--scene),transparent 30%);z-index:-3}.region-word{position:absolute;left:5%;bottom:2%;color:#ffffff09;font:clamp(95px,12vw,180px)/1 Georgia,serif;letter-spacing:-9px;z-index:-2;white-space:nowrap}.character{position:absolute;right:-11%;bottom:-2%;height:103%;width:auto;max-width:none;z-index:-1;pointer-events:none;object-fit:contain;transform-origin:center bottom;animation:character-in 900ms cubic-bezier(.2,.65,.2,1) both}.scene-content{position:relative;width:54%;max-width:870px;padding:clamp(38px,5vh,70px) 0 44px 7vw;z-index:2}.eyebrow{display:flex;align-items:center;gap:14px;font-size:13px;letter-spacing:4px;color:var(--accent);margin:0 0 28px}.eyebrow:before{content:'';width:35px;height:1px;background:var(--accent)}h1,h2,p{margin:0}h1{font:400 clamp(45px,5.2vw,83px)/1.26 var(--serif);letter-spacing:2px;text-wrap:balance}h1 .accent{color:var(--accent)}h1 .small-line{font-size:.65em;letter-spacing:1px;color:var(--muted)}.hero-title{font-size:clamp(64px,6.4vw,104px);line-height:1.14;letter-spacing:9px}.candidate{font-size:20px;letter-spacing:4px;margin-top:26px}.candidate strong{font-family:var(--serif);font-size:34px;font-weight:400;color:var(--gold);margin-left:12px}.lead{font-size:18px;line-height:1.95;max-width:500px;margin-top:23px;color:var(--ink)}.quote{font:18px/1.9 var(--serif);margin-top:33px;padding:0 0 0 20px;border-left:1px solid var(--gold);max-width:420px}.quote cite{display:block;font:12px/2 var(--sans);font-style:normal;letter-spacing:2px;color:#d7d8d8;margin-top:7px}.scene-content>*{animation:content-in 600ms ease both}.scene-content>*:nth-child(2){animation-delay:80ms}.scene-content>*:nth-child(3){animation-delay:160ms}.scene-content>*:nth-child(4){animation-delay:220ms}.subline{font-size:14px;letter-spacing:2px;color:var(--muted);margin-top:30px}.scene-signature{position:absolute;right:4.5%;bottom:29px;text-align:right;font:18px var(--serif);letter-spacing:4px;text-shadow:0 2px 8px #000;z-index:2}.scene-signature small{display:block;font:11px var(--sans);letter-spacing:3px;margin-top:9px;color:#e7dfce}.edge-caption{position:absolute;left:24px;top:50%;writing-mode:vertical-rl;font-size:10px;letter-spacing:3px;color:#ddd9ca9e}.traits{margin-top:32px;display:flex;gap:0}.traits span{font-size:17px;padding:0 18px;border-right:1px solid #ffffff35}.traits span:first-child{padding-left:0}.traits span:last-child{border:0}.highlight-line{margin-top:25px;border-top:1px solid #ffffff35;padding-top:21px;font-size:16px;line-height:1.9;max-width:465px;color:#e7e3e5}.reverse .scene-shade{background:linear-gradient(270deg,var(--scene) 0%,color-mix(in srgb,var(--scene) 95%,transparent) 20%,color-mix(in srgb,var(--scene) 65%,transparent) 44%,transparent 77%),linear-gradient(0deg,var(--scene),transparent 25%)}.reverse .character{left:-25%;right:auto}.reverse .scene-content{margin-left:52%;width:45%;padding-left:0;padding-right:4vw}.reverse h1{font-size:clamp(44px,4.5vw,70px)}.reverse .scene-signature{left:7%;right:auto;text-align:left}.reverse .region-word{left:0;bottom:0}.resume{margin-top:26px;max-width:520px}.resume-row{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #d7e5ee50;padding:19px 0;align-items:center}.resume-row strong{font-weight:400;font-family:var(--serif);font-size:26px}.resume-row span{font-size:14px;color:#d7dfea}.message-line{font-size:15px;color:var(--accent);margin-top:16px;line-height:2}.directory{margin-top:26px;max-width:460px}.directory details{border-top:1px solid #cbe29c4a}.directory summary{display:flex;gap:18px;align-items:center;padding:15px 0;font-family:var(--serif);font-size:25px;cursor:pointer;list-style:none}.directory summary::-webkit-details-marker{display:none}.directory summary small{font:12px Georgia,serif;color:var(--accent)}.directory summary:after{content:'＋';font:18px var(--sans);color:var(--accent);margin-left:auto}.directory details[open] summary:after{content:'−'}.directory details p{font-size:16px;line-height:1.9;color:#e3e9df;padding:0 20px 15px 35px}.path{display:flex;gap:25px;margin-top:35px;max-width:500px;border-top:1px solid #f5c38c70;padding-top:22px}.path div{flex:1;position:relative}.path b{font:13px Georgia,serif;color:var(--accent);display:block;margin-bottom:13px}.path span{font-size:18px;white-space:nowrap}.path p{font-size:12px;line-height:1.8;color:#e9d6cb;margin-top:8px}.interests{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;max-width:495px;margin-top:25px}.interest{border-top:1px solid #e6c98a60;text-align:left;padding:14px 0;min-height:86px;position:relative}.interest b{display:block;font:24px var(--serif);font-weight:400;color:var(--gold);margin-bottom:7px}.interest span{font-size:14px;color:var(--ink);line-height:1.8}.interest:hover b{color:#fff}.interest-note{min-height:36px;font-size:14px;line-height:1.8;color:var(--accent);margin-top:17px}.journey-footer{height:83px;display:flex;align-items:center;padding:0 4.5vw;gap:34px;border-top:1px solid #dcc69a50;background:#111d29}.counter{display:flex;align-items:baseline;gap:9px}.counter strong{font:30px Georgia,serif;color:var(--gold)}.counter span{font-size:12px;color:#c2c6cc}.journey-nav{display:flex;flex:1;align-items:center;justify-content:center;gap:clamp(12px,2.4vw,40px)}.journey-nav button{font-size:14px;letter-spacing:2px;color:#c6c7ca;position:relative;padding:22px 4px}.journey-nav button[aria-current=true]{color:var(--gold)}.journey-nav button[aria-current=true]:before{content:'';position:absolute;left:50%;top:8px;transform:translateX(-50%) rotate(45deg);width:4px;height:4px;background:var(--gold)}.pager{display:flex;gap:10px}.pager button{width:39px;height:39px;border:1px solid #b1a28a70;border-radius:50%;font-size:18px}.pager button:hover{background:#dcc69a;color:#111d29}.pager button:disabled{opacity:.3;cursor:default}.prototype-caption{height:31px;background:#0b1520;color:#b9c1c9;padding:8px 4.5vw;font-size:11px;letter-spacing:1px;display:flex;justify-content:space-between}.gate .backdrop{opacity:.9;background-position:center}.gate .scene-shade{background:linear-gradient(0deg,#111d29bb,transparent 70%)}.gate .scene-content{width:100%;max-width:none;text-align:center;position:absolute;bottom:35px;padding:0 25px}.gate .eyebrow{justify-content:center}.gate h1{font-size:30px;letter-spacing:9px;text-shadow:0 2px 12px #0008}.gate .eyebrow:before{display:none}.gate .character,.gate .region-word,.gate .scene-signature{display:none}.enter-button{font-size:17px;letter-spacing:4px;background:#f7f3e8;color:#172936;min-width:245px;margin-top:23px;padding:16px 30px;border:1px solid #dcc69a;box-shadow:0 6px 40px #0003}.gate-note{font-size:12px;color:#f7f3e8;margin-top:16px;text-shadow:0 2px 6px #000}.exposure{position:fixed;inset:0;z-index:20;background:#fff;opacity:0;pointer-events:none}.exposure.play{animation:expose 1100ms ease-in-out}.ending .backdrop{opacity:1;background-size:contain;background-position:center bottom;background-repeat:no-repeat}.ending .scene-shade{background:linear-gradient(180deg,#111d29 0%,#111d29e8 24%,#111d2990 44%,transparent 67%)}.ending .scene-content{width:100%;max-width:none;text-align:center;padding:32px 20px}.ending .eyebrow{justify-content:center;margin-bottom:17px}.ending .eyebrow:before{display:none}.ending h1{font-size:clamp(38px,3.8vw,59px)}.ending .lead{margin:14px auto 0;max-width:1100px;font-size:17px}.ending .character,.ending .scene-signature,.ending .region-word{display:none}.ending .closing-name{font:15px var(--serif);letter-spacing:4px;margin-top:16px}.ending .edge-caption{display:none}dialog{background:#111d29;color:var(--ink);border:1px solid #dcc69a70;width:min(850px,92vw);max-height:88svh;padding:32px 40px;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#020a14b5;backdrop-filter:blur(8px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;font-size:12px;letter-spacing:2px;color:var(--gold)}.dialog-top button{font-size:14px;padding:10px;border:1px solid #dcc69a50}dialog h2{font:34px/1.4 var(--serif);margin-bottom:18px}.note-section{margin-top:24px}.note-section h3{font-size:14px;letter-spacing:2px;color:var(--gold);font-weight:400}.note-section p{font-size:16px;line-height:1.9;color:#eee9e2}.swatches{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 20px}.swatch{display:flex;align-items:center;gap:8px;font-size:12px;color:#d6d8da}.swatch i{display:block;width:27px;height:27px;border:1px solid #ffffff40;background:var(--swatch)}.manuscript-link{display:inline-block;margin-top:28px;color:var(--gold);font-size:14px;text-decoration:none;border-bottom:1px solid #dcc69a70;padding-bottom:5px}.no-script{position:fixed;z-index:30;top:25%;left:10%;right:10%;background:#111d29;padding:30px}
@keyframes content-in{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes character-in{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}@keyframes expose{0%{opacity:0}45%{opacity:1}60%{opacity:1}100%{opacity:0}}
@media(min-width:1800px){.stage{max-height:1100px}.scene-content{padding-top:9vh}.lead{font-size:21px}.character{right:-5%}}
@media(max-height:810px) and (min-width:901px){.stage{min-height:535px}.scene-content{padding-top:30px}.eyebrow{margin-bottom:20px}h1{font-size:clamp(40px,4.5vw,66px)}.hero-title{font-size:74px}.candidate{margin-top:16px}.quote{margin-top:20px;font-size:16px}.lead{font-size:16px;margin-top:18px}.subline{margin-top:20px}.traits{margin-top:23px}.directory{margin-top:20px}.directory summary{padding:11px 0}.resume-row{padding:14px 0}.reverse h1{font-size:51px}.ending h1{font-size:43px}}
@media(max-width:1100px){.identity small{display:none}.scene-content{width:57%;padding-left:6vw}.character{right:-24%}.reverse .character{left:-39%}.reverse .scene-content{margin-left:48%;width:51%}.journey-footer{gap:17px;padding:0 3vw}.journey-nav{gap:12px}.scene-signature{right:3%}.path{gap:16px}}
@media(max-width:1100px){.topbar{height:70px;padding:0 20px}.identity{font-size:21px;letter-spacing:2px;gap:11px}.version{display:none}.review-tools button{padding-left:12px;font-size:12px;border:0}.review-tools button span{margin-left:2px}.stage{height:auto;min-height:calc(100svh - 201px);padding-top:270px;overflow:hidden}.character{height:400px;top:-10px;bottom:auto;right:calc(50% - 285px);z-index:-1}.backdrop{background-size:auto 440px;background-position:center top;background-repeat:no-repeat;opacity:.68}.scene-shade{background:linear-gradient(0deg,var(--scene) 35%,color-mix(in srgb,var(--scene) 95%,transparent) 54%,transparent 83%);z-index:0}.scene-content,.reverse .scene-content{width:100%;max-width:none;padding:18px 27px 35px;margin-left:0;z-index:2}.eyebrow{font-size:12px;letter-spacing:3px;margin-bottom:16px}.hero-title{font-size:58px;letter-spacing:3px}.hero-title br{display:none}h1,.reverse h1{font-size:39px;line-height:1.35;letter-spacing:1px}.candidate{font-size:17px;margin-top:13px}.candidate strong{font-size:30px}.lead{font-size:16px;line-height:1.85;margin-top:15px}.quote{font-size:16px;line-height:1.8;margin-top:21px;max-width:100%}.quote cite{font-size:12px}.subline{font-size:12px;margin-top:17px}.scene-signature,.edge-caption,.region-word{display:none}.traits{margin-top:23px}.traits span{font-size:16px;padding:0 13px}.highlight-line{font-size:15px;margin-top:21px;padding-top:16px}.reverse .character{left:auto;right:calc(50% - 285px)}.reverse .scene-shade{background:linear-gradient(0deg,var(--scene) 35%,color-mix(in srgb,var(--scene) 95%,transparent) 54%,transparent 83%)}.resume-row strong{font-size:24px}.resume-row span{font-size:13px}.directory{max-width:none;margin-top:24px}.directory summary{font-size:24px}.path{gap:18px;flex-wrap:wrap;margin-top:24px}.path div{min-width:40%}.path p{font-size:13px}.interests{gap:0 20px}.interest{min-height:88px}.interest b{font-size:24px}.interest span{font-size:13px}.journey-footer{height:93px;padding:12px 18px;display:grid;grid-template-columns:43px 1fr 76px;gap:13px}.journey-nav{justify-content:start;gap:10px;overflow-x:auto;padding:4px 2px;scrollbar-width:thin}.journey-nav button{white-space:nowrap;font-size:14px;padding:19px 5px}.counter{display:block}.counter strong{font-size:27px}.counter span{display:block;font-size:11px}.pager{gap:6px}.pager button{width:34px;height:34px}.prototype-caption{height:38px;font-size:10px;line-height:1.6;padding:7px 18px}.prototype-caption span{display:none}.gate{height:calc(100svh - 201px);min-height:550px;padding-top:0}.gate .backdrop{background-size:cover}.gate .scene-shade{background:linear-gradient(0deg,#111d29b5,transparent 80%)}.gate .scene-content{bottom:45px}.gate h1{font-size:27px;letter-spacing:5px}.gate-note{font-size:11px}.ending{padding-top:0;min-height:700px}.ending .backdrop{background-size:auto 430px;background-position:center bottom}.ending .scene-content{padding:29px 24px}.ending .scene-shade{background:linear-gradient(180deg,#111d29 12%,#111d29e0 32%,transparent 60%)}.ending h1{font-size:34px;line-height:1.4}.ending .lead{font-size:16px;line-height:1.9}.ending .closing-name{font-size:14px;margin-top:16px}dialog{padding:23px}.dialog-top{font-size:10px;letter-spacing:1px}dialog h2{font-size:29px}}
.character-cue{position:absolute;z-index:4;transform:translate(-50%,-50%);border:1px solid #dcc69a9c;background:#111d29e8;color:var(--accent);padding:12px 19px;font-size:13px;letter-spacing:1px;box-shadow:0 3px 20px #0003;white-space:nowrap}.character-cue:before{content:'◇';color:var(--accent);margin-right:10px}.character-cue:hover{background:#111d29;border-color:var(--accent)}.connection{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;overflow:visible}.connection path{fill:none;stroke:var(--accent);stroke-width:1.5;opacity:0}.companion-cameo{position:absolute;z-index:3;right:30px;bottom:64px;width:190px;height:148px;margin:0;border-bottom:1px solid var(--accent);background:linear-gradient(0deg,var(--scene),transparent);pointer-events:none}.companion-cameo img{position:absolute;bottom:20px;right:-55px;height:158px;width:auto;max-width:none}.companion-cameo figcaption{position:absolute;bottom:0;font-size:11px;color:var(--ink);background:var(--scene);padding:7px 9px;right:0;white-space:nowrap}.reverse .companion-cameo{right:auto;left:18px}.reverse .companion-cameo img{right:-30px}
@media(max-width:1100px){.character-cue{top:225px!important;left:auto!important;right:20px;transform:none;padding:10px 13px;font-size:12px}.connection{z-index:3}.companion-cameo,.reverse .companion-cameo{top:145px;bottom:auto;left:15px;right:auto;width:120px;height:105px}.companion-cameo img,.reverse .companion-cameo img{height:110px;right:-30px}.companion-cameo figcaption{font-size:10px}.stage:not(.gate):not(.ending){padding-top:282px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.exposure.play{animation:none}}
.gate .backdrop{background-size:auto 118%;background-position:center top}
.stage[data-scene=inazuma] .character{height:94%;right:-27%}
.stage[data-scene=natlan] h1{font-size:clamp(42px,4.15vw,64px)}
.ending .backdrop{inset:0 3% 0 auto;width:62%;background-size:contain;background-position:center}
.ending .scene-shade{background:none}
.ending .scene-content{width:36%;text-align:left;padding:75px 0 40px 5vw}
.ending .eyebrow{justify-content:start}
.ending h1{font-size:clamp(34px,3.05vw,48px);line-height:1.5}
.ending .lead{font-size:16px;line-height:2.05;margin-top:29px}
.ending .closing-name{margin-top:28px}
.ending:after{content:'2025 五周年官方纪念插画 · 原图保留';position:absolute;right:4%;bottom:24px;color:#d7d8d8;font-size:11px;letter-spacing:1px}
@media(max-width:1100px){.gate .backdrop{background-size:auto 118%}.stage[data-scene=inazuma] .character{height:360px;right:calc(50% - 370px)}.stage[data-scene=natlan] h1{font-size:35px}.ending{min-height:680px}.ending .backdrop{inset:auto 12px 35px;width:calc(100% - 24px);height:230px;background-size:contain;background-position:center}.ending .scene-content{width:100%;padding:32px 26px;text-align:left}.ending .eyebrow{justify-content:start}.ending h1{font-size:34px}.ending .lead{margin-top:20px}.ending .closing-name{margin-top:20px}.ending:after{left:26px;bottom:14px;font-size:10px}}