/* /coins/ coin finder (3 Nov 2026): a search line, a row of small filter menus and sort, the count, and the tile grid
   48 at a time. Built by scripts/coins_page.py, driven by site_src/finder.js. Uses the v2 tokens (site_src/v2.css).
   Mobile first: the filter menus scroll sideways in one row on phones. */
.page.v2.coinsx .pagewrap{max-width:1560px;padding-top:calc(var(--bar-h) + 16px)}
.fx-top{display:flex;align-items:flex-end;gap:12px 32px;flex-wrap:wrap;margin:0 0 14px}
.page.v2 .fx-h{font:400 30px/1.1 var(--serif);margin:0;letter-spacing:.005em}
.fx-q{position:relative;flex:1 1 320px;max-width:560px;margin-left:auto}
.fx-q svg{position:absolute;left:2px;top:11px;width:18px;height:18px;fill:none;stroke:var(--v2grey);stroke-width:1.6;stroke-linecap:round}
.fx-q input{width:100%;box-sizing:border-box;height:42px;border:0;border-bottom:1px solid var(--v2line);border-radius:0;background:transparent;
  font:17px var(--serif);color:var(--v2ink);padding:0 4px 0 28px;-webkit-appearance:none;appearance:none}
.fx-q input:focus{border-bottom-color:var(--v2ink);outline:none}
.fx-q input:focus-visible{outline:2px solid var(--v2ink);outline-offset:2px}
.fx-bar{display:flex;align-items:center;gap:10px 18px;padding:0 0 12px;border-bottom:1px solid var(--v2line)}
.fx-fs{display:flex;align-items:center;gap:8px;flex:1;min-width:0;flex-wrap:wrap}
.fx-f{position:relative;display:inline-flex}
.fx-f select,.fx-sort select{-webkit-appearance:none;appearance:none;cursor:pointer;background:transparent;color:var(--v2ink);border:1px solid var(--v2line);border-radius:0;
  font:500 10.5px/1 var(--caps);letter-spacing:.16em;text-transform:uppercase;height:34px;padding:0 26px 0 12px;max-width:220px;text-overflow:ellipsis}
.fx-f::after,.fx-sort::after{content:"";position:absolute;right:11px;top:13px;width:5px;height:5px;border-right:1.3px solid currentColor;border-bottom:1.3px solid currentColor;transform:rotate(45deg);pointer-events:none}
.fx-f select:hover,.fx-sort select:hover{border-color:var(--v2ink)}
.fx-f.on select{border-color:var(--v2ink);background:#fff}
.fx-f select:focus-visible,.fx-sort select:focus-visible,.fx-clear:focus-visible,.fx-mb:focus-visible,.fx-link:focus-visible{outline:2px solid var(--v2ink);outline-offset:2px}
.fx-f select option,.fx-sort select option{font:15px var(--serif);letter-spacing:0;text-transform:none}
.fx-clear,.fx-link{all:unset;cursor:pointer;font:500 10.5px/1.6 var(--caps);letter-spacing:.18em;text-transform:uppercase;color:var(--v2ink);border-bottom:1px solid var(--v2ink)}
.fx-clear[hidden]{display:none}
.fx-sort{position:relative;display:inline-flex;align-items:center;gap:8px;flex:none}
.fx-sort span{font:500 10.5px/1 var(--caps);letter-spacing:.18em;text-transform:uppercase;color:var(--v2grey)}
.fx-sort select{border-color:transparent;padding-left:4px}
.fx-count{font:15px/1.4 var(--serif);color:var(--v2grey);margin:12px 0 4px}
.fx-count b{font-weight:500;color:var(--v2ink)}
.tiles.fx-grid{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:30px 22px;margin:14px 0 24px}
.fx-grid .tile .who{font-size:9.5px;letter-spacing:.18em}
.fx-grid .tile .nm{font-size:17px;line-height:1.2}
.fx-grid .tile .meta{font-size:13.5px;line-height:1.35}
.fx-grid[hidden]{display:none}
.fx-more{display:flex;flex-direction:column;align-items:center;gap:8px;margin:10px 0 30px}
.fx-more[hidden]{display:none}
.fx-mb{all:unset;box-sizing:border-box;cursor:pointer;padding:14px 26px;border:1px solid var(--v2ink);font:500 10.5px/1 var(--caps);letter-spacing:.2em;text-transform:uppercase}
.fx-mb:hover{background:#fff}
.fx-mb[aria-busy="true"]{opacity:.5}
.fx-shown{font:14px/1.4 var(--serif);color:var(--v2grey);margin:0}
.fx-empty{font:18px/1.5 var(--serif);color:var(--v2grey);padding:40px 0}
.fx[aria-busy="true"] .fx-grid{opacity:.55;transition:opacity .2s .15s}
@media (max-width:820px){
  .page.v2.coinsx .pagewrap{padding:calc(var(--bar-h) + 8px) 16px 40px}
  .page.v2 .fx-h{font-size:25px}
  .fx-top{gap:10px}
  .fx-q{flex-basis:100%;max-width:none;margin:0}
  .fx-q input{height:46px;font-size:17px}
  .fx-bar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px 12px;gap:8px}
  .fx-bar::-webkit-scrollbar{display:none}
  .fx-fs{flex-wrap:nowrap;flex:none}
  .fx-f select,.fx-sort select{height:34px;max-width:160px;padding:0 24px 0 10px;letter-spacing:.12em}
  .fx-sort span{display:none}
  .fx-sort select{border-color:var(--v2line)}
  .tiles.fx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
  .fx-grid .tile .nm{font-size:15.5px}
  .fx-mb{width:100%;text-align:center;min-height:48px}
}
