:root {
  --ink:#23332f;
  --body:#45514c;
  --muted:#6e7772;
  --accent:#a3452b;
  --line:#e0e5e0;
  --paper:#fff;
  --soft:#f5f7f4;
  --serif:Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif
}

* {
  box-sizing:border-box
}
html {
  scroll-behavior:auto;
  scroll-padding-top:38px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--body);
  font:16px/1.75 var(--sans);
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit;
  text-decoration:none
}
a:hover {
  color:var(--accent)
}
a:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:5px;
  border-radius:2px
}
::selection {
  background:#e7eee6;
  color:var(--ink)
}
p {
  margin:0 0 18px
}
strong {
  color:var(--ink);
  font-weight:600
}
h1,h2,h3 {
  color:var(--ink);
  margin:0;
  font-weight:500
}
h2 {
  font:30px/1.25 var(--serif);
  letter-spacing:-.6px
}
h3 {
  line-height:1.45
}
sup {
  font-size:.7em
}
.page-shell {
  max-width:1180px;
  padding:76px 56px 0;
  margin:auto;
  display:grid;
  grid-template-columns:216px minmax(0,1fr);
  gap:72px
}
.sidebar {
  position:sticky;
  top:64px;
  height:fit-content;
  padding-top:8px
}
.identity {
  font:25px/1.3 var(--serif);
  color:var(--ink);
  letter-spacing:-.5px
}
.identity span {
  display:block;
  font:13px/1.6 var(--sans);
  letter-spacing:0;
  margin-top:9px;
  color:var(--muted)
}
.affiliation {
  font-size:14px;
  line-height:1.65;
  margin-top:26px
}
.sidebar nav {
  display:grid;
  margin:34px 0 32px;
  gap:12px;
  font-size:14px
}
.sidebar nav a {
  border-left:2px solid transparent;
  padding-left:15px;
  margin-left:-17px
}
.sidebar nav a[aria-current] {
  border-color:var(--accent);
  color:var(--accent)
}
.sidebar-links {
  display:grid;
  gap:9px;
  font-size:14px
}
.sidebar-links a {
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  max-width:180px;
  padding:7px 12px;
  border:1px solid #ecdcd1;
  border-radius:5px;
  background:#faf3ee;
  color:var(--accent);
  font-weight:500;
  transition:background .2s,border-color .2s
}
.sidebar-links a:hover {
  background:#f3e4da;
  border-color:#d8b7a2
}
.sidebar-links span {
  font-size:12px;
  margin-left:8px;
  color:inherit
}
.sidebar-note {
  margin-top:35px;
  font-size:12px;
  color:var(--muted)
}
main {
  min-width:0
}
section {
  padding:0 0 62px;
  margin-bottom:52px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:10px
}
.eyebrow {
  font-size:12px;
  letter-spacing:1.65px;
  margin-bottom:17px;
  color:var(--accent);
  font-weight:600
}
h1 {
  font:64px/1.05 var(--serif);
  letter-spacing:-2.5px;
  margin-bottom:26px
}
.name-period {
  color:var(--accent)
}
.intro {
  font:26px/1.5 var(--serif);
  letter-spacing:-.45px;
  color:var(--ink);
  margin-bottom:27px
}
.intro em {
  font-weight:400;
  color:var(--accent)
}
.research-interests {
  border-left:2px solid var(--line);
  padding-left:22px;
  margin-top:31px
}
.research-interests h2 {
  font:600 15px/1.5 var(--sans);
  letter-spacing:0;
  margin-bottom:10px
}
.research-interests p {
  font-size:16px;
  line-height:1.8
}
.research-topics {
  display:flex;
  flex-wrap:wrap;
  gap:6px 18px;
  font-size:12px;
  color:var(--muted)
}
.section-heading {
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:30px
}
.section-number {
  font:12px/1.5 var(--sans);
  color:var(--accent);
  letter-spacing:.8px
}
.experience+.experience {
  margin-top:29px;
  padding-top:27px;
  border-top:1px solid var(--line)
}
.experience-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px
}
.experience h3 {
  font-size:21px;
  font-weight:600;
  letter-spacing:-.4px
}
.dates {
  font-size:13px;
  color:var(--muted);
  white-space:nowrap
}
.experience .role {
  font-size:14px;
  color:var(--accent);
  margin:5px 0 10px
}
.experience p {
  font-size:16px;
  line-height:1.8;
  margin-bottom:9px
}
.experience .advisors {
  font-size:12px;
  color:var(--muted);
  margin-bottom:0
}
.advisors span {
  display:block;
  margin-top:2px
}
.projects-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px
}
.project {
  border:1px solid var(--line);
  border-radius:5px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:border-color .2s,transform .2s
}
.project:hover {
  color:inherit;
  border-color:#aeb9ae;
  transform:translateY(-3px)
}
.project-image {
  height:174px;
  background:#eef1ec;
  overflow:hidden;
  border-bottom:1px solid var(--line)
}
.project-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block
}
.project-image.diagram {
  background:#fff;
  padding:12px
}
.project-image.diagram img {
  object-fit:contain
}
.project-body {
  padding:22px;
  display:flex;
  flex-direction:column;
  flex:1
}
.project-category {
  font-size:12px;
  letter-spacing:1px;
  color:var(--muted);
  margin-bottom:11px
}
.project h3 {
  font:24px/1.2 var(--serif);
  letter-spacing:-.6px;
  margin-bottom:13px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:6px
}
.project h3 span {
  font:18px/1.4 var(--sans);
  color:var(--accent)
}
.project-body>p:not(.project-category) {
  font-size:19px;
  font-weight:400;
  line-height:1.5;
  color:var(--body);
  margin-bottom:24px
}
.project-body>p:not(.project-category) strong {
  font-weight:600;
  color:var(--accent)
}
.project-link {
  font-size:13px;
  color:var(--accent);
  margin-top:auto
}
.publication-note {
  font-size:12px;
  color:var(--muted);
  margin-top:-17px;
  margin-bottom:27px
}
.publication+.publication {
  border-top:1px solid var(--line);
  margin-top:26px;
  padding-top:27px
}
.publication-meta {
  display:flex;
  gap:11px;
  align-items:center;
  flex-wrap:wrap;
  font-size:12px;
  margin-bottom:9px
}
.venue {
  color:var(--accent);
  font-weight:600
}
.distinction {
  color:var(--muted)
}
.publication:first-child .distinction {
  background:#f8eee8;
  color:#904225;
  padding:1px 7px;
  border-radius:3px
}
.publication h3 {
  font-size:17px;
  font-weight:600;
  line-height:1.5;
  letter-spacing:-.15px;
  margin-bottom:10px
}
.authors {
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
  margin-bottom:10px
}
.authors strong {
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:#bfc8bf
}
.paper-links {
  display:flex;
  gap:19px;
  font-size:12px;
  color:var(--accent)
}
.paper-links span {
  font-size:12px
}
.all-publications {
  margin-top:35px;
  padding:20px 0 0;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:14px
}
.all-publications>span:last-child {
  color:var(--accent)
}
#publications {
  padding-bottom:0;
  border:0;
  margin-bottom:58px
}
footer {
  display:flex;
  justify-content:space-between;
  border-top:1px solid var(--line);
  padding:25px 0 32px;
  font-size:12px;
  color:var(--muted)
}
.skip-link {
  position:fixed;
  left:20px;
  top:-100px;
  background:white;
  padding:12px;
  z-index:10
}
.skip-link:focus {
  top:16px
}

