/* ranks page: every badge in an identical fixed box (nameplates scrapped 10/21). Page-scoped. */
article[data-page="badges"] .fgal{grid-auto-rows:1fr;align-items:stretch;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
article[data-page="badges"] .fgal>li.rb{display:flex;align-items:center;gap:14px;height:100%;box-sizing:border-box;min-height:120px}
article[data-page="badges"] .fgal>li.rb>.rb-stack{flex:0 0 132px;width:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;margin:0}
article[data-page="badges"] .fgal>li.rb .rb-shield{width:72px!important;height:72px!important;max-width:none;object-fit:contain;object-position:center;margin:0;display:block}
article[data-page="badges"] .fgal>li.rb .rb-np{width:132px;height:23px;object-fit:contain;display:block;margin:0}
article[data-page="badges"] .fgal>li.rb .rb-plate,article[data-page="badges"] .fgal>li.rb .rb-banner{display:none!important}
article[data-page="badges"] .fgal>li.rb>div{flex:1 1 auto;min-width:0}
@media (max-width:600px){
article[data-page="badges"] .fgal{grid-template-columns:1fr}
article[data-page="badges"] .fgal>li.rb>.rb-stack{flex-basis:104px;width:104px}
article[data-page="badges"] .fgal>li.rb .rb-shield{width:56px!important;height:56px!important}
article[data-page="badges"] .fgal>li.rb .rb-np{width:104px;height:18px}
article[data-page="badges"] .fgal>li.rb{min-height:96px}}
/* Hotfix 10/21: nameplates scrapped; one shared card grid, badge left, text right at normal width */
html body:not(#zz) article[data-page="badges"] .fgal{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))!important;grid-auto-rows:auto!important;gap:14px!important;padding:0!important;list-style:none}
html body:not(#zz) article[data-page="badges"] .fgal>li.rb{display:flex!important;flex-direction:row!important;align-items:center!important;gap:14px!important;height:auto!important;min-height:0!important;width:auto!important;padding:14px 16px!important;text-align:left!important;writing-mode:horizontal-tb!important}
html body:not(#zz) article[data-page="badges"] .fgal>li.rb>.rb-stack{flex:0 0 72px!important;width:72px!important;height:auto!important;position:static!important;margin:0!important}
html body:not(#zz) article[data-page="badges"] .fgal>li.rb>div{flex:1 1 auto!important;min-width:0!important;width:auto!important;max-width:none!important;writing-mode:horizontal-tb!important;word-break:normal!important;overflow-wrap:break-word!important;white-space:normal!important}
html body:not(#zz) article[data-page="badges"] .fgal>li.rb>div p{width:auto!important;max-width:none!important;margin:4px 0 0!important}
html body:not(#zz) article[data-page="badges"] .rb-np,html body:not(#zz) article[data-page="badges"] .rb-plate,html body:not(#zz) article[data-page="badges"] .rb-banner{display:none!important}
html body:not(#zz) article[data-page="badges"] h1,html body:not(#zz) article[data-page="badges"] h2{overflow:visible!important;white-space:normal!important;height:auto!important;line-height:1.25!important;padding-top:4px;clip-path:none!important}
@media (max-width:600px){html body:not(#zz) article[data-page="badges"] .fgal{grid-template-columns:1fr!important}html body:not(#zz) article[data-page="badges"] .fgal>li.rb>.rb-stack{flex-basis:56px!important;width:56px!important}}

/* fix (overlord patch): base.css .rb{width:18px} (inline badge img) also hits the badge cards li.rb and squashes them to 26px; prod has this too */
.fgal>li.rb{width:auto;max-width:none;object-fit:initial}
.fgal>li.rb .rb-stack{width:132px}