:root {
  --pad-x: 22px;
  --tile-gap: 14px;
  --paper: #fffff2;
  --blue: #0b5aff;
  --news-link: #f92d9d;
  --line: rgba(11, 90, 255, .82);
  --serif: Georgia, 'Times New Roman', serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--blue);
  font-family: var(--serif);
  font-weight: 400;
}
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: .1em; }
a:focus-visible, summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.page { width: 100%; padding: 24px var(--pad-x) 30px; }
.topbar, .hero, .archive-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 18px;
}
.topbar { align-items: start; }
.site-name { display: block; width: fit-content; font-size: clamp(31px, 2.72vw, 39px); line-height: 1.05; letter-spacing: -.025em; }
.profile-links { display: flex; flex-direction: column; align-items: flex-start; font-size: clamp(23px, 1.91vw, 27px); line-height: 1.08; letter-spacing: -.016em; }
.hero { margin-top: 94px; align-items: start; }
.intro, .news-panel, .publication-list, .talk-list { min-width: 0; }
.intro-lead { margin: 0; max-width: 18em; font-size: clamp(32px, 2.72vw, 39px); line-height: 1.05; letter-spacing: -.022em; }
.intro-rest { width: 100%; max-width: 700px; margin: 25px 0 0; font-size: clamp(18px, 1.12vw, 19px); line-height: 1.36; letter-spacing: 0; text-align: justify; text-justify: inter-word; hyphens: auto; }
.portrait { width: 100%; max-width: 700px; margin: 42px 0 0; }
.portrait img { display: block; width: 100%; height: auto; outline: 1px solid var(--blue); }
.section-nav { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 34px; font-size: 20px; }
.section-nav a { text-decoration: underline; text-underline-offset: .12em; }
.column-heading { margin: -29px 0 8px; font-size: 19px; font-weight: 400; line-height: 1.2; }
.news-month { --month-width: 102px; --month-gap: 14px; display: grid; grid-template-columns: minmax(0, 1fr) var(--month-width); gap: var(--month-gap); border-top: 1px solid var(--line); }
.news-month:first-of-type { border-top: 0; }
.news-month h3 { grid-column: 2; grid-row: 1; margin: 7px 0 0; font-size: clamp(16px, 1.31vw, 19px); line-height: 1.12; font-weight: 400; text-align: right; }
.news-month time { text-transform: none; }
.news-list { grid-column: 1; grid-row: 1; margin: 0; padding: 0; list-style: none; }
.news-list li { position: relative; padding: 6px 0 9px; font-size: clamp(17px, 1.35vw, 20px); line-height: 1.25; letter-spacing: -.005em; }
.news-list li:not(:last-child)::after { content: ''; position: absolute; left: 0; bottom: 0; width: calc(100% + var(--month-width) + var(--month-gap)); border-bottom: 1px solid var(--line); }
.news-list p { margin: 0; }
.news-list em { font-style: italic; }
.news-list strong { font-weight: 700; }
.news-list a, .news-list a:hover { color: var(--news-link); text-decoration: none; }
.archive-section { margin-top: 136px; align-items: start; scroll-margin-top: 26px; }
.section-label h2 { margin: 0; font-size: clamp(32px, 2.72vw, 39px); font-weight: 400; line-height: 1.05; letter-spacing: -.022em; }
.talk-list { border-top: 1px solid var(--line); }
.talk { padding: 8px 0 18px; border-bottom: 1px solid var(--line); }
.talk h3 { margin: 0; font-size: clamp(24px, 1.91vw, 28px); font-weight: 400; line-height: 1.12; letter-spacing: -.018em; }
#publications.archive-section { display: block; }
#publications .section-label { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 10px 25px; margin-bottom: 20px; }
.gallery-instruction { margin: 0; font-size: 17px; font-style: italic; }