@media(min-width:1300px) {
  .page-shell {
  padding-top:92px
}

}

@media(max-width:1000px) {
  .page-shell {
  padding:48px 32px 0;
  grid-template-columns:180px minmax(0,1fr);
  gap:36px
}
.sidebar {
  top:40px
}
.project-body {
  padding:17px
}
.project-image {
  height:150px
}
.project h3 {
  font-size:22px
}
.project-category {
  font-size:12px;
  letter-spacing:.5px
}
.experience-heading {
  align-items:flex-start;
  flex-direction:column;
  gap:2px
}

}

@media(max-width:760px) {
  html {
  scroll-padding-top:20px
}
.page-shell {
  display:block;
  max-width:660px;
  padding:28px 24px 0
}
.sidebar {
  position:static;
  padding:0 0 26px;
  margin-bottom:38px;
  border-bottom:1px solid var(--line)
}
.identity {
  font-size:21px
}
.identity span,.affiliation,.sidebar-note {
  display:none
}
.sidebar nav {
  display:flex;
  gap:12px 22px;
  flex-wrap:wrap;
  margin:17px 0 16px;
  font-size:13px
}
.sidebar nav a {
  border:0;
  padding:0;
  margin:0
}
.sidebar-links {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  font-size:12px
}
.sidebar-links a {
  width:auto;
  max-width:none
}
.sidebar-links span {
  margin-left:1px
}
h1 {
  font-size:54px
}
.intro {
  font-size:24px
}
.eyebrow {
  font-size:12px;
  letter-spacing:1.35px
}
.desktop-only {
  display:none
}
section {
  padding-bottom:40px;
  margin-bottom:39px
}
h2 {
  font-size:27px
}
.section-heading {
  gap:12px;
  margin-bottom:24px
}
.research-interests {
  padding-left:17px
}
.experience-heading {
  flex-direction:row;
  align-items:center
}
.dates {
  font-size:12px
}
.projects-grid {
  gap:18px
}
.project-body {
  padding:18px
}
.project-image {
  height:160px
}
.all-publications {
  font-size:13px
}

}

