/* Player ribbon collection and nameplate */
.user-ribbon-name{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;max-width:100%;min-height:1.45em;padding:.08em .62em;white-space:nowrap;vertical-align:middle;color:#f5ffe9;text-shadow:0 2px 3px #000,0 0 8px #030905}
.user-ribbon-art{position:absolute;z-index:0;top:-.34em;left:-.34em;display:block;width:calc(100% + .68em);height:calc(100% + .68em);object-fit:fill;filter:drop-shadow(0 2px 5px #03080baa);pointer-events:none}
.user-ribbon-label{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center}
.user-ribbon-name.has-ribbon .user-ribbon-label{font-size:.76em}
.user-ribbon-name.has-ribbon .user-ribbon-label .verified-badge,.user-ribbon-name.has-ribbon .user-ribbon-label .vip-badge{width:.9em;height:.9em;margin-left:.16em}
.home-ribbon-name{padding:.05em .45em}
.profile-ribbon-name{padding:.12em .45em}
.inventory-ribbon-name{font-size:clamp(18px,2.3vw,26px);padding:.1em .65em}
.inventory-ribbon-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 17px;padding:12px 16px;border:1px solid #315144;border-radius:9px;background:linear-gradient(110deg,#10231d,#10202a 72%)}
.inventory-ribbon-banner>div{display:grid;justify-items:start;gap:3px;min-width:0}
.inventory-ribbon-banner>div>small{color:#a8d98c;font-size:8px;font-weight:900;letter-spacing:.1em}
.inventory-ribbon-banner>button{flex:none;font-size:9px}
.ribbon-collection{display:grid;gap:14px}
.ribbon-collection-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 2px 12px;border-bottom:1px solid #243a43}
.ribbon-collection-head h2{margin:3px 0;color:#e9f7f1;font:900 27px 'Barlow Condensed';letter-spacing:.04em}
.ribbon-collection-head p{margin:4px 0 0;color:#9eb3ba;font-size:10px;line-height:1.5}
.ribbon-count{flex:none;padding:7px 9px;border:1px solid #315549;border-radius:999px;background:#122a24;color:#a8f1c9;font-size:8px;font-weight:900;letter-spacing:.06em}
.ribbon-showcase{display:grid;justify-items:center;gap:6px;min-height:126px;padding:15px;border:1px solid #385848;border-radius:9px;background:radial-gradient(ellipse at 50% 20%,#244434,#0b151b 72%);overflow:hidden}
.ribbon-showcase>small,.ribbon-showcase>span:last-child{color:#9bb8a4;font-size:8px;font-weight:900;letter-spacing:.1em;text-align:center}
.ribbon-preview-name{position:relative;width:100%;height:96px;min-height:96px;padding:0 26px;font-size:clamp(19px,3vw,31px)}
.ribbon-preview-name .user-ribbon-label{font-size:clamp(13px,1.7vw,20px)}
.ribbon-preview-name .user-ribbon-art{top:0;left:0;width:100%;height:100%;object-fit:contain;opacity:.98}
.ranking-ribbon-name{padding:.04em .35em;font-size:inherit}
.ribbon-section-title{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#c3d6d1}
.ribbon-section-title b{font:800 13px 'Barlow Condensed';letter-spacing:.08em}
.ribbon-section-title small{color:#8ba3a7;font-size:8px;font-weight:800}
.ribbon-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:11px}
.ribbon-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px;border:1px solid #293f49;border-radius:9px;background:linear-gradient(145deg,#12232d,#0b151c)}
.ribbon-card.equipped{border-color:#75cf76;box-shadow:inset 0 0 0 1px #75cf7625,0 0 16px #6af17b16}
.ribbon-card-preview{grid-column:1/-1;display:grid;place-items:center;min-height:98px;overflow:hidden;border:1px solid #263e36;border-radius:6px;background:radial-gradient(ellipse,#172b1c,#08110d 75%)}
.ribbon-card-preview img{display:block;width:100%;height:96px;object-fit:contain;filter:drop-shadow(0 0 9px #6aff6b44)}
.ribbon-card-copy{min-width:0}
.ribbon-card-copy>span{color:#b7e886;font-size:7px;font-weight:1000;letter-spacing:.1em}
.ribbon-card-copy h3{margin:3px 0;color:#eff9e9;font:800 16px 'Barlow Condensed'}
.ribbon-card-copy p{margin:0;color:#9aafb0;font-size:9px;line-height:1.45}
.ribbon-card-copy small{display:block;margin-top:6px;color:#8ef0ae;font-size:7px;font-weight:900;letter-spacing:.08em}
.ribbon-card.locked .ribbon-card-copy small{color:#a2aeb0}
.ribbon-card>button{font-size:8px;white-space:nowrap}
.ribbon-card>button:disabled{opacity:.8;cursor:default}
.ribbon-future-note{padding:10px;border:1px dashed #31464c;border-radius:7px;color:#91a5a8;font-size:9px;text-align:center}
.ribbon-remove{justify-self:center;font-size:8px}
@media(max-width:520px){.inventory-ribbon-banner{align-items:flex-start;flex-direction:column;padding:10px}.inventory-ribbon-banner>button{width:100%}.ribbon-collection-head{align-items:flex-start;flex-direction:column}.ribbon-count{align-self:flex-start}.ribbon-card{grid-template-columns:minmax(0,1fr)}.ribbon-card-preview{grid-column:1}.ribbon-card>button{width:100%}}