@charset "UTF-8";
:root { color-scheme: light; --text: #333; --muted: #666; --link: #365ac5; }
* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body { margin: 0; background: #fff; color: var(--text); font-family: Arial, Helvetica, sans-serif; font-size: 15px; line-height: 1.65; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible { outline: 2px solid var(--link); outline-offset: 4px; }
[hidden] { display: none !important; }
.site-header { border-bottom: 1px solid #e5e5e5; }
.header-inner { max-width: 1050px; margin: auto; padding: 19px 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.site-name { color: #252525; font-size: 22px; font-weight: 600; }
nav { display: flex; flex-wrap: wrap; gap: 26px; }
nav a { color: #444; font-size: 14px; }
.layout { max-width: 1050px; margin: auto; padding: 48px 24px 40px; display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 65px; }
.profile { padding-top: 3px; }
h1 { color: #222; font-size: 28px; line-height: 1.3; margin: 0 0 20px; font-weight: 600; }
.profile p { margin: 0 0 10px; font-size: 14px; color: #555; }
.profile .position { color: #333; font-size: 15px; }
.profile .advisor { margin-top: 20px; }
.contact { margin-top: 35px; }
.contact h2 { font-size: 18px; margin-bottom: 13px; }
.contact a { display: block; margin: 9px 0; overflow-wrap: anywhere; font-size: 14px; }
h2 { font-size: 23px; font-weight: 600; line-height: 1.4; margin: 0 0 17px; color: #252525; }
section { margin: 0 0 38px; }
section p { margin: 0 0 15px; }
ul { margin: 0; padding-left: 21px; }
li { margin: 7px 0; }
.publication { margin-bottom: 25px; }
.publication h3, .project h3 { font-size: 15px; font-weight: 600; line-height: 1.6; margin: 0 0 6px; }
.publication p, .project p { margin: 4px 0; font-size: 14px; }
.publication .venue { font-style: italic; color: #555; }
.publication .paper-link, .project .code-link { font-size: 13px; }
.project { margin-bottom: 20px; }
.experience { margin-bottom: 20px; }
.experience h3 { font-size: 15px; font-weight: 600; margin: 0 0 4px; }
.experience p { font-size: 14px; margin: 0; }
footer { max-width: 1002px; margin: 0 auto; padding: 20px 0 30px; border-top: 1px solid #eee; color: #777; font-size: 12px; }
.skip-link { position: absolute; left: 16px; top: -100px; padding: 8px 12px; background: #fff; border: 1px solid #aaa; }
.skip-link:focus { top: 5px; }
@media (max-width: 800px) { .layout { grid-template-columns: 225px minmax(0, 1fr); gap: 35px; } nav { gap: 16px; } footer { margin: 0 24px; } }
@media (max-width: 600px) { .header-inner { flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px 22px; } nav { gap: 10px 20px; } nav a { font-size: 13px; } .layout { display: block; padding: 30px 22px; } .profile { padding-bottom: 24px; margin-bottom: 30px; border-bottom: 1px solid #e5e5e5; } h1 { font-size: 27px; margin-bottom: 16px; } h2 { font-size: 21px; } .contact { margin-top: 23px; } section { margin-bottom: 30px; } }