@font-face {
  font-family:"EB Garamond";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('./fonts/eb-garamond-normal-400.ttf') format('truetype')
}

@font-face {
  font-family:"EB Garamond";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('./fonts/eb-garamond-normal-600.ttf') format('truetype')
}

@font-face {
  font-family:"EB Garamond";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url('./fonts/eb-garamond-normal-700.ttf') format('truetype')
}

@font-face {
  font-family:"EB Garamond";
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url('./fonts/eb-garamond-italic-400.ttf') format('truetype')
}

@font-face {
  font-family:"EB Garamond";
  font-style:italic;
  font-weight:600;
  font-display:swap;
  src:url('./fonts/eb-garamond-italic-600.ttf') format('truetype')
}

:root {
  color-scheme:dark;
  --background:#0e0e0e;
  --text:#fff;
  --muted:#909090;
  --heading:#8d8df7;
  --link:#6060cc
}

* {
  box-sizing:border-box
}

html {
  background:var(--background);
  scroll-behavior:smooth
}

body {
  margin:0;
  color:var(--text);
  background:var(--background);
  font-family:"EB Garamond",Garamond,Georgia,serif;
  font-size:18px;
  font-weight:400;
  line-height:21px;
  -webkit-font-smoothing:antialiased
}

h1,h2,h3,h4,p,ul,dl,dd {
  margin:0
}

h1,h2,h3,h4 {
  font-size:inherit
}

ul {
  padding:0;
  list-style:none
}

a {
  color:var(--link);
  text-decoration:none;
  text-underline-offset:3px
}

a:hover {
  text-decoration:underline
}

a:focus-visible {
  outline:2px solid var(--heading);
  outline-offset:5px
}

img {
  display:block;
  max-width:100%
}

sup {
  font-size:.58em;
  line-height:0;
  vertical-align:super
}

h2 {
  color:var(--heading);
  font-weight:700;
  line-height:25px;
  font-size:18px;
  letter-spacing:.12px
}

h3,h4 {
  font-weight:400
}

strong {
  font-weight:600
}

.site-shell {
  max-width:857px;
  margin:0 auto;
  padding-top:132px;
  padding-bottom:55px
}

main {
  width:694px
}

.skip-link {
  position:absolute;
  left:12px;
  top:-80px;
  background:var(--background);
  padding:12px;
  z-index:10
}

.skip-link:focus {
  top:12px
}

.intro {
  display:grid;
  grid-template-columns:445px 179px;
  gap:53px;
  align-items:center;
  height:246px;
  margin-bottom:38px
}

.intro-copy {
  text-align:right;
  transform:translateY(9.5px)
}

h1 {
  font-size:26px;
  line-height:32px;
  color:var(--heading);
  font-weight:700;
  margin-bottom:13px
}

.intro p {
  font-size:18px;
  line-height:21px
}

.portrait-panel {
  width:179px;
  height:246px;
  background:#fff;
  clip-path:polygon(0 0,100% 9%,100% 100%,0 100%);
  position:relative
}

.portrait-panel img {
  position:absolute;
  width:150px;
  height:225px;
  left:14px;
  top:-9px
}

.papers h2 {
  margin-bottom:8px
}

.paper-list {
  display:grid;
  gap:17px
}

.paper {
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:17px;
  min-height:97px
}

.paper-picture {
  height:97px;
  width:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  clip-path:polygon(0 0,100% 0,100% 100%,7% 100%)
}

.paper-picture .paper-illustration {
  object-fit:contain;
  height:85px;
  width:200px
}

.paper-picture.monotonicity .paper-illustration {
  width:216px;
  height:93px;
  transform:translate(5px,4px)
}

.paper-picture.ramsey .paper-illustration {
  width:211px;
  height:88px;
  transform:translateY(4px)
}

.paper-picture.auctions .paper-illustration {
  width:192px;
  height:88px;
  margin-left:15px;
  transform:translateY(-1px)
}

.paper h3 {
  font-size:17px;
  font-style:italic;
  line-height:21px;
  white-space:nowrap
}

.paper h3 a,.project h3 a {
  color:inherit
}

