/* Inkcat home (S19): the Browse section's search, empty state and paging; everything else is the site's own CSS. */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.browse-search { display: flex; gap: 8px; margin: 0 0 12px; }
.browse-search input { flex: 1; min-width: 0; font: inherit; padding: 10px 14px; border: 1px solid rgba(0,0,0,.18); border-radius: 999px; background: #fff; }
.browse-search button { font: inherit; font-weight: 600; padding: 10px 16px; border: 0; border-radius: 999px; background: #120e0d; color: #fff; cursor: pointer; }
.browse .cat-strip { margin: 0 0 16px; }
.browse .cat-chips a[aria-current="page"] { background: #120e0d; color: #fff; }
.browse-empty { list-style: none; color: #6b625c; padding: 24px 0; }
.browse-more { text-align: center; margin: 20px 0 0; }
.browse-more a { display: inline-block; padding: 10px 18px; border-radius: 999px; border: 1px solid rgba(0,0,0,.18); color: inherit; text-decoration: none; font-weight: 600; }

/* The shared Inkcat header (logo mark, links, Account and Search at the right). */
.ik-head { display: flex; align-items: center; gap: 18px; }
.ik-head .brand { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.brand-mark { width: 34px; height: 34px; flex: none; display: block; }
.ik-head .brand-word { color: #120e0d; }
.ik-head .brand-word span { color: #19a866; }
.ik-head .site-nav { margin-right: auto; }
.head-actions { display: flex; align-items: center; gap: 8px; }
.head-pill { display: inline-block; padding: 7px 14px; border-radius: 999px; background: #efece7; color: #120e0d; font-weight: 700; font-size: .9rem; text-decoration: none; }
.head-pill[aria-current="page"] { background: #120e0d; color: #fff; }
.head-search { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: #efece7; color: #120e0d; }
.head-search:hover, .head-pill:hover { background: #e3dfd8; }
@media (max-width: 520px) { .ik-head { gap: 10px; } .ik-head .site-nav { display: none; } .ik-head .head-actions { margin-left: auto; } .brand-mark { width: 30px; height: 30px; } }
/* Rank numbers on Popular & trending (big outlined numerals over the bottom-left of the art). */
.card-art { position: relative; }
.rank { float: left; margin: -30px 8px 0 2px; position: relative; z-index: 2; font: 900 60px/1 system-ui, sans-serif; color: #120e0d; -webkit-text-stroke: 3px #f4f2ee; paint-order: stroke fill; letter-spacing: -.04em; }
@media (max-width: 520px) { .rank { font-size: 50px; margin-top: -24px; } }
