:root {
  --global-theme-color: #2879a5;
  --global-hover-color: #185b82;
  --global-bg-color: #ffffff;
  --global-text-color: #252525;
  --global-card-bg-color: #ffffff;
  --global-footer-bg-color: #edf6fc;
  --global-footer-text-color: #40586b;
  --global-footer-link-color: #2879a5;
  --global-divider-color: #d7e7f1;
  --site-accent-color: #96cceb;
  --site-heading-color: #263e50;
  --site-text-font: "Noto Sans", "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --site-heading-font: "Barlow", var(--site-text-font);
  --site-ui-font: var(--site-text-font);
}

html[data-theme="dark"] {
  --global-theme-color: #96cceb;
  --global-hover-color: #c8e6f8;
  --global-bg-color: #181818;
  --global-text-color: #ededed;
  --global-card-bg-color: #242424;
  --global-footer-bg-color: #202020;
  --global-footer-text-color: #d4d4d4;
  --global-footer-link-color: #96cceb;
  --global-divider-color: #3a4248;
  --site-heading-color: #c8e6f8;
}

body {
  background: var(--global-bg-color);
  color: var(--global-text-color);
  font-family: var(--site-text-font);
  font-weight: 400;
  line-height: 1.618;
}

body::before {
  background: var(--site-accent-color);
  content: "";
  height: 5px;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1050;
}

.navbar,
button,
input,
select,
textarea,
.btn,
.badge,
.profile-contact,
.publications .author,
.publications .periodical,
footer,
ninja-keys {
  font-family: var(--site-ui-font);
}

a,
a:visited,
.navbar .navbar-brand,
.navbar-nav .nav-link.active {
  color: var(--global-theme-color);
}

a:hover,
.navbar .navbar-brand:hover,
.navbar-nav .nav-link:hover,
.post-title a:hover {
  color: var(--global-hover-color);
}

.navbar,
nav.navbar {
  background-color: var(--global-bg-color);
  border-bottom: 1px solid var(--global-divider-color);
  box-shadow: none;
}

h1,
h2,
h3,
.publications .title {
  color: var(--site-heading-color);
  font-family: var(--site-heading-font);
  line-height: 1.2;
}

.profile,
.profile img,
img.profile {
  border: 0 !important;
  box-shadow: none !important;
}

.profile {
  max-width: 220px !important;
}

.profile img,
img.profile {
  display: block !important;
  height: auto !important;
  width: 100% !important;
}

.profile-contact {
  border-left: 3px solid var(--site-accent-color);
  color: var(--global-text-color);
  display: grid;
  gap: 0.2rem;
  line-height: 1.45;
  margin: 0.9rem 0 1.15rem;
  padding-left: 0.85rem;
}

.profile-contact a {
  width: fit-content;
}

/* One reversible progress value draws both paths from the number's top-left. */
@property --publication-frame-progress {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

.publications h2.bibliography {
  color: var(--site-heading-color);
  font-size: 1.25rem;
  padding: 1rem 0.9rem 0;
  text-align: left;
}

.publications ol.bibliography {
  list-style: none;
  margin-left: 0;
  padding: 0;
}

.publications ol.bibliography > li {
  --publication-frame-progress: 0;
  border-radius: 0.25rem;
  list-style: none;
  padding: 0.9rem;
  position: relative;
  transition:
    --publication-frame-progress 0.5s ease-in-out,
    transform 0.5s ease-in-out,
    box-shadow 0.5s ease-in-out,
    background-color 0.5s ease-in-out;
}

.publications ol.bibliography > li::before {
  /* Top + left draw first; right + bottom complete the frame. */
  background-image:
    linear-gradient(var(--global-theme-color), var(--global-theme-color)), linear-gradient(var(--global-theme-color), var(--global-theme-color)),
    linear-gradient(var(--global-theme-color), var(--global-theme-color)), linear-gradient(var(--global-theme-color), var(--global-theme-color));
  background-position:
    top left,
    top right,
    top left,
    bottom left;
  background-repeat: no-repeat;
  background-size:
    clamp(0%, calc(var(--publication-frame-progress) * 200%), 100%) 1px,
    1px clamp(0%, calc((var(--publication-frame-progress) - 0.5) * 200%), 100%),
    1px clamp(0%, calc(var(--publication-frame-progress) * 200%), 100%),
    clamp(0%, calc((var(--publication-frame-progress) - 0.5) * 200%), 100%) 1px;
  content: "";
  inset: 0.4rem;
  pointer-events: none;
  position: absolute;
}

.publications ol.bibliography > li:focus-within {
  --publication-frame-progress: 1;
  background-color: var(--global-card-bg-color);
  box-shadow: 0 8px 22px rgb(0 0 0 / 12%);
  transform: translateY(-3px);
}

@media (hover: hover) and (pointer: fine) {
  .publications ol.bibliography > li:hover {
    --publication-frame-progress: 1;
    background-color: var(--global-card-bg-color);
    box-shadow: 0 8px 22px rgb(0 0 0 / 12%);
    transform: translateY(-3px);
  }
}

.publications ol.bibliography > li > .row {
  align-items: start;
  column-gap: 1.25rem;
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) auto;
  margin: 0;
}

