/* Crate types in the vault + the Charms locker */
.crate-type-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 14px}
.crate-type-tab{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 8px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#efe7dc;font:600 12px/1 "Oswald","Arial Narrow",system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.crate-type-tab img{width:34px;height:34px;object-fit:contain}
.crate-type-tab b{min-width:22px;padding:3px 7px;border-radius:99px;background:rgba(0,0,0,.4);font-size:12px;text-align:center}
.crate-type-tab:hover{border-color:rgba(242,163,58,.6)}
.crate-type-tab.active{border-color:#f2a33a;background:rgba(242,163,58,.12);box-shadow:0 0 0 1px rgba(242,163,58,.3),0 0 18px rgba(242,163,58,.18)}
.charm-locker{margin-top:30px}
.charm-hint{margin:6px 0 14px;font-size:.85rem;color:#a99f92}
.charm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:12px}
.charm-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);color:#f2ece3;cursor:pointer;text-align:center;transition:transform .15s,border-color .15s,box-shadow .15s}
.charm-card:not(:disabled):hover{transform:translateY(-2px);border-color:rgba(242,163,58,.6)}
.charm-card.equipped{border-color:#f2a33a;box-shadow:0 0 0 1px rgba(242,163,58,.35),0 0 20px rgba(242,163,58,.18)}
.charm-card.locked{opacity:.5;cursor:default}
.charm-card.locked .charm-art{filter:grayscale(1) brightness(.7)}
.charm-card .charm-art{display:grid;place-items:center;height:52px;font-size:28px;color:#9a8f82}
.charm-card .nw-charm.big{width:46px;height:46px;font-size:inherit}
.charm-card b{font:700 13px/1.1 "Oswald","Arial Narrow",system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.charm-card small{font-size:10px;letter-spacing:.14em;color:#a99f92}
.charm-card em{font-style:normal;font:600 10px/1 "Oswald",system-ui,sans-serif;letter-spacing:.12em;color:#f2a33a}
.charm-card.rarity-uncommon small{color:#5bd98f}.charm-card.rarity-rare small{color:#5db2ff}.charm-card.rarity-legendary small{color:#ffb03a}
#name .nw-charm{width:.9em;height:.9em;margin-left:.35em}

/* Fixes: popup messages must sit above the crate button and the crate window; the crate window must scroll on shorter screens */
.toast{z-index:10060!important}
html body .crate-window{overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;scrollbar-width:thin}
.crate-type-tabs{margin:6px 0 8px}