.filters{max-width:var(--maxw);margin:.5rem auto 1rem;padding:0 1rem;display:flex;gap:.5rem;flex-wrap:wrap}#filters .spacer{flex:0 0 100%;height:0;margin:0;padding:0}#filters .vdiv{flex:0 0 100%;height:2.5px;background:var(--ink);opacity:.8;margin:.25rem 0 .35rem;border-radius:var(--radius-pill)}.chip-separator{width:1px;height:18px;background:var(--ink);display:inline-block;margin:0 .35rem;opacity:.45;align-self:center}.chip{cursor:var(--cursor-pointer);user-select:none;padding:.5rem .8rem;border:3px solid var(--ink);border-radius:var(--radius-pill);background:var(--offwhite);font-weight:700;box-shadow:0 6px 0 var(--ink);transition:background-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);will-change:background-color,color,box-shadow}.chip:hover{background-color:var(--bg-analogous);box-shadow:0 8px 0 var(--ink),0 8px 18px #00000040;transform:translateY(-2px)}.chip:active{transform:translateY(4px);box-shadow:0 2px 0 var(--ink)}.chip.is-active{background:var(--accent);color:var(--offwhite)}.chip:hover[data-name=ziggy],.chip:hover[data-name=elliot]{background:var(--elliot-light)}.chip.is-active[data-name=ziggy],.chip.is-active[data-name=elliot]{background:var(--elliot);color:var(--offwhite)}.chip:hover[data-name=nsfw]{background:var(--bg-analogous);color:var(--accent)}.chip.is-active[data-name=nsfw]{background:var(--ink);color:var(--accent)}.chip.year{background:var(--offwhite);color:var(--ink);padding:.4rem .7rem}.chip.year:hover{background-color:var(--year-light)}.chip.year.is-active{background:var(--year-color);color:var(--ink)}.pager{max-width:600px;margin:.5rem auto 2.5rem;padding:0 1rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem}.pager-pages{display:flex;gap:.5rem;align-items:center;justify-content:center;flex-wrap:wrap}.page-btn{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;border:3px solid var(--ink);background:var(--offwhite);color:var(--ink);border-radius:var(--radius-pill);padding:.45rem .85rem;min-width:2.25rem;text-align:center;font-weight:800;font-family:inherit;line-height:1;cursor:var(--cursor-pointer);user-select:none;box-shadow:0 6px 0 var(--ink),0 8px 18px #00000014;transform:translateY(0);transition:transform var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast)}.page-btn[disabled]{opacity:.45;cursor:var(--cursor-unavailable);box-shadow:none;transform:none}.pager>.page-btn{padding:.45rem .75rem}.pager>.page-btn .btn-icon{display:block}html.dark-mode .pager>.page-btn .btn-icon{filter:invert(1)}.page-btn[aria-disabled=true]{opacity:.45;cursor:var(--cursor-unavailable);transform:none;box-shadow:none}.page-btn.is-active{background:var(--accent);color:var(--offwhite);border-color:var(--ink)}.page-btn.is-active:hover{background-color:var(--accent)}.pager .page-btn{text-decoration:none;color:inherit}.pager .page-btn:link,.pager .page-btn:visited,.pager .page-btn:active,.pager .page-btn:focus{text-decoration:none;color:inherit}.page-btn:hover:not([disabled]):not(.is-active){box-shadow:0 8px 0 var(--ink),0 12px 24px #0000001f;transform:translateY(-2px);background-color:var(--bg-analogous)}.page-btn:active:not([disabled]){transform:translateY(2px);box-shadow:0 2px 0 var(--ink),0 6px 14px #00000014}.page-btn:focus-visible{outline:3px dashed var(--accent);outline-offset:3px}html.dark-mode .page-btn{background:var(--dm-surface);border-color:var(--dm-border);color:var(--dm-text);box-shadow:0 6px 0 var(--dm-border),0 8px 18px #00000026}html.dark-mode .page-btn:hover:not([disabled]):not(.is-active){background:var(--dm-accent-dim);box-shadow:0 8px 0 var(--dm-border),0 12px 24px #0003}html.dark-mode .page-btn.is-active{background:var(--dm-accent);color:var(--dm-white);border-color:var(--dm-border)}html.dark-mode .chip{background:var(--dm-elevated);color:var(--dm-text);border-color:var(--dm-border);box-shadow:0 6px 0 var(--dm-border)}html.dark-mode .chip:hover{background:var(--dm-accent-dim);color:var(--dm-text)}html.dark-mode .chip.is-active{background:var(--dm-accent);color:var(--dm-white)}html.dark-mode .chip:hover[data-name=ziggy],html.dark-mode .chip:hover[data-name=elliot]{background:var(--dm-accent-dim);color:var(--dm-text)}html.dark-mode .chip.year{background:var(--dm-elevated);color:var(--dm-text)}html.dark-mode .chip.year:hover,html.dark-mode .chip.year.is-active{background:var(--dm-accent-dim);color:var(--dm-text)}html.dark-mode #filters .vdiv{background:var(--dm-elevated)}
