:root {
  --radius: 12px;
  --shadow-sm: 0 1px 8px rgba(0,0,0,.06);
  --shadow-md: 0 4px 18px rgba(0,0,0,.10);
}

main.content, .quarto-container, .page-columns {
  line-height: 1.65;
  word-wrap: break-word;
}

main.content > :where(p, ul, ol, table, blockquote) {
  max-width: 72ch;
}

p[align="center"] {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem .8rem;
  justify-content: center;
  align-items: center;
  margin-block: 1rem 1.25rem;
}

p[align="center"] img {
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  image-rendering: -webkit-optimize-contrast;
}

p[align="center"] a:hover img {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  filter: saturate(1.05);
}

main.content a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: .08em;
}

main.content hr {
  margin-block: 1.2rem;
  opacity: .5;
}


main.content table {
  border-collapse: collapse;
  margin: .5rem 0 1.25rem;
  font-size: .95rem;
}
main.content th, main.content td {
  border-bottom: 1px solid rgba(0,0,0,.08);
  padding: .5rem .75rem;
  text-align: center;
}

main.content img:not([width]) {
  max-width: 100%;
  height: auto;
}

:where(html[dir="rtl"]) main.content ul,
:where(html[dir="rtl"]) main.content ol {
  padding-inline-start: 1.25rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --shadow-sm: 0 1px 8px rgba(0,0,0,.35);
    --shadow-md: 0 4px 18px rgba(0,0,0,.45);
  }
}

@media (max-width: 520px) {
  p[align="center"] img[width="150"] { width: 120px !important; }
  p[align="center"] img[width="80"]  { width: 68px  !important; }
  p[align="center"] img[width="70"]  { width: 60px  !important; }
  p[align="center"] img[width="40"]  { width: 36px  !important; height: auto !important; }
}