:root {
  --spacer-xxs: 0.25rem;
  --spacer-xs: 0.5rem;
  --spacer-sm: 0.75rem;
  --spacer-md: 1.25rem;
  --spacer-lg: 2rem;
  --spacer-xl: 3.25rem;
  --font-small: 0.8em;
}

body {
  padding: var(--spacer-md);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

figure {
  margin: 0;
}

figcaption {
  hyphens: none;
  -webkit-hyphens: none;
  text-align: center;
  font-size: var(--font-small);
  color: var(--text-muted);
}

.disclaimer {
  color: var(--text-muted);
  font-size: var(--font-small);
}


div.footnotes {
  font-size: var(--font-small);
}

div.footnotes li p {
  margin: 0;
}

a {
  text-decoration: underline dotted;
}

hgroup p.subtitle {
  font-weight: bold;
  font-size: 1.5em;
}

article .abstract {
  font-style: italic;
}

nav ul {
  display: inline;
  padding-left: var(--spacer-md);
}

@media (max-width: 768px) {
  nav ul {
    display: block;
    padding-left: 0;
  }
}

nav li {
  display: inline;
  padding-right: var(--spacer-sm);
  white-space: nowrap;
}

nav li::before {
  content: '📁 ';
}

nav li.active {
  font-weight: bold;
}

nav li.active::before {
  content: '📂 ' !important;
}

.masonry {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: var(--spacer-lg);
}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: var(--spacer-md);
}

img.profile {
  border-radius: 100%;
}

.card {
  display: grid;
  gap: var(--spacer-md);
  align-items: center;
}

@media (min-width: 52rem) {
  .card {
    grid-template-columns: 1fr 3fr;
  }
}

@media (max-width: 52rem) {
  header h1.intro {
    text-align: center;
  }
}

@media (max-width: 768px) {
  .figure-float-right {
    width: 100%;
    display: block;
  }
}

@media (min-width: 768px) {
  .figure-float-right {
    float: right !important;
    max-width: 40%;
    margin-bottom: var(--spacer-sm);
    margin-left: var(--spacer-lg);
  }
}

article.external header a::after {
  content: '➹';
  vertical-align: super;
  font-size: .7em;
}

article footer {
  border: none;
  font-size: var(--font-small);
}

.articles article p {
  margin: 0;
}

dl dd {
  margin-top: var(--spacer-xs);
  margin-bottom: var(--spacer-sm);
}

ul.links {
  padding-left: 0;
  padding-bottom: var(--spacer-sm);
}

ul.links li {
  display: inline;
}

ul.links li::before {
  content: ' · ';
}

ul.links li:first-child::before {
  content: '';
}

/* put a comma after each author */
.pub-authors .pub-author::after {
  content: ',';
}

/* unless it is the last author */
.pub-authors .pub-author:last-child::after {
  content: '';
}

/* in which case put an 'and' before */
.pub-authors .pub-author:last-child::before {
  content: ' and ';
}

/* unless it is the only author */
.pub-authors .pub-author:only-child::before {
  content: '';
}

/* or unless there are only two authors, in which case we only use 'and' */
.pub-authors .pub-author:first-child::after {
  content: '';
}

.pub-authors .pub-author:first-child:not(:nth-last-child(2))::after {
  content: ',';
}

.pub-authors .pub-author:only-child::after {
  content: '' !important;
}

.slbCaption {
  font-size: 1em;
}

.hyphenate {
  text-align: justify;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.orcid {
  height: .7em;
  width: .7em;
  position: relative;
  top: -0.3em;
  margin-left: 0.1em;
  margin-right: 0.1em;
}

dt {
  font-weight: bold;
}

.video iframe {
  border: none;
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
}

table {
  border-collapse: collapse;
  margin-bottom: 1rem;
}

td, th {
  padding: .2em;
  border: 1px solid #aaa;
}

.CodeMirror {
  border: 1px solid #eee;
  height: auto !important;
}

#interactive {
  display: none;
}

.interactive .output {
  padding: .5em;
  border: 1.5px solid;
}

.interactive .output-empty {
  display: none;
}

.interactive .output-success {
  border-color: green;
}

.interactive .output-failure {
  border-color: red;
}

@keyframes border_pending {
  0% {
    border-color: yellow;
  }
  50% {
    border-color: orange;
  }
  100% {
    border-color: yellow;
  }
}

.interactive .output-pending {
  animation: border_pending 1s infinite;
}

.interactive .output-pending::before {
  content: "Pending ...";
}

.interactive-buttons {
  padding-top: var(--spacer-sm);
  padding-bottom: var(--spacer-sm);
}

.interactive-buttons button {
  margin-right: var(--spacer-sm);
}

.interactive .error::before {
  content: '🚫 ';
}

.interactive .success::before {
  content: '✅ ';
}

button.play::before {
  content: '▶️ ';
}

button.reset::before {
  content: '🗑️ ';
}

.output-string {
  white-space: pre-wrap;
  font-family: monospace;
  word-wrap: anywhere;
}

.output-string::before {
  content: '"';
}

.output-string::after {
  content: '"';
}

.interactive .output > table {
  margin: -.5em;
}

.interactive .output td > table {
  margin: -.2em;
}

.interactive .output td, .interactive .output th {
  vertical-align: top;
  border-left: none;
  border-top: none;
  border-bottom: 1px solid #aaa;
  border-right: 1px solid #aaa;
}

.interactive .output td:last-child, .interactive .output th:last-child {
  border-right: none;
}

.interactive .output tr:last-child > * {
  border-bottom: none;
}

details.pub-abstract {
  font-size: var(--font-small);
}

blockquote > p {
  margin: 0;
}

#map-embed {
  aspect-ratio: 16 / 9;
}

header .hero {
  margin-top: var(--spacer-md);
}

ul.profiles {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

time {
  background: inherit !important;
  color: inherit !important;
  border: none !important;
  padding: 0 !important;
}

.text-align-right {
  text-align: right;
}