.publications .abbr {
  display: flex;
  justify-content: flex-start;
}

/* The bibliography hook supplies the DOI link beside the entry text. */
.publications .row > div:has(> .publication-doi) {
  min-width: 0;
  padding-right: 3.25rem !important;
  position: relative;
}

.publications .publication-doi {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  line-height: 1;
  min-height: 2.75rem;
  min-width: 2.75rem;
  position: absolute;
  right: 0;
  text-decoration: none;
  top: -0.5rem;
}

.publications ol.bibliography .publication-doi {
  color: var(--site-heading-color);
}

/* Nature-inspired open arrow: consistent strokes, independent of font glyphs. */
.publications .publication-doi span {
  display: block;
  font-size: 0;
  height: 1.25rem;
  position: relative;
  width: 1.375rem;
}

.publications .publication-doi span::before,
.publications .publication-doi span::after {
  content: "";
  position: absolute;
  top: 50%;
}

.publications .publication-doi span::before {
  background: currentColor;
  border-radius: 1px;
  height: 1.5px;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
}

.publications .publication-doi span::after {
  border-right: 1.5px solid currentColor;
  border-top: 1.5px solid currentColor;
  height: 0.5625rem;
  right: 0;
  transform: translateY(-50%) rotate(45deg);
  transform-origin: center;
  width: 0.5625rem;
}

.publications ol.bibliography .publication-doi:hover {
  color: var(--global-hover-color);
  text-decoration: none;
}

.publications .publication-doi:focus-visible {
  border-radius: 0.2rem;
  outline: 2px solid var(--global-theme-color);
  outline-offset: 2px;
}

/* Hide the theme's original DOI button and omit a DOI-only button row. */

.publications .links:not(:has(a:not([href^="https://doi.org/"]))) {
  display: none;
}

.publications ol.bibliography > li .abbr abbr.badge {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--site-heading-color) !important;
  display: inline-flex !important;
  font-size: 0.84rem !important;
  font-weight: 600;
  height: 1.38rem !important;
  justify-content: center !important;
  letter-spacing: 0;
  line-height: 1 !important;
  margin: 0 !important;
  max-width: 2.05rem !important;
  min-width: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  vertical-align: top !important;
  width: 2.05rem !important;
}

.publications ol.bibliography > li > .row > .abbr {
  flex: none;
  grid-column: 1;
  margin: 0.15rem 0 0;
  max-width: 2.25rem;
  padding: 0;
  position: static;
  width: 2.25rem;
}

.publications ol.bibliography > li > .row > .col-sm-8 {
  flex: none;
  grid-column: 2;
  max-width: none;
  min-width: 0;
  padding-left: 0;
  padding-right: 0;
  width: auto;
}

.publications ol.bibliography > li > .row > .col-sm-2:not(.abbr) {
  flex: none;
  grid-column: 3;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  width: auto;
}

@media (max-width: 575.98px) {
  .profile {
    float: none !important;
    margin: 0 auto 1.25rem !important;
    max-width: min(58vw, 200px) !important;
  }

  .publications ol.bibliography > li > .row {
    column-gap: 0.6rem;
  }

  .publications .row > div:has(> .publication-doi) {
    padding-right: 2.75rem !important;
  }

  .publications .publication-doi {
    right: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .publications ol.bibliography > li {
    transition: none;
  }

  .publications ol.bibliography > li:hover,
  .publications ol.bibliography > li:focus-within {
    transform: none;
  }
}

.badge,
.btn,
button,
input[type="submit"],
.publications .btn,
.publications button {
  border-color: var(--global-theme-color);
}

.btn:hover,
button:hover,
input[type="submit"]:hover,
.publications .btn:hover,
.publications button:hover {
  border-color: var(--global-hover-color);
}

footer,
footer.fixed-bottom {
  background-color: var(--global-footer-bg-color);
  color: var(--global-footer-text-color);
}

footer a,
footer a:visited {
  color: var(--global-footer-link-color);
}

footer a:hover {
  color: var(--global-hover-color);
}