/* Full-bleed poster mosaic: masonry columns that run to both page edges. */
.publication-list { margin-inline: calc(-1 * var(--pad-x)); columns: 4; column-gap: var(--tile-gap); border-top: 0; padding-top: 0; }
.publication-list.is-masonry { display: flex; columns: auto; gap: var(--tile-gap); align-items: flex-start; }
.mosaic-col { display: flex; flex: 1 1 0; flex-direction: column; gap: var(--tile-gap); min-width: 0; }
.publication { break-inside: avoid; -webkit-column-break-inside: avoid; margin: 0 0 var(--tile-gap); }
.paper-tile { display: block; position: relative; overflow: hidden; background: var(--paper); }
.paper-poster { display: block; width: 100%; height: auto; }
.paper-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(15px, 1.5vw, 28px); background: rgba(255,255,242,.96); color: var(--blue); opacity: 0; transition: opacity .18s ease; overflow: hidden; }
.paper-tile:hover .paper-overlay, .paper-tile:focus-visible .paper-overlay { opacity: 1; }
.paper-tile:focus-visible { outline: 3px solid var(--news-link); outline-offset: -3px; }
.paper-overlay-title { display: block; font-size: clamp(17px, 1.42vw, 23px); line-height: 1.1; letter-spacing: -.016em; }
.paper-overlay-meta { display: block; margin-top: 7px; font-size: clamp(13px, 1.02vw, 15px); font-style: italic; line-height: 1.22; overflow-wrap: anywhere; }
.paper-overlay-abstract { display: block; margin-top: 11px; font-size: clamp(13px, 1.05vw, 16px); line-height: 1.26; }
.talk-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 5px 16px; }
.talk h3 { flex: 1 1 380px; }
.talk-slides { flex: none; font-size: 17px; line-height: 1.2; opacity: .55; }
.talk-heading a.talk-slides { opacity: 1; text-decoration: underline; }
.talk-venues { margin-top: 10px; font-size: clamp(17px, 1.38vw, 20px); line-height: 1.26; }
.talk-venues summary { width: fit-content; cursor: pointer; text-decoration: underline; text-underline-offset: .1em; }
.talk-venues summary::marker { font-size: .75em; }
.talk-venues ul { margin: 8px 0 0; padding-left: 1.3em; }
.talk-venues li { margin: 4px 0; }
.footer { display: flex; flex-wrap: wrap; gap: 7px 24px; justify-content: space-between; margin-top: 130px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 18px; line-height: 1.2; }
@media (min-width: 1500px) {
  :root { --pad-x: 1.6vw; }
}
@media (min-width: 1800px) { .publication-list { columns: 5; } }
@media (max-width: 1250px) { .publication-list { columns: 3; } }
@media (max-width: 860px)  { .publication-list { columns: 2; } }
@media (max-width: 800px) {
  :root { --pad-x: 18px; }
  .page { padding: 19px var(--pad-x) 26px; }
  .topbar, .hero, .archive-section { grid-template-columns: 1fr; }
  .profile-links { flex-direction: row; flex-wrap: wrap; gap: 3px 15px; margin-top: 23px; font-size: 21px; }
  .hero { margin-top: 72px; gap: 76px; }
  .intro-lead { font-size: clamp(31px, 6vw, 38px); }
  .intro-rest { font-size: 18px; }
  .column-heading { margin: 0 0 8px; }
  .archive-section { margin-top: 96px; gap: 23px; }
  .news-list li { font-size: clamp(17px, 3.7vw, 20px); }
  .talk h3 { font-size: clamp(23px, 4.2vw, 28px); }
  .talk-venues { font-size: 18px; }
  .footer { margin-top: 95px; }
}
@media (max-width: 860px) {
  .paper-overlay { position: static; opacity: 1; background: none; padding: 11px var(--pad-x) 2px; }
  .paper-overlay-abstract { display: none; }
  .publication { margin-bottom: 26px; }
  .publication-list.is-masonry { gap: 26px; }
  .mosaic-col { gap: 26px; }
  .gallery-instruction { display: none; }
}
@media (max-width: 560px) {
  .publication-list { columns: 1; }
  .paper-overlay-abstract { display: block; }
}
@media (max-width: 420px) {
  .news-month { --month-width: 70px; --month-gap: 10px; }
  .news-month h3 { font-size: 15px; }
  .news-list li { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .paper-overlay { transition: none; } }
