.series-card strong{font: 800 1.25rem/1.15 var(--display);}
.series-card > span:not(.collage){font-size: .84rem; font-weight: 600; color: var(--mist);}
.coin-pill{display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: 999px; background: rgba(255, 161, 51, .14); border: 1px solid var(--gold-dim); color: var(--gold); font-weight: 700; font-size: .86rem;}
.page-head > .seg{margin-bottom: 14px;}
.si-rd-mark{display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; box-shadow: 0 0 0 3px var(--night-2); font: 800 1.6rem/1 var(--display); color: var(--rose-2); background: radial-gradient(circle at 30% 30%, var(--plum-2), var(--night-2));}
.si-rd-gate{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px;}
.si-rd-gate p:not(.kicker){margin-top: 8px; font-weight: 600; color: var(--mist);}
.si-rd-answer .panel > p:not(.kicker){max-width: 80ch; margin-top: 10px; color: var(--mist);}
.si-rd-answer .panel h2{margin-top: 10px;}
.field-icon{position: relative; display: block;}
.field-icon .icon{position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--dim); pointer-events: none;}
.field-icon .input{padding-left: 46px;}
.toolbar{display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 12px; border-radius: 22px; border: 1px solid var(--line); background: rgba(21, 11, 26, .72); backdrop-filter: blur(12px);}
.toolbar-search, .toolbar > .field-icon{flex: 1 1 260px;}
.toolbar .input, .toolbar .select{min-height: 46px;}
.filter-chips{display: flex; flex-wrap: wrap; gap: 6px;}
.filter-chips button, .filter-chips a{display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); background: transparent; font: 700 .8rem/1 var(--ui); color: var(--mist); text-decoration: none; cursor: pointer; transition: border-color .2s, color .2s, background .2s;}
.filter-chips button:hover, .filter-chips a:hover{border-color: var(--gold); color: var(--cream);}
.filter-chips button[aria-pressed="true"], .filter-chips a[aria-current="page"]{border-color: var(--rose); color: var(--cream); background: rgba(255, 79, 139, .18);}
.result-count{margin: 16px 2px 12px; font-size: .82rem; font-weight: 700; color: var(--dim);}
.result-count a{color: var(--gold);}
.browse-tiles{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none;}
.browse-tiles a{display: grid; gap: 4px; padding: 22px; border-radius: 22px; border: 1px solid var(--line); background: linear-gradient(160deg, rgba(50, 26, 61, .8), rgba(21, 11, 26, .8)); text-decoration: none; transition: border-color .25s, transform .3s var(--ease);}
.browse-tiles a:hover{border-color: var(--rose); transform: translateY(-3px);}
.browse-tiles .icon{width: 28px; height: 28px; margin-bottom: 10px; color: var(--rose-2);}
.browse-tiles strong{font: 800 1.2rem/1.1 var(--display);}
.browse-tiles span{font-size: .84rem; font-weight: 600; color: var(--dim);}
.zb-pagination{display: grid; justify-items: center; gap: 14px; margin: 32px auto 0;}
.zb-pagination__sr-only{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;}
.zb-pagination__meta{display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 18px;}
.zb-pagination__summary{margin: 0; font-size: .82rem; font-weight: 700; color: var(--dim);}
.zb-pagination__summary strong{color: var(--cream);}
.zb-pagination__jump, .zb-pagination__compact{display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: .82rem; font-weight: 700; color: var(--mist);}
.zb-pagination__jump input, .zb-pagination__compact input{width: 64px; min-height: 40px; padding: 0 8px; border-radius: 12px; border: 1px solid var(--line-2); background: rgba(12, 6, 16, .6); color: var(--cream); font: 700 .86rem/1 var(--ui); text-align: center;}
.zb-pagination__jump input:focus, .zb-pagination__compact input:focus{outline: none; border-color: var(--rose); box-shadow: 0 0 0 4px rgba(255, 79, 139, .22);}
.zb-pagination__jump button{min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line-2); background: rgba(247, 236, 226, .05); color: var(--cream); font: 800 .78rem/1 var(--ui); cursor: pointer;}
.zb-pagination__jump button:hover{border-color: var(--gold); color: var(--gold);}
.zb-pagination__desktop-rail{display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px;}
.zb-pagination__pages{display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none;}
.zb-pagination__link{display: inline-flex; align-items: center; justify-content: center; min-width: 42px; min-height: 42px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); font: 700 .84rem/1 var(--ui); color: var(--mist); text-decoration: none; transition: border-color .2s, color .2s, background .2s;}
a.zb-pagination__link:hover{border-color: var(--gold); color: var(--cream);}
.zb-pagination__link.is-current{border-color: var(--rose); color: var(--cream); background: rgba(255, 79, 139, .18);}
.zb-pagination__link.is-disabled{opacity: .4;}
.zb-pagination__gap{padding: 0 4px; color: var(--dim);}
.zb-pagination__label--short{display: none;}
.zb-pagination__mobile-nav{display: none;}
@media (max-width: 1180px){
.browse-tiles{grid-template-columns: repeat(2, minmax(0, 1fr));}
.zb-pagination__item.is-wide-only, .zb-pagination__desktop-rail .zb-pagination__link--step{display: none;}
}
@media (max-width: 760px){
.toolbar{padding: 10px; border-radius: 18px;}
.toolbar-search, .toolbar > .field-icon{flex: 1 1 100%;}
.filter-chips{flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%;}
.filter-chips button, .filter-chips a{flex: none;}
.browse-tiles{gap: 10px;}
.browse-tiles a{padding: 16px;}
.zb-pagination__jump, .zb-pagination__desktop-rail{display: none;}
.zb-pagination__mobile-nav{display: grid; gap: 10px; width: 100%;}
.zb-pagination__mobile-primary{display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px;}
.zb-pagination__compact{justify-content: center;}
.zb-pagination__mobile-shortcuts{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px;}
.zb-pagination__mobile-shortcuts .zb-pagination__link{min-width: 0; padding: 0 6px; font-size: .76rem;}
.zb-pagination__label--long{display: none;}
.zb-pagination__label--short{display: inline;}
}
@media (pointer: coarse){
.filter-chips button, .filter-chips a, .zb-pagination__link{min-height: 44px;}
}
/* Search-engine text, folded into one closed line (2026-10-14). */
.seo-more{margin-top: 24px; border-radius: 18px; border: 1px solid var(--line); background: linear-gradient(160deg, rgba(50, 26, 61, .5), rgba(21, 11, 26, .6)); font-size: .86rem; color: var(--mist);}
.seo-more summary{display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 8px 18px; border-radius: 18px; cursor: pointer; list-style: none; font-weight: 700; color: var(--mist);}
.seo-more summary::-webkit-details-marker{display: none;}
.seo-more summary:hover{color: var(--cream);}
.seo-more summary .icon{flex: none; width: 16px; height: 16px; color: var(--gold); transition: transform .25s var(--ease);}
.seo-more[open] summary .icon{transform: rotate(45deg);}
.seo-more-body{display: grid; gap: 10px; padding: 0 18px 16px;}
.seo-more-body > *{margin: 0; max-width: 72ch; line-height: 1.55;}
@media (prefers-reduced-motion: reduce){
.seo-more summary .icon{transition: none;}
}
/* The index shows 12 series first (8 on a phone); "Show more" opens the rest of the page (the script adds .is-clip, so without it every card shows). */
.is-clip .series-grid > li:nth-child(n+13), .is-clip .si-rd-pager{display: none;}
.si-rd-more{display: flex; justify-content: center; margin: 18px 0 4px;}
.si-rd-more[hidden]{display: none;}
.si-rd-more .btn{min-height: 48px; padding: 0 26px;}
.si-rd-answer .seo-more{margin-top: 0;}
/* Phone (2026-10-18): a one-line head like Gallery's and a search with no box round it, so it starts at the same height. */
@media (max-width: 760px){
.si-rd-head{padding-top: 16px; padding-bottom: 0;}
.si-rd-head .kicker{display: none;}
.si-rd-head h1{margin-top: 0; font-size: 1.75rem; line-height: 1.05; letter-spacing: -.03em;}
.si-rd-head .lede{position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;}
.si-rd-head + .section-tight{padding-top: 8px;}
[data-page-marker="zbaiart-public-series-index"] .toolbar{padding: 0; border: 0; border-radius: 0; background: none; backdrop-filter: none;}
.is-clip .series-grid > li:nth-child(n+9){display: none;}
}
