@charset "utf-8";

/* Shared responsive and accessibility layer, introduced in 2026-09. */
*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body.responsive-site {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  min-height: 100vh;
  line-height: 1.5;
  color: #222;
  background-color: #fff;
}
#wrapper { width: 100%; margin: 0 auto; }
.site-header { margin: 0; padding: 0; background: #fff; }
.site-header > img, .site-header .bx-wrapper, .site-header .bxslider img {
  width: 100%;
  height: auto;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
#globalnavi { width: 100%; height: auto; margin: 0; }
#globalnavi ul {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
#globalnavi li { float: none; width: auto; margin: 0; text-indent: 0; }
#globalnavi a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  height: auto;
  padding: .65rem .35rem;
  color: #fff;
  background: #0085b3 !important;
  border-right: 1px solid rgba(255,255,255,.45);
  text-decoration: none;
}
#globalnavi a:hover, #globalnavi a:focus-visible { background: #006b90 !important; text-decoration: underline; }
#globalnavi a[aria-current="page"] { background: #435b83 !important; font-weight: 700; }
a:focus-visible { outline: 3px solid #f2b705; outline-offset: 2px; }
main#contentAll::after { display: block; clear: both; content: ""; }
img { max-width: 100%; }
table { max-width: 100%; }
.line1 { margin-top: 5px; margin-bottom: 0; font-weight: 700; }
footer { width: 100%; height: auto; min-height: 50px; }

/* Keep the 48px navigation color band and its 8px shadow aligned with the
   legacy full-width background artwork. */
@media (min-width: 761px) {
  #globalnavi a {
    height: 56px;
    min-height: 56px;
    padding: 0 .35rem 8px;
    background: linear-gradient(to bottom,
      #426370 0 1px,
      #0085b3 1px 48px,
      #26718d 48px 49px,
      #777778 49px 50px,
      #9a9b9c 50px 51px,
      #b2b2b4 51px 52px,
      #c4c5c6 52px 53px,
      #d3d4d5 53px 54px,
      #dfe0e1 54px 55px,
      #eaeaea 55px 56px) !important;
  }
  #globalnavi a:hover,
  #globalnavi a:focus-visible {
    background: linear-gradient(to bottom,
      #426370 0 1px,
      #006b90 1px 48px,
      #245f77 48px 49px,
      #777778 49px 50px,
      #9a9b9c 50px 51px,
      #b2b2b4 51px 52px,
      #c4c5c6 52px 53px,
      #d3d4d5 53px 54px,
      #dfe0e1 54px 55px,
      #eaeaea 55px 56px) !important;
  }
  #globalnavi a[aria-current="page"] {
    background: linear-gradient(to bottom,
      #53555e 0 1px,
      #435b83 1px 48px,
      #4d5165 48px 49px,
      #777777 49px 50px,
      #9b9b9b 50px 51px,
      #b3b3b3 51px 52px,
      #c5c5c5 52px 53px,
      #d4d4d4 53px 54px,
      #e0e0e0 54px 55px,
      #eaeaea 55px 56px) !important;
  }

  /* Stretch every brown index panel to the real content height. Keeping the
     footer in its own grid row makes the panel end exactly where the footer
     begins, regardless of how short or long a page becomes. */
  :is(
    .page-event,
    .page-international-conference-paper,
    .page-journal-paper,
    .page-outstanding-reviewer-certificates,
    .page-patent,
    .page-people,
    .page-publications,
    .page-research,
    .page-student-awards
  ) #contentAll {
    display: grid;
    grid-template-columns: 200px minmax(0, 760px);
    grid-template-rows: auto auto;
    height: auto;
  }
  :is(
    .page-event,
    .page-international-conference-paper,
    .page-journal-paper,
    .page-outstanding-reviewer-certificates,
    .page-patent,
    .page-people,
    .page-publications,
    .page-research,
    .page-student-awards
  ) #spaceLeft {
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
    float: none;
    width: 200px;
    height: auto !important;
  }
  :is(
    .page-event,
    .page-international-conference-paper,
    .page-journal-paper,
    .page-outstanding-reviewer-certificates,
    .page-patent,
    .page-people,
    .page-publications,
    .page-research,
    .page-student-awards
  ) #contentLeft {
    grid-column: 2;
    grid-row: 1;
    float: none;
    width: auto;
    margin: 0;
    padding: 0 71px 0 30px;
  }
  :is(
    .page-event,
    .page-international-conference-paper,
    .page-journal-paper,
    .page-outstanding-reviewer-certificates,
    .page-patent,
    .page-people,
    .page-publications,
    .page-research,
    .page-student-awards
  ) #spaceRight {
    display: none;
  }
  :is(
    .page-event,
    .page-international-conference-paper,
    .page-journal-paper,
    .page-outstanding-reviewer-certificates,
    .page-patent,
    .page-people,
    .page-publications,
    .page-research,
    .page-student-awards
  ) footer {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  /* Access uses one fixed sidebar and two stacked content sections. */
  .page-access #contentAll {
    display: grid;
    grid-template-columns: 200px minmax(0, 760px);
    grid-template-rows: auto auto auto;
    height: auto;
  }
  .page-access #spaceLeft {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: stretch;
    float: none;
    width: 200px;
    height: auto !important;
  }
  .page-access #admission,
  .page-access #location {
    grid-column: 2;
    float: none;
    width: auto;
    margin: 0;
    padding: 0 71px 0 30px;
  }
  .page-access #admission { grid-row: 1; }
  .page-access #location { grid-row: 2; }
  .page-access #spaceRight { display: none; }
  .page-access footer {
    grid-column: 1 / -1;
    grid-row: 3;
  }

  :is(
    .page-access,
    .page-event,
    .page-international-conference-paper,
    .page-journal-paper,
    .page-outstanding-reviewer-certificates,
    .page-patent,
    .page-people,
    .page-publications,
    .page-research,
    .page-student-awards
  ) #contentAll::after {
    display: none;
  }
}

