@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


body {
   font-family: 'Inter', sans-serif;
   font-size: 16px;
}


.pinned {
    background: var(--background);
    border-width: 1px;
}

.nav-item {
   font-weight: 600;
}

.pinned-badge {
   font-weight: 600;
}

article.pinned .post-date {
  display: none;
}

.site-logo {
  width: 120px;
  height: auto;
  display: block;
}

@media (prefers-color-scheme: light) {
  :root {
    color-scheme: dark;
    --background: #20232a;
    --text: #f7f7f7;
    --link: #ee5fa7;
    --link-hover: #89f94f;
    --accent-1: #3d4149;
    --accent-2: #53565d;
    --accent-3: #d4d4d6;
    --highlight: #53565d;
  }
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --background: #20232a;
    --text: #f7f7f7;
    --link: #ee5fa7;
    --link-hover: #89f94f;
    --accent-1: #3d4149;
    --accent-2: #53565d;
    --accent-3: #d4d4d6;
    --highlight: #53565d;
  }
}

/* Override Micro.blog default image margins for galleries */
.h-entry p:has(img:nth-child(2)) img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border: 1px solid var(--accent-2);
  margin: 0 !important;       /* override main.css 3rem margin */
  height: auto !important;
}

/* Grid container for multiple images */
.h-entry p:has(img:nth-child(2)) {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 10px;
  row-gap: 10px;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0;
}

/* Single image */
.h-entry p:has(img:only-child) img {
  aspect-ratio: auto;
}