/* Additions on top of the original main.css (kept untouched). */

/* Rendered Markdown in blog posts */
.blog-post-content h2, .blog-post-content h3, .blog-post-content h4 {
  font-family: 'Bebas Neue', sans-serif; letter-spacing: .02em; line-height: 1.1; margin: 2rem 0 .75rem; color: var(--text, #eeeae4);
}
.blog-post-content h2 { font-size: 34px; }
.blog-post-content h3 { font-size: 26px; }
.blog-post-content p, .blog-post-content ul, .blog-post-content ol,
.blog-post-content pre, .blog-post-content blockquote, .blog-post-content table { margin-bottom: 1.1rem; }
.blog-post-content ul, .blog-post-content ol { padding-left: 1.4rem; }
.blog-post-content a { color: var(--acc); text-decoration: underline; text-underline-offset: 2px; }
.blog-post-content img { max-width: 100%; height: auto; border-radius: var(--r); border: 1px solid var(--border); }
.blog-post-content iframe { width: 100%; aspect-ratio: 16/9; height: auto; border: 0; border-radius: var(--r); }
.blog-post-content blockquote { border-left: 3px solid var(--acc); padding: .25rem 0 .25rem 1rem; color: var(--muted); }
.blog-post-content code { font-size: 13px; background: var(--s2); padding: .1em .35em; border-radius: 4px; }
.blog-post-content pre { background: var(--s1); border: 1px solid var(--border); border-radius: var(--r); padding: 1rem; overflow-x: auto; }
.blog-post-content pre code { background: none; padding: 0; }
.blog-post-content table { width: 100%; border-collapse: collapse; font-size: 14px; }
.blog-post-content th, .blog-post-content td { border: 1px solid var(--border); padding: .45rem .6rem; text-align: left; }

.draft-note {
  margin-bottom: 1.5rem; padding: .6rem 1rem; border: 1px dashed var(--acc2); color: var(--acc2);
  border-radius: var(--r); font-size: 13px;
}
.post-feat-img { width: 100%; aspect-ratio: 16/7; object-fit: cover; border-radius: var(--r); margin-bottom: 1rem; }

/* ---- Live status ---- */
.nav-live { display:inline-block; margin-left:.4rem; padding:1px 6px; border-radius:4px; background:var(--acc); color:#fff;
  font-size:10px; font-weight:700; letter-spacing:.06em; line-height:1.5; vertical-align:1px; animation:nb-live-pulse 1.6s ease-in-out infinite; }
.nav-live[hidden] { display:none; }
@keyframes nb-live-pulse { 50% { opacity:.55; } }
@media (prefers-reduced-motion: reduce) { .nav-live { animation:none; } }
a.live-pill.is-live { text-decoration:none; color:inherit; }
a.live-pill.is-live:hover { filter:brightness(1.15); }
.live-pill.is-offline .live-dot { background:var(--muted); box-shadow:none; animation:none; }
.embed-title { font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.embed-meta { color:var(--muted); font-weight:400; white-space:nowrap; }
.embed-meta a { color:var(--acc); }

/* ---- Donate ---- */
.pl-donate .pl-big-name { font-size:19px; line-height:1.1; }
.pl-donate { border-color:rgba(245,200,66,.3) !important; background:rgba(245,200,66,.05) !important; }
.i-donate { background:rgba(245,200,66,.15); color:var(--acc2); }
.btn-donate i { color:var(--acc2); }

/* ---- About: photo avatars ---- */
.profile-av.has-photo, .dog-avatar.has-photo { padding:0; overflow:hidden; }
.profile-av.has-photo img, .dog-avatar.has-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.dog-nick { color:var(--muted); font-weight:400; }
.about-intro p + p { margin-top:.8rem; }

/* ---- About grids: follow the number of profiles/dogs; make the theme's mobile rules actually apply
   (main.css sets the desktop columns with !important, which silently beat its own media queries) ---- */
.about-cols.cols-1, .dogs-strip.cols-1 { grid-template-columns:1fr !important; }
.dogs-strip.cols-2 { grid-template-columns:repeat(2,1fr) !important; }
@media (max-width:1040px) {
  .about-cols { grid-template-columns:1fr !important; }
  .about-col-g, .about-col-l { border-left:0; border-right:0; }
  .dogs-strip { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:600px) { .dogs-strip { grid-template-columns:1fr !important; } }