.page-event .event-month-empty { color: #0085b3; }

/* Mixed-aspect event pairs use their original width ratio as grid weights.
   Both photographs therefore fill the row at one common scale, without
   stretching, squashing, or leaving an unused equal-width column. */
.page-event .event-photo-row--proportional {
  display: grid;
  grid-template-columns: minmax(0, 416fr) 11px minmax(0, 228fr);
  align-items: start;
  width: 100%;
}
.page-event .event-photo-row--proportional > td {
  width: auto !important;
  height: auto !important;
  padding: 0;
}
.page-event .event-photo-row--proportional img {
  display: block;
  width: 100%;
  height: auto;
}

/* Preserve the portrait column in the legacy People tables. The descriptive
   cell previously consumed 100% of the table and collapsed portraits to 0px. */
.page-people #contentLeft > table { table-layout: fixed; }
.page-people #contentLeft > table tr > td:first-child { width: 120px !important; }
.page-people #contentLeft > table tr > td:nth-child(2) { width: 16px !important; }
.page-people #contentLeft > table tr > td:nth-child(3) { width: auto !important; }
.page-people #contentLeft > table tr > td:first-child > img {
  display: inline-block;
  width: auto;
  max-width: 120px;
  height: auto;
}

/* Keep portrait-to-portrait spacing visually consistent. Legacy name
   paragraphs and standalone <br> elements added enough vertical space to make
   text-heavy records taller than the standard 157px portrait. Compact those
   gaps and align both columns at the top so each record starts predictably. */
.page-people #contentLeft > table tr > td:is(.u-f50427a0, .u-5e0eb2cd, .u-9d8e5feb) {
  height: auto !important;
  vertical-align: top !important;
}
.page-people #contentLeft > table tr > td:is(.u-d01e4ca6, .u-0ccc381f) {
  line-height: 1.2 !important;
  vertical-align: top !important;
}
.page-people #contentLeft > table tr > td:is(.u-d01e4ca6, .u-0ccc381f) > p {
  line-height: 1.2 !important;
}
.page-people #contentLeft > table tr > td:is(.u-d01e4ca6, .u-0ccc381f) > p:first-child {
  line-height: 18px !important;
  margin: 0 0 8px;
}
.page-people #contentLeft > table tr > td:is(.u-d01e4ca6, .u-0ccc381f) > br {
  display: none;
}
.page-people #contentLeft > table tr > td:is(.u-d01e4ca6, .u-0ccc381f) > p.sample1 + br + p.sample1 {
  margin-top: 8px;
}
.page-people #contentLeft > table tr > td.u-7fc2f2ca {
  height: 8px !important;
  line-height: 8px !important;
  padding: 0 !important;
}

@media (max-width: 760px) {
  body.responsive-site { max-width: none; background-image: none; }
  #globalnavi ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #globalnavi a { min-height: 44px; }
  main#contentAll { display: block; min-height: 0; }
  #spaceLeft, #spaceCenter, #spaceRight, #contentLeft, #contentRight,
  .content-left, [id^="contentLeft-"] {
    float: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 1rem !important;
  }
  #spaceLeft:empty, #spaceCenter:empty, #spaceRight:empty { display: none; }
  table { width: 100% !important; max-width: 100% !important; table-layout: auto; }
  td, th { width: auto !important; height: auto !important; overflow-wrap: anywhere; }
  img { height: auto !important; }
  .page-event .event-photo-row--proportional {
    grid-template-columns: 1fr;
    gap: .5rem;
  }
  .page-event .event-photo-row--proportional > td:nth-child(2) { display: none; }
  footer table { display: block; overflow-x: auto; }
}