:root {
  --surround: #f8f5ef;
  --paper: #f8f5ef;
  --ink: #2e2a26;
  --muted: #665f57;
  --rule: #b8ab9c;
  --rule-light: #ded5c9;
  --link: #315c58;
  --serif: "Newsreader", Georgia, serif;
  --math: "Newsreader", Georgia, serif;
  --mono: "Source Sans 3", Arial, sans-serif;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 22px;
}

body {
  margin: 0;
  background: var(--surround);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.38;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--link);
  text-decoration: none;
}

a:hover { text-decoration: underline; }

.skip-link {
  position: fixed;
  top: -70px;
  left: 14px;
  z-index: 50;
  padding: 7px 10px;
  background: #fff;
  border: 1px solid #000;
  color: #000;
  font-family: var(--mono);
  font-size: 11px;
}

.skip-link:focus { top: 14px; }

.screen-nav {
  display: flex;
  justify-content: space-between;
  width: min(calc(100% - 40px), 1120px);
  margin: 0 auto;
  padding: 16px 0 13px;
  border-bottom: 1px solid var(--rule-light);
  color: #444;
  font-family: var(--mono);
  font-size: 9px;
}

.screen-nav > span { text-align: right; }

.paper {
  width: min(calc(100% - 40px), 1120px);
  margin: 0 auto;
  padding: 42px 0 52px;
  background: var(--paper);
}

.title-block {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(290px, 0.72fr);
  column-gap: 55px;
  padding-bottom: 31px;
  text-align: left;
}

.document-type {
  grid-column: 1;
  grid-row: 1;
  margin: 0 0 12px;
  font-family: var(--serif);
  font-size: 12px;
  font-variant: small-caps;
  letter-spacing: 0.09em;
}

.title-block h1 {
  grid-column: 1;
  grid-row: 2;
  margin: 0;
  font-size: 37px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.05;
}

.author-role {
  grid-column: 1;
  grid-row: 3;
  margin: 13px 0 0;
  font-size: 15px;
}

.affiliation {
  grid-column: 1;
  grid-row: 4;
  margin: 2px 0 0;
  font-size: 13px;
  font-style: italic;
}

.author-contact {
  grid-column: 2;
  grid-row: 2 / span 2;
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0 7px;
  margin: 0;
  text-align: right;
  font-family: var(--mono);
  font-size: 8px;
}

.author-contact > span[aria-hidden="true"] { display: none; }

.author-links {
  grid-column: 2;
  grid-row: 4;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px 15px;
  margin-top: 9px;
  font-size: 11px;
}

.contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 5px 14px;
  margin: 0 0 34px;
  padding: 11px 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  font-size: 11px;
}

.contents > span {
  color: var(--muted);
  font-variant: small-caps;
}

.abstract {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  column-gap: 28px;
  width: 100%;
  margin: 0 0 37px;
  padding-bottom: 31px;
  border-bottom: 1px solid var(--rule);
  text-align: justify;
  hyphens: auto;
}

.abstract h2 {
  grid-column: 1;
  grid-row: 1 / span 3;
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  text-align: left;
}

.abstract-lead {
  grid-column: 2;
  margin: 0 0 8px;
  font-size: 13px;
  font-style: italic;
}

.abstract-body { grid-column: 2; }

.abstract-body p {
  display: inline;
  margin: 0;
  font-size: 12px;
}

.abstract-body p + p::before { content: " "; }

.keywords {
  grid-column: 2;
  margin: 9px 0 0;
  font-size: 11px;
}

.document-section {
  margin-top: 26px;
}

.document-section > h2,
.heading-row h2 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 600;
}

.document-section > h2 span,
.heading-row h2 span {
  display: inline-block;
  width: 29px;
  font-family: var(--math);
  font-weight: 400;
}

.heading-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 0;
}

.heading-row > a {
  font-size: 10px;
}

.section-note {
  margin: -3px 0 10px 29px;
  color: var(--muted);
  font-size: 11px;
  font-style: italic;
}

.personal-page-note {
  margin: 31px 0 -17px;
  color: #777;
  font-size: 10px;
  font-style: italic;
  text-align: right;
}

.personal-page-note a { color: #6a6a6a; }
.personal-page-note a:hover { color: var(--link); }

.interest-list {
  margin-left: 29px;
}

.interest-item {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr);
  gap: 18px;
  padding: 7px 0;
  border-top: 1px solid var(--rule-light);
}

.interest-item:last-child { border-bottom: 1px solid var(--rule-light); }

.interest-item h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}

.interest-item p {
  margin: 0;
  color: #333;
  font-size: 11px;
  text-align: justify;
}

.notice {
  margin: 13px 0 0 29px;
  padding: 8px 11px;
  border: 1px solid var(--rule);
  font-size: 11px;
}

.notice strong { font-variant: small-caps; }

.publication-list {
  counter-reset: references;
  border-top: 1px solid var(--rule);
}

.publication-item {
  counter-increment: references;
  display: grid;
  grid-template-columns: 34px 48px minmax(0, 1fr);
  padding: 8px 0;
  border-bottom: 1px solid var(--rule-light);
  font-size: 11px;
}

.publication-item::before {
  content: "[" counter(references) "]";
  font-family: var(--math);
}

.publication-year {
  color: var(--muted);
  font-size: 10px;
}

.publication-item h3 {
  display: inline;
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: inherit;
}

.publication-item h3::after { content: ". "; }

.publication-item p {
  display: inline;
  margin: 0;
  font-size: 10px;
}

.publication-item p + p::before { content: ". "; }
.publication-venue { font-style: italic; }

.publication-resources {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 13px;
  margin-top: 5px;
  font-size: 10px;
}

.academic-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1.5px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-size: 10px;
  text-align: left;
}

.academic-table th {
  padding: 5px 7px;
  font-weight: 600;
}

.academic-table th:first-child { width: 83px; }
.academic-table th:nth-child(2) { width: 190px; }

.teaching-list { border-bottom: 1.5px solid var(--ink); }

.course-item {
  display: grid;
  grid-template-columns: 83px minmax(0, 1fr);
  padding: 7px;
  border-top: 1px solid var(--rule-light);
  font-size: 10px;
}

.course-item:first-child { border-top: 0; }

.course-code {
  font-family: var(--mono);
  font-size: 8px;
}

.course-item > div:last-child {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  position: relative;
}

.course-item h3 {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
}

.course-item p {
  margin: 0;
  padding-right: 92px;
  color: #333;
  font-size: 10px;
}

.course-term {
  position: absolute;
  right: 0;
  bottom: 0;
  color: var(--muted);
  font-size: 9px;
  font-style: italic;
}

.student-table-head,
.student-item {
  display: grid;
  grid-template-columns: 170px 145px minmax(0, 1fr);
}

.student-table-head {
  padding: 5px 7px;
  border-top: 1.5px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-size: 10px;
  font-weight: 600;
}

.supervision-list { border-bottom: 1.5px solid var(--ink); }

.student-item {
  align-items: baseline;
  padding: 7px;
  border-bottom: 1px solid var(--rule-light);
  font-size: 10px;
}

.student-item:last-child { border-bottom: 0; }
.student-item > div { display: contents; }

.student-item strong {
  font-size: 11px;
  font-weight: 500;
}

.student-item span,
.student-item p {
  margin: 0;
  font-size: 10px;
}

.student-item span { font-style: italic; }

.document-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 36px;
  padding-top: 8px;
  border-top: 1px solid var(--rule);
  color: var(--muted);
  font-size: 9px;
}

.document-footer p { margin: 0; }

@media (max-width: 760px) {
  .paper {
    width: calc(100% - 32px);
    padding: 35px 0 45px;
  }

  .screen-nav { width: calc(100% - 32px); }

  .title-block {
    grid-template-columns: 1fr 250px;
    column-gap: 30px;
  }

  .interest-item { grid-template-columns: 165px minmax(0, 1fr); }

  .academic-table th:nth-child(2),
  .course-item > div:last-child { grid-template-columns: 145px minmax(0, 1fr); }

  .academic-table th:nth-child(2) { width: 145px; }

  .student-table-head,
  .student-item { grid-template-columns: 140px 115px minmax(0, 1fr); }
}

@media (max-width: 560px) {
  body { background: var(--paper); }

  .screen-nav {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
    margin-top: 10px;
  }

  .screen-nav > span { text-align: left; }

  .paper {
    width: calc(100% - 32px);
    margin: 0;
    margin-inline: auto;
    padding: 30px 0 40px;
  }

  .title-block { display: block; }
  .title-block h1 { font-size: 31px; }
  .author-contact {
    align-items: flex-start;
    flex-direction: column;
    margin-top: 14px;
    text-align: left;
  }
  .author-contact > span[aria-hidden="true"] { display: none; }
  .author-links { justify-content: flex-start; }
  .contents { justify-content: flex-start; }
  .abstract {
    display: block;
    width: 100%;
  }

  .abstract h2 { margin-bottom: 9px; }

  .interest-list,
  .notice { margin-left: 0; }

  .personal-page-note {
    margin: 28px 0 -15px;
    text-align: left;
  }
  .interest-item { grid-template-columns: 1fr; gap: 2px; }
  .publication-item { grid-template-columns: 29px 43px minmax(0, 1fr); }

  .academic-table,
  .student-table-head { display: none; }

  .teaching-list,
  .supervision-list { border-top: 1.5px solid var(--ink); }

  .course-item,
  .student-item {
    display: block;
    padding: 9px 0;
  }

  .course-item > div:last-child { display: block; }
  .course-item h3 { margin: 2px 0; }
  .course-item p { padding-right: 0; }
  .course-term { position: static; display: block; margin-top: 2px; }

  .student-item strong,
  .student-item span,
  .student-item p { display: block; }

  .document-footer { align-items: flex-start; flex-direction: column; }
}

@media print {
  @page { margin: 18mm 20mm; }

  body {
    background: #fff;
    font-size: 10.5pt;
  }

  .screen-nav,
  .skip-link,
  .contents { display: none; }

  .paper {
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }

  a { color: #000; }
  .document-section { break-inside: avoid-page; }
  .document-footer a { display: none; }
}

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

/* Faculty identity: compact portrait slot, profile links, and contact details. */
.title-block {
  grid-template-columns: minmax(0, 1fr) 132px minmax(230px, .72fr);
  align-items: start;
  column-gap: 30px;
  padding-bottom: 25px;
}

.faculty-heading { grid-column: 1; grid-row: 1; }
.faculty-heading .document-type,
.faculty-heading h1,
.faculty-heading .author-role,
.faculty-heading .affiliation {
  grid-column: auto;
  grid-row: auto;
}
.faculty-heading h1 { font-size: 35px; }
.faculty-heading .document-type { margin-bottom: 11px; }
.faculty-heading .author-role { margin-top: 12px; }
.faculty-photo-frame {
  grid-column: 2;
  grid-row: 1;
  display: grid;
  width: 132px;
  height: 158px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--rule-light);
  background: #f7f7f7;
  color: #777;
}
.faculty-photo-frame img { width: 100%; height: 100%; object-fit: cover; }
.faculty-photo-frame span { font-family: var(--serif); font-size: 32px; font-style: italic; }
.faculty-contact-panel { grid-column: 3; grid-row: 1; align-self: end; }
.faculty-contact-panel .author-contact {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  text-align: left;
  font-size: 9px;
}
.faculty-contact-panel .author-contact > span[aria-hidden="true"] { display: none; }
.faculty-contact-panel .author-links {
  justify-content: flex-start;
  margin-top: 12px;
  gap: 5px 12px;
}
.faculty-contact-panel .author-links a { white-space: nowrap; }
.screen-nav a { color: var(--link); }

@media (max-width: 760px) {
  .title-block { grid-template-columns: minmax(0, 1fr) 112px; gap: 20px; }
  .faculty-heading { grid-column: 1; grid-row: 1; }
  .faculty-photo-frame { grid-column: 2; grid-row: 1; width: 112px; height: 136px; }
  .faculty-contact-panel { grid-column: 1 / -1; grid-row: 2; }
}

@media (max-width: 560px) {
  .title-block { display: grid; grid-template-columns: minmax(0, 1fr) 82px; gap: 15px; }
  .faculty-heading h1 { font-size: 29px; }
  .faculty-photo-frame { width: 82px; height: 104px; }
  .faculty-contact-panel { grid-column: 1 / -1; }
  .faculty-contact-panel .author-links { justify-content: flex-start; }
}
.abstract-body {
  grid-column: 2;
}

/* A compact, warmer personal homepage. Course and personal subpages use their own styles. */
body { font-size: 16px; line-height: 1.46; }
a { text-underline-offset: 3px; }
a:focus-visible { outline: 2px solid var(--link); outline-offset: 3px; }
.screen-nav,
.paper { width: min(calc(100% - 40px), 1020px); }
.screen-nav {
  align-items: center;
  gap: 24px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}
.screen-nav > span { max-width: 70%; }
.paper { padding-top: 45px; }
.title-block {
  grid-template-columns: minmax(0, 1fr) 132px minmax(230px, 270px);
  gap: 24px;
  padding-bottom: 28px;
}
.faculty-heading h1 { font-size: clamp(32px, 3.8vw, 42px); letter-spacing: -.025em; line-height: 1.04; }
.faculty-heading .author-role { margin-top: 11px; font-size: 16px; }
.faculty-heading .affiliation { margin-top: 5px; color: var(--muted); font-family: var(--mono); font-size: 12px; font-style: normal; line-height: 1.4; }
.faculty-heading .affiliation a,
.faculty-heading .affiliation span { display: block; width: fit-content; max-width: 100%; overflow-wrap: anywhere; }
.faculty-heading .affiliation a { color: inherit; text-decoration: none; text-underline-offset: 3px; }
.faculty-heading .affiliation a:hover,
.faculty-heading .affiliation a:focus-visible { text-decoration: underline; }
.faculty-photo-frame { background: #e9e1d6; color: #76695d; }
.faculty-contact-panel { align-self: center; }
.faculty-contact-panel .author-contact { color: var(--muted); font-size: 12px; line-height: 1.4; }
.faculty-contact-panel .author-links { gap: 4px 13px; margin-top: 10px; font-family: var(--mono); font-size: 11px; }
.meeting-note { margin: 12px 0 0; max-width: 270px; color: var(--muted); font-family: var(--mono); font-size: 11px; line-height: 1.45; }
.contents { margin-bottom: 30px; padding: 10px 0; border-color: var(--rule-light); font-family: var(--mono); font-size: 12px; }
.contents > span { font-variant: normal; }
.abstract { grid-template-columns: 145px minmax(0, 1fr); column-gap: 25px; margin-bottom: 32px; padding-bottom: 28px; border-color: var(--rule-light); text-align: left; hyphens: none; }
.abstract h2 { font-size: 19px; }
.abstract-lead { max-width: 710px; margin: 0 0 13px; font-size: 18px; font-style: normal; line-height: 1.35; }
.abstract-body p { display: block; max-width: 690px; margin: 0 0 10px; font-size: 14px; line-height: 1.5; }
.abstract-body p + p::before { content: none; }
.lab-reference { grid-column: 2; max-width: 690px; margin: 0; color: var(--ink); font-size: 14px; line-height: 1.5; }
.student-invitation { grid-column: 2; max-width: 690px; margin: 10px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.document-section { margin-top: 26px; }
.document-section > h2,
.heading-row h2 { margin-bottom: 10px; font-size: 19px; }
.interest-list { margin-left: 0; }
.interest-item { grid-template-columns: 190px minmax(0, 1fr); gap: 20px; padding: 10px 0; }
.interest-item h3 { font-size: 14px; }
.interest-item p { color: var(--muted); font-size: 12.5px; line-height: 1.45; text-align: left; }
.teaching-list { border-top: 1px solid var(--rule-light); border-bottom: 1px solid var(--rule-light); }
.course-item { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 20px; padding: 10px 0; border-color: var(--rule-light); }
.course-item:first-child { border-top: 0; }
.course-item h3 { font-size: 14px; font-weight: 600; }
.course-item .course-summary { display: block; position: static; }
.course-item .course-summary p { padding: 0; color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.course-term { position: static; display: block; margin-top: 3px; font-family: var(--mono); font-size: 11px; }
.personal-page-note { margin: 32px 0 0; color: var(--muted); font-size: 12px; text-align: left; }
.personal-page-note a { color: var(--muted); }
.useful-section { padding-top: 4px; border-top: 1px solid var(--rule-light); }
.useful-section p { max-width: 650px; margin: 0 0 10px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.useful-section > a { font-family: var(--mono); font-size: 12px; }
.document-footer { margin-top: 27px; border-color: var(--rule-light); font-family: var(--mono); font-size: 11px; }

@media (max-width: 760px) {
  .title-block { grid-template-columns: minmax(0, 1fr) 112px; gap: 20px; }
  .faculty-contact-panel { grid-column: 1 / -1; grid-row: 2; }
  .meeting-note { max-width: 620px; }
}

@media (max-width: 560px) {
  .screen-nav,
  .paper { width: calc(100% - 32px); }
  .screen-nav > span { max-width: 100%; text-align: left; }
  .title-block { display: grid; grid-template-columns: minmax(0, 1fr) 82px; gap: 15px; }
  .faculty-heading h1 { font-size: 31px; }
  .faculty-photo-frame { width: 82px; height: 104px; }
  .faculty-contact-panel { grid-column: 1 / -1; }
  .abstract { display: block; }
  .abstract h2 { margin-bottom: 11px; }
  .abstract-body { display: block; }
  .abstract-body p { font-size: 14px; }
  .lab-reference { margin-top: 8px; }
  .interest-item,
  .course-item { display: grid; grid-template-columns: 1fr; gap: 3px; }
  .course-item { padding: 10px 0; }
}

@media print {
  body { background: #fff; }
  .paper { width: auto; }
}