html { scroll-behavior: smooth; }

::selection {
  background-color: #0891b2;
  color: white;
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

a:focus-visible,
button:focus-visible {
  outline: 2px solid #0891b2;
  outline-offset: 2px;
  border-radius: 4px;
}

img {
  image-rendering: auto;
}

.article-body > p:first-of-type::first-letter {
  font-size: 3.5em;
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 700;
  color: #0891b2;
  float: left;
  margin-right: 0.12em;
  margin-top: 0.05em;
  line-height: 0.8;
}

.article-body ul {
  list-style: none;
  padding-left: 0;
}

.article-body ul > li {
  position: relative;
  padding-left: 1.5em;
}

.article-body ul > li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 6px;
  height: 6px;
  background: #0891b2;
  border-radius: 50%;
}

.article-body table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  overflow: hidden;
  border-radius: 0.75rem;
  border: 1px solid #e5e7eb;
}

.article-body thead th {
  text-align: left;
}

.article-body tbody tr:nth-child(even) {
  background-color: #fefcf9;
}

.article-body tbody tr:hover {
  background-color: #fdf6ed;
}

@media print {
  header, footer, nav, .no-print, #reading-progress { display: none !important; }
  .prose { max-width: 100%; }
  body { background: white; }
}