@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#10233d; --muted:#617087; --paper:#f7f9fc; --white:#fff; --line:#dbe3ed; --blue:#315bce; --teal:#17a09a; --signal:#ee7352; --shadow:0 18px 52px rgba(16,35,61,.09); }
:root[data-theme="dark"] { --ink:#eaf2ff; --muted:#aebbd0; --paper:#0c1525; --white:#15233a; --line:#2e405a; --blue:#8eacff; --teal:#57d0c7; --signal:#ffad8d; --shadow:0 18px 52px rgba(0,0,0,.24); }
@media (prefers-color-scheme: dark) { :root:not([data-theme]) { --ink:#eaf2ff; --muted:#aebbd0; --paper:#0c1525; --white:#15233a; --line:#2e405a; --blue:#8eacff; --teal:#57d0c7; --signal:#ffad8d; --shadow:0 18px 52px rgba(0,0,0,.24); } }
* { box-sizing:border-box; } html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,"Microsoft YaHei UI","Microsoft YaHei",sans-serif; font-size:16px; line-height:1.72; }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:3px; } a:focus-visible { outline:3px solid var(--signal); outline-offset:4px; }
.site-shell { max-width:1400px; margin:0 auto; padding:28px 32px 52px; }
.masthead { display:flex; justify-content:space-between; align-items:center; padding:0 2px 22px; font-size:.82rem; font-weight:800; }.masthead-actions { display:flex; align-items:center; gap:14px; }.brand { color:var(--blue); text-decoration:none; letter-spacing:-.03em; }.language-link { color:var(--muted); }.language-link:hover { color:var(--blue); }.theme-toggle { width:34px; height:34px; padding:0; color:var(--ink); font:inherit; font-size:1.05rem; line-height:1; cursor:pointer; background:transparent; border:1px solid var(--line); border-radius:50%; }.theme-toggle:hover { color:var(--blue); border-color:var(--blue); }.theme-toggle:focus-visible { outline:3px solid var(--signal); outline-offset:3px; }
.hero { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(240px,.6fr); gap:48px; min-height:420px; padding:clamp(36px,6vw,86px); color:#fff; background:#10233d; box-shadow:var(--shadow); }.hero::after { content:""; position:absolute; width:560px; height:560px; right:-210px; bottom:-370px; border:52px solid var(--teal); border-radius:50%; opacity:.94; }.hero-copy,.hero-side { position:relative; z-index:1; }
.kicker,.section-label,.timeline-date,.hero-side dt { margin:0; color:var(--signal); font-family:"DM Mono",monospace; font-size:.73rem; font-weight:500; letter-spacing:.02em; }.hero h1 { max-width:760px; margin:14px 0 20px; font-size:clamp(2.9rem,6.4vw,6.6rem); line-height:.98; letter-spacing:-.075em; }.hero-summary { max-width:620px; margin:0; color:#d5e2f3; font-size:clamp(1rem,1.5vw,1.22rem); }.hero-side { align-self:end; padding:24px; border-left:1px solid rgba(255,255,255,.22); }.hero-side dl { margin:0; }.hero-side dd { margin:3px 0 20px; font-size:.96rem; }.hero-side dd:last-child { margin-bottom:0; }.hero-side a { color:#fff; }.hero-side a:hover { color:#9cf0e8; }
.quick-links { display:flex; flex-wrap:wrap; gap:10px; padding:22px 0 12px; border-bottom:1px solid var(--line); }.quick-links a { padding:6px 11px; color:var(--muted); font-size:.82rem; font-weight:700; text-decoration:none; border-radius:99px; }.quick-links a:hover { color:var(--blue); background:#e9efff; }
.content-grid { display:grid; grid-template-columns:minmax(210px,.45fr) minmax(0,1.55fr); gap:clamp(40px,8vw,128px); padding-top:62px; }.aside { align-self:start; position:sticky; top:24px; }.aside h2 { margin:10px 0; font-size:clamp(1.75rem,2.5vw,2.4rem); line-height:1.1; letter-spacing:-.055em; }.aside p { margin:0; color:var(--muted); font-size:.92rem; }.resume-section { padding:0 0 64px; scroll-margin-top:20px; }.resume-section + .resume-section { padding-top:6px; border-top:1px solid var(--line); }.section-label { display:block; margin-bottom:12px; }.section-heading { margin:0 0 24px; font-size:clamp(1.65rem,2.7vw,2.55rem); line-height:1.08; letter-spacing:-.055em; }.intro { max-width:750px; margin:0; font-size:1.15rem; line-height:1.75; }
.timeline { margin:0; padding:0; list-style:none; }.timeline-item { position:relative; display:grid; grid-template-columns:150px minmax(0,1fr); gap:28px; padding:0 0 38px; }.timeline-item::before { content:""; position:absolute; left:151px; top:10px; bottom:-2px; width:1px; background:var(--line); }.timeline-item:last-child { padding-bottom:0; }.timeline-item:last-child::before { display:none; }.timeline-date { padding-top:3px; }.timeline-body { position:relative; }.timeline-body::before { content:""; position:absolute; top:5px; left:-33px; width:10px; height:10px; background:var(--paper); border:2px solid var(--teal); border-radius:50%; }.timeline-body h3 { margin:0; font-size:1.17rem; line-height:1.35; letter-spacing:-.025em; }.role { margin:5px 0 13px; color:var(--blue); font-size:.88rem; font-weight:800; }.timeline-body ul { margin:0; padding:0; list-style:none; }.timeline-body li { position:relative; max-width:770px; margin:0 0 9px; padding-left:18px; color:var(--ink); opacity:.84; }.timeline-body li::before { content:""; position:absolute; top:.73em; left:1px; width:7px; height:1px; background:var(--signal); }.project-item { padding-bottom:46px; }.project-item .timeline-body::before { border-color:var(--blue); }
.skill-list { display:grid; gap:18px; margin:0; }.skill-list div { max-width:780px; padding-bottom:18px; border-bottom:1px solid var(--line); }.skill-list div:last-child { padding-bottom:0; border-bottom:0; }.skill-list dt { margin-bottom:4px; color:var(--blue); font-size:.86rem; font-weight:800; }.skill-list dd { margin:0; color:var(--ink); opacity:.84; }
.contact-panel { padding:30px; color:var(--white); background:var(--blue); box-shadow:0 14px 30px rgba(49,91,206,.18); }.contact-panel .section-label { color:#bfcfff; }.contact-panel h2 { margin:0 0 10px; font-size:1.55rem; line-height:1.2; letter-spacing:-.045em; }.contact-panel p { margin:0 0 20px; color:#e7ecff; }.button { display:inline-block; padding:10px 16px; color:var(--ink); font-size:.86rem; font-weight:800; text-decoration:none; background:var(--white); border-radius:4px; }.button:hover { color:var(--blue); }.site-footer { padding:34px 0 0; color:var(--muted); font-size:.8rem; text-align:center; }
@media (max-width:720px) { .site-shell { padding:18px 18px 36px; }.masthead { padding-bottom:16px; }.hero { grid-template-columns:1fr; gap:32px; min-height:auto; padding:38px 28px; }.hero h1 { font-size:clamp(2.8rem,16vw,4.6rem); }.hero-side { padding:18px 0 0; border-top:1px solid rgba(255,255,255,.22); border-left:0; }.content-grid { display:block; padding-top:42px; }.aside { position:static; margin-bottom:38px; }.resume-section { padding-bottom:46px; }.timeline-item { grid-template-columns:1fr; gap:7px; padding-left:24px; }.timeline-item::before { left:4px; top:9px; }.timeline-body::before { left:-24px; }.timeline-date { color:var(--signal); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }