/* Editorial proportions and motion designed around native scrolling. */
:root{--paper:#efefd8;--ink:#1d1d1b;--accent:#f1d575;--ease:cubic-bezier(.22,1,.36,1)}
body{background:var(--ink);color:var(--paper)}
header{position:absolute;width:100%;height:90px;background:transparent;border:0;padding-inline:3%}
.wordmark i,.reading-line{background:var(--accent)}
.hero{min-height:82svh;max-width:none;padding:155px 7% 85px;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}
.hero-meta{width:100%;max-width:1250px;font-size:10px;letter-spacing:3px}
.hero h1{font-family:Georgia,'Songti SC','SimSun',serif;font-size:clamp(56px,8.4vw,130px);line-height:1.15;letter-spacing:-.045em;margin:55px 0 40px;transform:none!important}
.hero h1 .pink{color:var(--accent)}
.hero-bottom{width:100%;max-width:1250px;text-align:left;align-items:center;margin-top:25px}
.hero:after{content:'';position:absolute;bottom:-45px;left:-10%;width:120%;height:90px;background:var(--ink);border-radius:50% 50% 0 0;z-index:-1}
.orb{inset:-35% -10% auto;width:120%;height:150%;opacity:.16;overflow:hidden;pointer-events:none;transform:translateY(var(--scroll,0px))}
.orb i{inset:10%;border:45px solid #b1b19a20;border-radius:45%;animation:orbit 100s linear infinite}
.orb i:nth-child(2){inset:17%;border-width:60px;border-color:#b1b19a20;animation-duration:130s}
.orb i:nth-child(3){inset:25%;border-width:35px;border-color:#b1b19a20;animation-duration:80s}
.orb b,.orb:after{display:none}
.section{padding:100px 7%;max-width:1600px}
.section-top{margin-bottom:55px}
.section-top h2,.closing h2{font-family:Georgia,'Songti SC','SimSun',serif}
.grid{gap:80px 44px}.cover{height:clamp(280px,31vw,470px);transform:none!important;box-shadow:none!important;transition:none;border-radius:2px}
.cover:after{display:none}.cover img{transition:transform 1.1s var(--ease)}.cover:hover img{transform:scale(1.045)}
.copy h2{font-size:clamp(26px,2.6vw,40px);margin-block:17px}.copy p{line-height:1.9}
.project-cue{background:var(--accent);color:var(--ink);width:80px;height:80px;transition:opacity .3s,translate .6s var(--ease);right:25px;bottom:25px}
.primary,.statement em,.services article>span{color:var(--accent)}.primary{border-color:#a18d4e}.btn:hover{color:var(--accent);border-color:var(--accent);translate:0 -2px}
.round-link:hover span{background:var(--accent);border-color:var(--accent)}
.about{padding-block:130px}.statement{text-align:center;max-width:1150px;margin:35px auto 110px;font-family:Georgia,'Songti SC','SimSun',serif;line-height:1.55;font-size:clamp(32px,4.5vw,67px)}
.bio{grid-template-columns:1fr 1fr;gap:9%;align-items:center;max-width:1200px;margin:auto}.bio p{color:var(--paper);font-size:16px;line-height:2.05;margin-bottom:26px}.bio-label{border-left:1px solid #757563;padding:70px 40px;font-family:Georgia,'Songti SC','SimSun',serif;font-size:clamp(36px,4vw,60px)!important}.bio-label span{display:block;margin-top:15px;letter-spacing:3px;font:12px Arial}
.portrait{margin:0;overflow:hidden;aspect-ratio:4/5;background:#292923}.portrait img{width:100%;height:100%;object-fit:cover}.portrait figcaption{display:none}
.services{gap:7%;margin-block:70px}.services article{border-top:1px solid #ffffff35;padding-top:25px}.services article:hover{transform:none}.services article:hover h3{color:var(--accent)}
.experience>div,.award{padding-block:30px;transition:background .3s}.experience>div:hover,.award:hover{padding-inline:0;background:#ffffff06}
dialog{width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:40px 7%;background:var(--paper);color:var(--ink)}dialog nav{max-width:1200px;margin:6vh auto}dialog nav a{font-family:Georgia,'Songti SC','SimSun',serif;font-size:clamp(40px,6vw,85px);padding:20px 0}dialog nav a:hover{color:#89722d}dialog[open]{animation:menu-arrive .65s var(--ease)}
.closing{text-align:center;padding-block:130px;max-width:none;background:#25251f}.closing .round-link{justify-content:center}.closing h2{font-size:clamp(50px,7vw,110px)}
.reveal,.card.reveal{transition:opacity 1s var(--ease),transform 1.2s var(--ease);transition-delay:0ms}.reveal.pending,.card.reveal.pending{transform:translateY(30px)}
@media(max-width:760px){header{height:75px;padding-inline:6%}.hero{min-height:72svh;padding:115px 6% 60px}.hero h1{font-size:clamp(43px,10vw,72px);letter-spacing:-2px;margin:45px 0 30px}.hero-meta{font-size:8px;letter-spacing:1px}.hero-bottom{gap:25px}.section{padding:65px 6%}.grid{gap:55px}.cover{height:300px}.statement{margin:20px auto 55px;font-size:30px}.bio{grid-template-columns:1fr;gap:35px}.bio-label{padding:25px}.bio p{font-size:14px}.portrait{max-width:480px}.project-cue{width:52px;height:52px}.closing{padding:80px 6%}dialog{padding:25px 6%}.services{margin-block:40px;gap:35px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.orb i{animation:none!important}*,*:before,*:after{animation:none!important;transition:none!important}.pending{opacity:1!important;transform:none!important}}
.wanderer-cover{background:#bca474}.wanderer-cover svg{transition:transform 1s var(--ease)}.wanderer-cover:hover svg{transform:scale(1.04)}.wanderer-cover-title{position:absolute;left:0;right:0;bottom:0;padding:52px 28px 24px;background:linear-gradient(transparent,#302318d9);color:#fff3ce;font:36px/1.1 Georgia,"SimSun",serif;text-shadow:0 2px 10px #0005;pointer-events:none}.wanderer-cover-title small{display:block;font:11px/1.5 Arial,"Microsoft YaHei",sans-serif;letter-spacing:3px;margin-top:10px}.wanderer-cover .project-cue{z-index:2}

.software-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:8%;padding:46px;border:1px solid #ffffff25;background:#252422;margin-top:65px}.software-heading>span{color:#ed72ad;font-size:11px;letter-spacing:3px}.software-heading h3{font:42px/1.3 Georgia,"SimSun",serif;margin:22px 0}.software-heading h3>span{display:block;font:14px/1.8 Arial,"Microsoft YaHei",sans-serif;color:#b7b7ac;margin-top:18px}.software-bars{list-style:none;padding:0;margin:0;display:grid;gap:28px}.software-bars li{display:flex;gap:18px;align-items:center}.tool-icon{display:grid;place-items:center;flex:0 0 48px;height:48px;border:1px solid #da659c66;color:#f1b0cc;background:#a7075622;font:22px Georgia,serif}.tool-level{flex:1}.tool-level h4{font:18px Arial,sans-serif;margin:0 0 12px}.skill-track{height:9px;background:#eeeede}.skill-track>span{display:block;height:100%;width:var(--level);background:#b80d65;transform-origin:left}.ability-process{padding:30px 0;border-bottom:1px solid #ffffff25}.ability-process h3{font-size:15px;font-weight:400}.ability-process p{font-size:14px;line-height:2.5;color:#b7b7ac}.ability-process p span{color:#ed72ad;margin:0 10px}.portrait img{object-position:center;object-fit:cover}.portrait{aspect-ratio:269/403;max-width:430px;width:100%;justify-self:center}
@media(max-width:760px){.software-panel{grid-template-columns:1fr;padding:27px 22px;gap:25px;margin-top:40px}.software-heading h3{font-size:32px;margin:15px 0}.software-bars{gap:25px}.tool-level h4{font-size:16px}.ability-process p span{margin:0 4px}}

/* About-page sequence: introduction, philosophy, profile, capabilities, history, work. */
.hero{min-height:88svh;padding-top:145px;padding-bottom:110px}.hero h1{font-size:clamp(70px,10vw,160px);line-height:1;margin:60px 0 30px;letter-spacing:.02em}.hero-english{display:block;font-family:Georgia,serif;font-size:.35em;letter-spacing:.08em;margin-top:23px}.hero-name{font-size:13px;letter-spacing:3px;color:#bbbba8;margin:0 0 45px}.hero-bottom{max-width:630px;justify-content:space-between}.about{border-top:0;padding-top:100px}.about .section-top{justify-content:center;text-align:center}.about .section-top>span{display:none}.about .section-top h2{font-size:16px;letter-spacing:4px;color:#a7a796}.statement{margin:45px auto 110px}.bio{align-items:start}.bio>div{padding-top:30px}.section-top h2{font-size:clamp(32px,4vw,58px)}.skills .section-top,.journey .section-top,.works .section-top{align-items:baseline}.skills .section-top>span,.journey .section-top>span,.works .section-top>span{max-width:210px;line-height:1.8}.skills{padding-top:120px}.software-panel{margin-top:70px}.journey{padding-block:110px}.closing{margin-top:60px}.closing h2{max-width:1100px;margin:40px auto 55px}.section{scroll-margin-top:35px}.hero-meta,.hero h1,.hero-name,.hero-bottom{animation:hero-arrive 1.1s var(--ease) both}.hero h1{animation-delay:.1s}.hero-name{animation-delay:.2s}.hero-bottom{animation-delay:.3s}.portrait{overflow:hidden}.portrait img{transition:transform 1.2s var(--ease)}.portrait:hover img{transform:scale(1.025)}
@media(max-width:760px){.hero{min-height:78svh;padding:125px 6% 75px}.hero h1{font-size:74px;margin:45px 0 25px}.hero-english{font-size:30px}.hero-name{font-size:11px;letter-spacing:2px}.hero-bottom{flex-direction:row;gap:14px}.hero-bottom .round-link{font-size:12px;gap:10px;align-self:auto}.about{padding-top:60px}.statement{margin:30px auto 60px}.bio>div{padding-top:0}.skills,.journey{padding-block:70px}.skills .section-top,.journey .section-top,.works .section-top{align-items:start}.section-top h2{font-size:32px}.closing{margin-top:0}}
@media(prefers-reduced-motion:reduce){.hero-meta,.hero h1,.hero-name,.hero-bottom{animation:none}.portrait img{transition:none}}

.profile-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:44px}.pill-link{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:22px;min-width:238px;min-height:64px;padding:16px 30px;border:1px solid var(--accent);border-radius:999px;color:var(--paper);font-size:17px;transition:color .35s ease,transform .45s var(--ease),box-shadow .45s ease}.pill-link:before{content:"";position:absolute;z-index:-1;inset:-1px;background:var(--accent);border-radius:inherit;transform:translateY(103%);transition:transform .5s var(--ease)}.pill-link i{font-style:normal;display:inline-block;transition:transform .45s var(--ease)}.pill-link:hover,.pill-link:focus-visible{color:var(--ink);box-shadow:0 8px 28px #f1d57512}.pill-link:hover:before,.pill-link:focus-visible:before{transform:translateY(0)}.pill-link:hover i,.pill-link:focus-visible i{transform:translate(3px,-3px)}.pill-link:active{transform:scale(.975)}.pill-link:focus-visible{outline:2px solid var(--paper);outline-offset:5px}.secondary-pill{min-width:210px;border-color:#777764}.secondary-pill:hover{border-color:var(--accent)}.actions .btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;border:1px solid #858570;border-radius:999px;transition:background .35s ease,color .35s ease,border-color .35s ease,transform .35s var(--ease)}.actions .btn:hover,.actions .btn:focus-visible{background:var(--accent);color:var(--ink);border-color:var(--accent);translate:none}.actions .btn:active{transform:scale(.97)}.actions{gap:12px}.actions .primary{border-color:var(--accent)}@media(max-width:760px){.profile-actions{gap:14px;margin-top:30px}.pill-link{min-width:0;width:100%;min-height:58px;font-size:16px}.actions .btn{font-size:12px;padding:10px 16px}}@media(prefers-reduced-motion:reduce){.pill-link,.pill-link:before,.pill-link i,.actions .btn{transition:none}.pill-link:hover i{transform:none}}

/* One palette throughout: charcoal, ivory and warm gold. */
:root{--accent:#f1d575}.software-heading>span,.ability-process p span,.services article>span,.primary,.btn:hover,.services article:hover h3{color:var(--accent)}.tool-icon{border-color:#f1d57566;color:#f1d575;background:#f1d5750b}.skill-track{background:#eeeedb26}.skill-track>span{background:var(--accent)}a:focus-visible,button:focus-visible,summary:focus-visible{outline-color:var(--accent)}.wordmark i,.reading-line,.project-cue{background:var(--accent)}.primary{border-color:#a18d4e}.statement em{color:var(--accent)}dialog nav a:hover{color:#89722d}::selection{background:#f1d575;color:#1d1d1b}

/* Resume palette: black, off-white and magenta; reference-inspired layout only. */
:root{--paper:#f4f1f3;--ink:#1c1b1c;--accent:#b80d65}body{background:var(--ink);color:var(--paper)}.hero h1 .pink,.statement em,.primary,.software-heading>span,.ability-process p span,.services article>span,.btn:hover,.services article:hover h3{color:#ed72ad}.tool-icon{border-color:#b80d6577;color:#f1b0cc;background:#b80d6518}.skill-track{background:#f4f1f333}.skill-track>span{background:#b80d65}.primary{border-color:#b80d65}.pill-link:hover,.pill-link:focus-visible,.actions .btn:hover,.actions .btn:focus-visible,.round-link:hover span{color:#fff}.pill-link:hover,.pill-link:focus-visible{box-shadow:0 8px 28px #b80d651c}.project-cue{color:#fff}.software-panel{background:#252225}.closing{background:#252225}.bio-label{border-color:#777077}.section-top>span,.hero-meta,.hero-name{color:#b7afb5}.secondary-pill{border-color:#8f7886}dialog nav a:hover{color:#b80d65}::selection{background:#b80d65;color:#fff}

/* Strong visual hierarchy for headings and primary navigation. */
.pill-link{font-weight:700;font-size:19px;letter-spacing:.02em;border-width:1.5px}.profile-actions .pill-link:not(.secondary-pill){background:#b80d65;color:#fff;border-color:#b80d65;box-shadow:0 5px 22px #b80d651c}.profile-actions .pill-link:not(.secondary-pill):before{background:#d21979}.profile-actions .secondary-pill{font-weight:600;color:#eee7eb;border-color:#a28b99}.section-top h2{font-family:Arial,"Microsoft YaHei",sans-serif;font-weight:700;letter-spacing:-.025em}.software-heading h3{font-family:Arial,"Microsoft YaHei",sans-serif;font-weight:700}.software-heading h3>span{font-weight:400}.round-link,.actions .btn{font-weight:600}.copy h2,.services h3{font-weight:650}.tool-level h4{font-weight:600}.section-top>span{font-weight:600;letter-spacing:1.5px}.ability-process h3{font-weight:700;font-size:18px}@media(max-width:760px){.pill-link{font-size:17px}}