.authors {
  font-size:17.8px;
  line-height:21px;
  white-space:nowrap
}

.paper-meta {
  display:flex;
  justify-content:space-between;
  align-items:center;
  height:21px;
  line-height:21px
}

.venue {
  font-size:18px;
  font-style:italic
}

.paper-links {
  display:flex;
  align-items:center;
  gap:19px
}

.acm-link,.arxiv-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  min-height:21px;
  transition:filter 180ms ease
}

.acm-link img {
  width:70px;
  height:auto
}

.arxiv-link img {
  width:31px;
  height:auto
}

.acm-link:hover,.arxiv-link:hover,.acm-link:focus-visible,.arxiv-link:focus-visible {
  filter:brightness(1.45)
}

.paper-description {
  font-size:14px;
  line-height:17px;
  font-style:italic;
  color:var(--muted)
}

.projects {
  margin-top:49px
}

.projects h2 {
  margin-bottom:14px
}

.project-grid {
  display:grid;
  grid-template-columns:317px 327px;
  column-gap:30px;
  row-gap:22px;
  padding-left:7px
}

.project h3 {
  font-size:18px;
  line-height:21px
}

.collaborators {
  font-size:14px;
  line-height:17.3px
}

.project p {
  font-size:14.8px;
  line-height:17.3px;
  color:var(--muted);
  max-width:317px;
  hyphens:manual
}

.project:nth-child(even) p {
  max-width:327px
}

.project-4 {
  padding-bottom:6px
}

.project-6 h3 {
  max-width:317px
}

.teaching {
  margin-top:22px
}

.teaching h2 {
  margin-bottom:3px
}

.teaching-body {
  padding-left:7px
}

.teaching-role {
  margin-bottom:14px
}

.role-date {
  font-size:15px;
  line-height:20px;
  color:var(--muted)
}

.teaching h3 {
  font-size:18px;
  line-height:22px
}

.seminar-details {
  padding-left:18px
}

.seminar-details h4 {
  font-style:italic;
  font-size:18px;
  line-height:23px
}

.seminar-grid {
  display:grid;
  grid-template-columns:350px 1fr;
  font-size:15px;
  line-height:17.3px
}

.seminar-grid li {
  white-space:nowrap
}

.coursework {
  margin-top:40px
}

.coursework h2 {
  margin-bottom:8px
}

.coursework-body {
  padding-left:11px
}

.course-grid {
  display:grid;
  grid-template-columns:344px 1fr;
  font-size:15px;
  line-height:17.3px
}

.course-grid li {
  white-space:nowrap
}

.languages {
  font-size:15px;
  line-height:17.3px;
  margin-top:16px;
  padding-left:2px
}

.languages>div {
  display:flex;
  gap:11px
}

.languages dt {
  color:var(--link)
}

.art {
  margin-top:29px
}

.art-body {
  padding-left:14px
}

.art p {
  font-size:18px;
  line-height:24px
}

.art-picture {
  width:216px;
  height:115px;
  background:#fff;
  clip-path:polygon(0 0,100% 0,84% 100%,0 100%);
  display:block;
  margin-top:10px;
  padding:7px 0 0 18px
}

.art-picture img {
  width:160px;
  height:96px
}

@media(min-width:1500px) {
  .site-shell {
    max-width:980px
  }

  main {
    width:760px
  }

  .intro {
    grid-template-columns:485px 179px
  }

  .project-grid {
    grid-template-columns:347px 347px;
    column-gap:30px
  }

  .project p {
    max-width:330px
  }

}

@media(max-width:900px) {
  .site-shell {
    margin:0 36px;
    padding-top:80px
  }

  main {
    width:100%
  }

  .intro {
    grid-template-columns:minmax(0,1fr) 179px;
    gap:35px
  }

  .desktop-break {
    display:none
  }

  .project-grid {
    grid-template-columns:1fr 1fr;
    gap:26px
  }

  .project p {
    max-width:none
  }

  .paper h3,.authors {
    white-space:normal
  }

  .paper {
    grid-template-columns:200px 1fr
  }

  .paper-picture {
    width:200px
  }

  .seminar-grid,.course-grid {
    grid-template-columns:1fr 1fr;
    gap:20px
  }

  .seminar-grid li,.course-grid li {
    white-space:normal
  }

}