@media(max-width:480px) {
  .projects-grid {
  grid-template-columns:1fr
}
.project-image {
  height:194px
}
.project-body {
  padding:21px
}
.project h3 {
  font-size:26px
}
.project-category {
  font-size:12px
}
.project-body>p:not(.project-category) {
  font-size:19px
}
.experience-heading {
  flex-direction:column;
  align-items:flex-start
}
body {
  font-size:16px
}
.sidebar nav {
  gap:8px 18px
}
.intro {
  font-size:23px
}
.research-topics {
  font-size:12px;
  gap:5px 12px
}
h1 {
  font-size:50px
}
.publication h3 {
  font-size:16px
}

}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}
.project {
  transition:none
}
.project:hover {
  transform:none
}

}

@media print {
  .sidebar,.skip-link,footer {
  display:none
}
.page-shell {
  display:block;
  padding:0;
  max-width:none
}
section {
  padding-bottom:20px;
  margin-bottom:20px
}
.project,.publication,.experience {
  break-inside:avoid
}
a {
  color:inherit
}

}

/* Paper covers stay small beside the bibliographic details. */
.publication {
  display: grid;
  grid-template-columns: 176px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.publication-content { min-width: 0; }
.paper-cover {
  display: block;
  overflow: hidden;
  border-radius: 5px;
  border: 1px solid var(--line);
  background: #f5f7f4;
  aspect-ratio: 3 / 2;
  margin-top: 4px;
}
.paper-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.paper-cover-wide img { object-fit: contain; background: #fff; }
.dae-cover { background: #0e0e0e; }
.dae-cover img { object-fit: contain; object-position: center; }
@media (min-width: 761px) and (max-width: 1000px) {
  .publication { grid-template-columns: 130px minmax(0, 1fr); gap: 18px; }
}
@media (max-width: 560px) {
  .publication { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .paper-cover { width: min(210px, 65%); margin-top: 0; }
}

/* Keep supplied paper figures complete, including labels and axes. */
.paper-cover-figure { background: #fff; }
.paper-cover-figure img { object-fit: contain; object-position: center; }

.liveavatar-cover { background: #222; }
.liveavatar-cover img { object-fit: contain; object-position: center; }
/* Enlarge the conversation figure within its thumbnail, allowing side cropping. */
.omnipersona-cover { background: #fff; }
.omnipersona-cover img { object-fit: cover; object-position: 45% center; }

.all-publications { justify-content: flex-start; }

/* Personal portrait alongside the introduction. */
.about-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px;
  column-gap: 28px;
  align-items: start;
  margin-bottom: 27px;
}
.about-hero > :not(.portrait) { grid-column: 1; }
.about-hero .intro { margin-bottom: 0; }
.about-hero .desktop-only { display: none; }
.portrait {
  grid-column: 2;
  grid-row: 1 / 4;
  display: block;
  width: 100%;
  height: auto;
  border-radius: 5px;
}
@media (max-width: 560px) {
  .about-hero { grid-template-columns: minmax(0, 1fr) 104px; column-gap: 20px; }
  .about-hero h1 { font-size: 42px; }
  .about-hero .eyebrow { font-size: 10px; letter-spacing: 1px; }
  .about-hero .portrait { grid-row: 1 / 3; }
  .about-hero .intro { grid-column: 1 / -1; margin-top: 20px; }
}