/* U3: rarity symbol filter row. Tiles are >=48px wide and tall; symbols sit on a light chip so black stays visible. */
.rf-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0 12px}
.rf-row[hidden]{display:none}
.rf-tile{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:2px;min-width:56px;min-height:56px;padding:4px 6px 3px;border:2px solid #43d7f43a;border-radius:12px;background:#071a2c;color:#e4f2fa;cursor:pointer;font:700 12px/1.1 var(--font-ui,system-ui);-webkit-touch-callout:none;user-select:none;-webkit-tap-highlight-color:transparent}
.rf-tile:hover{border-color:#43d7f4cc}
.rf-tile.on{border-color:#27e1d1;background:#0a3a46;box-shadow:0 0 12px #27e1d155}
.rf-tile:focus-visible,.rf-clear:focus-visible{outline:3px solid #f2be46;outline-offset:2px}
.rf-sym{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:26px;padding:2px 5px;border-radius:8px;background:#e8f1f6}
.rf-svg{display:block;height:22px;width:auto;max-width:78px}
.rf-n{font-size:12px;color:#9fe9df}
.rf-name .rf-sym{max-width:92px;background:#16384b}
.rf-text{display:block;max-width:84px;font-size:10px;font-weight:700;line-height:1.1;text-align:center;color:#d8eef7;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.rf-clear{min-height:48px;min-width:56px;padding:0 14px;border-radius:12px;border:2px solid #f2be4699;background:transparent;color:#ffe3a1;font:700 13px var(--font-ui,system-ui);cursor:pointer}
.rf-clear[hidden]{display:none}
.rf-hint{flex-basis:100%;min-height:1.2em;font-size:12px;color:#9fe9df}
.rf-hint:empty{display:none}
@media(max-width:649px){.rf-row{gap:6px}}