/* Global link underline animation — no hover opacity */

:root {
  color-scheme: light;
}

* {
  -webkit-user-select: none;
  user-select: none;
}

a {
  -webkit-user-select: auto;
  user-select: auto;
}

::selection {
  background: transparent;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  margin-bottom: 8px;
}

.tag {
  font-size: 12px;
  border: 1px solid #111;
  border-radius: 999px;
  padding: 3px 10px;
  color: #111;
  background: transparent;
}

.note {
  font-size: 11px;
  font-style: italic;
  color: #888;
  margin-bottom: 0;
}

.divider {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 16px 0;
}

a {
  text-decoration: none;
  color: inherit;
}

/* Animated underline for all links except cards and back arrow */
a:not(.card):not(.back):not(.site-link) {
  display: inline;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  transition: background-size 0.3s ease;
}

a:not(.card):not(.back):not(.site-link):hover {
  background-size: 100% 1px;
  opacity: 1;
  text-decoration: none;
}

/* Remove any leftover hover opacity */
a:hover {
  opacity: 1;
}

.back:hover {
  opacity: 0.6;
}