html {-webkit-text-size-adjust: 100%; text-size-adjust: 100%;}
body {background-color: #fdfdfd; color: #2c3c4c; margin: 0; font-size: 15px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;}
h1 {margin-bottom: 32px; font-size: 2.4em;}
h2 {margin-top: 48px; font-size: 1.6em;}
h1, h2 {color: #345;}
* {font-weight: normal; font-family: Inter, system-ui, Roboto, 'Helvetica Neue', Helvetica, sans-serif;}
.header {width: 100%; padding-top: 24px; padding-bottom: 0px;}
.header-div {border-bottom: #e0e0e0 1px solid; padding-bottom: 20px; display: flex; align-items: flex-start;}
.header-profile-picture {width: 120px; height: 120px; flex-shrink: 0; margin-right: 24px; border-radius: 50%; background-image: url(files/me.jpg); background-position: center; background-size: contain; background-repeat: no-repeat;}
.header-name h1 {margin-top: 10px; margin-bottom: 6px; line-height: 1.1;}
.header-subtitle {margin-bottom: 10px;}
.content {max-width: 860px; padding-left: 16px; padding-right: 16px; margin: auto; margin-top: 48px;}
a {color: #2471a3; text-decoration: none; transition: color 0.2s;}
a:focus, a:hover {color: #f09228;}
p {line-height: 1.5em;}
.noselect {-webkit-touch-callout: none; -webkit-user-select: none; user-select: none;}
.bold {font-weight: bold;}
.italic {font-style: italic;}
.row {display: flex; align-items: flex-start; box-sizing: border-box;}
.row-media {flex-shrink: 0; width: 200px; height: 112px; background-position: center; background-size: contain; background-repeat: no-repeat;}
.row-text {margin-left: 16px; line-height: 1.5em; min-width: 0;}
.row-text span {line-height: inherit;}
.interests {display: flex; flex-wrap: wrap; gap: 16px;}
.interest {width: 268px; max-width: 100%;}
.video-container {width: 100%; max-width: 268px; margin: auto; border-radius: 6px; overflow: hidden;}
.interest-text {max-width: 268px; margin-top: 8px;}
.publication {margin-bottom: 36px; padding: 8px; border-radius: 6px; transition: background-color 0.2s;}
.publication:hover {background-color: #f5f7f9;}
.publication.highlight {background-color: #f7efd4; width: 100%; border-radius: 6px;}
.publication.highlight:hover {background-color: #f3e9c8;}
.press {width: 100px; height: 80px; margin-right: 12px; background-size: cover;}
.sticky-nav {position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(253,253,253,0.85); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid #e0e0e0; transform: translateY(-100%); transition: transform 0.3s ease; font-size: 14px;}
.sticky-nav.visible {transform: translateY(0);}
.sticky-nav-content {max-width: 860px; margin: auto; padding: 10px 16px; display: flex; align-items: center; justify-content: space-between;}
.sticky-nav-name {color: #345; font-size: 16px; text-decoration: none;}
.sticky-nav-name:hover {color: #345;}
.header-links-row {white-space: nowrap;}
.sticky-nav-links {display: flex; gap: 16px;}
.sticky-nav-links a {color: #2471a3; text-decoration: none; transition: color 0.2s;}
.sticky-nav-links a:hover {color: #f09228;}
.footer {border-top: #e0e0e0 1px solid; width: 100%; max-width: 860px; margin: auto;}
.footer-content {color: #999; font-size: 12px; padding: 12px 0; max-width: 860px; margin: auto;}
.footer-content a {color: #999 !important; text-decoration: underline; transition: color 0.2s;}
.footer-content a:hover {color: #666 !important;}
.stars {font-size: 11px; display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; color: #666; background-color: #f0f0f0; border: 1px solid #d0d7de; border-radius: 12px; padding: 1px 8px; vertical-align: middle; line-height: 1.5;}
.gh-icon {width: 13px; height: 13px; flex-shrink: 0;}

@media only screen and (max-width: 1150px) {
    .header-div {flex-direction: column; align-items: center; text-align: center;}
    .header-profile-picture {margin: 0 auto 12px auto; width: 150px; height: 150px;}
    body {font-size: 18px;}
    a.btn {font-size: 14px; padding: 2px 6px;}
}

@media only screen and (max-width: 1000px) {
    .publication {margin-bottom: 46px;}
    .publication.row {flex-direction: column; align-items: center;}
    .publication .row-media {width: 100%; max-width: 400px; height: 158px; margin-bottom: 12px;}
    .publication .row-text {width: 100%; margin-left: 0;}
    .interests {flex-direction: column; align-items: center; gap: 24px;}
    .interest {width: 100%; max-width: 400px;}
    .video-container {max-width: 400px;}
    .interest-text {max-width: 400px;}
    .header-links {display: flex; flex-direction: column; gap: 4px;}
    .header-links-separator {display: none;}
}

@media only screen and (max-width: 600px) {
    .press {width: 80px; height: 64px; margin-right: 8px;}
    .sticky-nav-links {gap: 12px;}
    .sticky-nav-name {font-size: 14px;}
}