@media(max-width:620px) {
  body {
    font-size:18px
  }

  .site-shell {
    margin:0 24px;
    padding-top:42px;
    padding-bottom:42px
  }

  .intro {
    height:auto;
    grid-template-columns:1fr;
    gap:28px;
    margin-bottom:40px
  }

  .intro-copy {
    text-align:left;
    transform:none;
    order:2
  }

  .intro h1 {
    margin-bottom:12px
  }

  .intro p {
    line-height:24px
  }

  .portrait-panel {
    order:1;
    width:143px;
    height:197px
  }

  .portrait-panel img {
    width:120px;
    height:180px;
    left:11px;
    top:-7px
  }

  .paper-list {
    gap:30px
  }

  .paper {
    grid-template-columns:1fr;
    gap:12px
  }

  .paper-picture {
    width:220px
  }

  .paper h3,.authors {
    line-height:23px
  }

  .paper h3 {
    font-size:19px
  }

  .paper-meta {
    margin:3px 0;
    height:auto;
    min-height:21px;
    gap:12px
  }

  .paper-description {
    font-size:16px;
    line-height:20px
  }

  .projects {
    margin-top:36px
  }

  .project-grid {
    grid-template-columns:1fr;
    gap:24px;
    padding-left:0
  }

  .project p {
    font-size:16px;
    line-height:21px
  }

  .project h3 {
    font-size:19px;
    line-height:24px
  }

  .collaborators {
    font-size:16px
  }

  .project:nth-child(even) p {
    max-width:none
  }

  .project-4 {
    padding-bottom:0
  }

  .project-6 h3 {
    max-width:none
  }

  .teaching {
    margin-top:36px
  }

  .teaching-body,.coursework-body,.art-body {
    padding-left:0
  }

  .teaching h2 {
    margin-bottom:8px
  }

  .teaching-role {
    margin-bottom:20px
  }

  .teaching h3 {
    line-height:24px
  }

  .seminar-details {
    padding-left:12px;
    margin-top:6px
  }

  .seminar-grid,.course-grid {
    grid-template-columns:1fr;
    gap:10px;
    font-size:16px;
    line-height:21px
  }

  .coursework {
    margin-top:36px
  }

  .languages {
    font-size:16px;
    line-height:21px;
    padding-left:0;
    margin-top:20px
  }

  .languages>div {
    display:block;
    margin-top:10px
  }

  .art {
    margin-top:32px
  }

  .art-picture {
    margin-top:12px
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }

}

/* Underlines communicate links without relying on color or hover. */
.project h3 a {
  color:var(--heading);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-decoration-color:#8d8df780;
  text-underline-offset:3px;
  transition:color 180ms ease,text-decoration-color 180ms ease
}

.project h3 a:hover,.project h3 a:focus-visible {
  color:#b8b8ff;
  text-decoration-color:currentColor
}

/* Only the hydrated enhancement marks content as pending. With JavaScript off,
   or reduced motion enabled, the complete document remains visible. */
@media(prefers-reduced-motion:no-preference) {
  [data-reveal-state="pending"] {
    opacity:0
  }

  .portrait-panel img {
    transform-origin:48.2% 0.67%
  }

  .paper-picture .paper-illustration,.art-picture img {
    transform-origin:50% 60%
  }

  .portrait-panel img,.paper-picture .paper-illustration,.art-picture img {
    transition:rotate 450ms ease,translate 450ms ease
  }

  .art-picture:hover img,.art-picture:focus-visible img {
    rotate:1deg;
    translate:0 -1px
  }

}

@media(prefers-reduced-motion:reduce) {
  [data-reveal] {
    opacity:1!important
  }

  .project h3 a,.acm-link,.arxiv-link {
    transition:none
  }

}

@media print {
  [data-reveal] {
    opacity:1!important;
    translate:none!important
  }

}

.paper-illustration {
  display:block;
  max-width:100%
}

.paper-illustration svg {
  display:block;
  width:100%;
  height:100%;
  overflow:visible
}

