/* all places where today's top-300 pros grew up (fd/all.html); rows reuse .al from list.css */
.lh .lede b{color:var(--court);font-weight:600}
.ax{display:grid;grid-template-columns:1fr;gap:18px;margin-top:22px}
.ax>*{min-width:0}
@media(min-width:960px){.ax{grid-template-columns:272px minmax(0,1fr);gap:44px;align-items:start}.flt{position:sticky;top:16px;max-height:calc(100dvh - 32px);overflow:auto;padding-right:4px}}

/* filters: grouped and labelled, never one chip soup */
.flt{display:flex;flex-direction:column;gap:14px}
.lbl{display:block;font:600 14px/1.3 var(--body);color:var(--court);margin:0 0 8px;padding:0}
.flt input[type=search],.flt select{width:100%;min-height:48px;font:16px var(--body);color:var(--court);background:#fff;border:1px solid var(--line);border-radius:10px;padding:0 14px;appearance:none;-webkit-appearance:none}
.flt select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230f1512' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center;padding-right:36px;cursor:pointer}
.flt input[type=search]::placeholder{color:#6f766f}
.flt input:focus-visible,.flt select:focus-visible{outline:none;border-color:var(--court);box-shadow:0 0 0 3px var(--ball)}
.fbox{border-top:var(--base) solid var(--court)}
.fbox summary{list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:48px;font:800 20px/1 var(--head);letter-spacing:-.03em;cursor:pointer}
.fbox summary::-webkit-details-marker{display:none}
.fbox summary:after{content:"";width:10px;height:10px;border-right:2px solid var(--court);border-bottom:2px solid var(--court);transform:rotate(45deg) translate(-3px,-3px);transition:transform .2s cubic-bezier(.23,1,.32,1);margin-left:12px}
.fbox[open] summary:after{transform:rotate(-135deg) translate(-2px,-2px)}
.fbox summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.on-n{margin-left:auto;font:500 14px var(--body);letter-spacing:0;background:var(--ball);border-radius:99px;padding:3px 10px}
.on-n:empty{display:none}
.groups{display:flex;flex-direction:column;gap:20px;padding:6px 0 4px}
.grp{border:0;margin:0;padding:0;min-width:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{appearance:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:99px;background:#fff;font:500 15px var(--body);color:var(--court);cursor:pointer;touch-action:manipulation;transition:transform .16s cubic-bezier(.23,1,.32,1),background-color .15s ease,border-color .15s ease}
.chip .c{font-size:13px;color:var(--mute);font-variant-numeric:tabular-nums}
.chip.on{background:var(--court);border-color:var(--court);color:#fff}
.chip.on .c{color:var(--ball)}
.chip:disabled{opacity:.45;cursor:default}
.chip:not(:disabled):active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.chip:not(.on):not(:disabled):hover{border-color:var(--court)}}
.chip:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.hint{font-size:13px;line-height:1.4;color:var(--mute);margin:8px 0 0}
.clear,.link{appearance:none;background:none;border:0;padding:0;font:500 15px var(--body);color:var(--court);text-decoration:underline;text-decoration-color:var(--ball);text-decoration-thickness:3px;text-underline-offset:3px;cursor:pointer;min-height:44px;align-self:flex-start}
.clear[hidden]{display:none}

/* rows: the .al language from list.css, plus best player and a plain link line */
.res .al{margin-top:0}
.al .bt{display:block;font-size:14px;margin-top:6px;color:var(--mute)}
.al .bt b{color:var(--court);font-weight:600}
.al .pr .mu{color:var(--mute)}
.al .go{display:inline-block;margin-top:8px;font-size:14px;font-weight:600;color:var(--blue)}
.al a:hover .go{text-decoration:underline;text-underline-offset:3px}
.al a:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.al .n{font-variant-numeric:tabular-nums}
.al .ph{text-transform:none}
.empty>span{display:block;max-width:34em}
.empty{font-size:17px;line-height:1.5;padding:22px 0;border-top:var(--base) solid var(--court);margin:0}
.next{appearance:none;display:block;width:100%;min-height:52px;margin:22px 0 0;background:var(--ball);color:var(--court);border:0;border-radius:99px;font:600 16px var(--body);cursor:pointer;transition:transform .16s cubic-bezier(.23,1,.32,1)}
.next:active{transform:scale(.98)}
.next:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media(min-width:641px){.next{width:auto;padding:0 28px}}
@media(max-width:640px){.al .side{align-items:center}.al .faces img,.al .faces span{width:30px;height:30px}}
@media(prefers-reduced-motion:reduce){.chip,.next,.fbox summary:after{transition:none}}
.next[hidden],.empty[hidden]{display:none}
.res .al a{align-items:start}
.res .al .lg,.res .al .ph{margin-top:4px}
@media(min-width:641px){.res .al .side{padding-top:6px}}
@media(max-width:959px){.fbox{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}}
