/* Round 10. All surfaces use the locked palette. */
.tag.tier-common{background:var(--card);color:var(--ink);border:1px solid var(--line)}
.tag.tier-uncommon{background:var(--tint);color:var(--ink);border:1px solid var(--line)}
.tag.tier-rare{background:var(--glow);color:var(--ink);border:1px solid var(--glow)}
.tag.tier-epic{background:var(--accent-deep);color:var(--card);border:1px solid var(--accent-deep)}
.tag.tier-legendary{background:var(--ink);color:var(--glow);border:1px solid var(--glow)}
.tag[class*="tier-"]{text-transform:none;letter-spacing:0;border-radius:8px;padding:4px 8px;line-height:1.4}
.piece-back .tag,#rankRead,#buildRank{font:700 24px/1.2 var(--font-display);margin:0;align-self:start}
.piece-back .rarity-summary,#raritySummary,#buildOdds{font:400 16px/1.5 var(--font-body);letter-spacing:0;margin:12px 0}
.trait-chances{margin:12px 0}.trait-chances>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--hairline)}
.trait-chances dt{color:var(--ink-soft);font-size:12px;text-transform:capitalize}.trait-chances dd{margin:0;text-align:right}
.trait-chances .rarest-trait dd{font-weight:700}.trait-chances dd{font-weight:400}
.piece-back p.exact-mix,.piece-back .piece-odds{font:400 12px/1.5 var(--font-body);letter-spacing:0;display:block}.piece-back .piece-odds{display:inline}
#piecePreview .piece-rank,#buildCard .piece-rank{display:none}
.piece-back{max-width:100%;min-width:0;left:0;margin:0;padding:16px}
.piece-card.is-flipped{min-height:432px}
.collection-piece .piece-back dl>div{display:block}.collection-piece .piece-back dd{text-align:left}
.collection-piece .piece-back .tag{font-size:20px}.collection-piece .piece-back{padding:12px}
.build-bench{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:32px}
.build-card{width:min(100%,360px)}.build-maths{display:flex;flex-direction:column;align-items:center}
#buildRank{order:-1}.build-controls{gap:24px}
.nav-bar{container-type:inline-size;container-name:navpill;gap:24px;overflow:visible}
.nav-wordmark{flex:none;gap:12px;font-size:24px}
.nav-wordmark .brand-ground{position:relative;display:block;flex:none;width:48px;height:48px;margin-right:6px;border-radius:14px;background:var(--glow);box-shadow:inset 0 0 0 1px var(--accent-deep);overflow:visible}
.brand-ground::after{content:"";position:absolute;inset:60% 16% 12%;border-radius:50%;background:var(--accent-deep);filter:blur(5px);opacity:.3}
.nav-wordmark .brand-ground img,.site-nav.is-tight .nav-wordmark .brand-ground img,.footer-brand .nav-wordmark .brand-ground img{position:absolute;z-index:1;left:-14%;bottom:-4%;width:142%;height:142%;max-width:none;box-shadow:none;filter:drop-shadow(0 2px 2px var(--hairline));transition:transform 220ms var(--ease-out-expo)}
.nav-wordmark:hover .brand-ground img,.nav-wordmark:focus-visible .brand-ground img{transform:translateY(-2px) rotate(4deg)}
.footer-brand .nav-wordmark .brand-ground{width:56px;height:56px}
.nav-menu{display:block;margin-left:auto;flex:none;min-height:44px;border:1px solid var(--line);border-radius:12px;padding:0 12px;background:var(--card);color:var(--ink);font:400 14px/1 var(--font-body)}
.site-nav .wallet-instrument{flex:none;max-width:none}.site-nav .nav-connect{width:160px;font:400 14px/1.2 var(--font-body)!important;padding:12px!important;min-height:44px;white-space:nowrap}
.site-nav #navCa{display:none}
.site-nav .nav-links{display:none;position:relative;inset:auto;flex:none;min-width:0;width:auto;padding:0;gap:8px;overflow:visible;box-shadow:none;background:transparent}
.site-nav .nav-links a{flex:none;min-width:0;min-height:44px;padding:8px 24px;font-size:15px}
.nav-indicator{display:none}.nav-links a[aria-current=location]{background:var(--tint)}
.nav-sheet{position:absolute;top:calc(100% + 8px);right:0;left:0;max-width:1440px;max-height:calc(100dvh - 100px);overflow-y:auto;margin:auto;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:0 8px 32px var(--hairline)}
.nav-sheet a,.nav-sheet button{display:flex;align-items:center;min-height:48px;width:100%;padding:12px;color:var(--ink);font:400 16px/1.4 var(--font-body);text-decoration:none;border:0;background:transparent;border-radius:12px}
.nav-sheet a:hover{background:var(--tint)}.nav-sheet[hidden]{display:none}
@container navpill (min-width:1160px){.site-nav .nav-links{display:flex}.nav-menu{display:none}.site-nav .nav-bar:has(#navCa:not([hidden])) .nav-links{display:none}.site-nav .nav-bar:has(#navCa:not([hidden])) .nav-menu{display:block}}
@container navpill (min-width:1360px){.site-nav .nav-bar:has(#navCa:not([hidden])) .nav-links{display:flex}.site-nav .nav-bar:has(#navCa:not([hidden])) .nav-menu{display:none}.site-nav #navCa:not([hidden]){display:flex}}
@container navpill (min-width:680px){.site-nav #navCa:not([hidden]){display:flex}}
.phone-tabs{display:none}
/* The existing bottom links remain independently scrollable on phones. */
@media(max-width:768px){.site-nav .nav-links{display:none!important}.phone-tabs{display:flex;position:fixed;z-index:60;inset:auto 16px 16px;width:auto;gap:0;padding:8px 8px calc(8px + env(safe-area-inset-bottom));overflow-x:auto;overflow-y:visible;border-radius:24px;background:var(--card);box-shadow:0 8px 32px var(--line)}.phone-tabs a{flex:none;display:flex;align-items:center;min-height:44px;padding:8px 12px;color:var(--ink);text-decoration:none;font:400 14px/1.2 var(--font-body);white-space:nowrap}.nav-bar{gap:8px}}
@media(max-width:479px){.site-nav{inset-inline:8px}.nav-bar{gap:4px}.nav-wordmark{gap:4px;font-size:18px}.nav-wordmark .brand-ground{width:40px;height:40px}.nav-menu{padding-inline:8px;font-size:12px}.site-nav .nav-connect{width:120px;white-space:normal;font-size:12px!important;padding-inline:8px!important}}
.tier-legend{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-bottom:24px;border-block:1px solid var(--hairline);padding:16px 0}
.ladder-step{min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12px}.ladder-step .piece-card{width:100%;max-width:112px}.ladder-step .piece-rank{display:none}
.collection-bar{transform:none;animation:none;display:flex;align-items:center;gap:8px;border-block:1px solid var(--hairline);padding:8px 0;min-width:0}
#collection{transform:none;will-change:auto}
.collection-filter-panel{min-width:0;flex:1}.collection-filters{display:flex;align-items:center;gap:4px;margin:0}
.rarity-segments{display:flex;gap:4px;align-items:center}.rarity-segments button,.trait-toggle{min-height:44px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);font:400 12px/1.3 var(--font-body);white-space:nowrap;cursor:pointer}
.rarity-segments button[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:1px}.filter-share{display:none}
.trait-filter{position:relative;min-width:0}.trait-toggle [data-count-for]:not(:empty){border-radius:4px;padding:2px 4px;background:var(--tint);font-weight:700}
.trait-popover{position:absolute;top:calc(100% + 8px);right:0;z-index:20;width:240px;max-width:calc(100vw - 48px);padding:8px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 32px var(--hairline)}
.trait-popover [role=option]{display:flex;width:100%;align-items:center;gap:8px;min-height:48px;padding:8px;border:0;background:transparent;color:var(--ink);text-align:left;font:400 13px/1.4 var(--font-body);cursor:pointer;border-radius:8px}
.trait-popover [role=option]:hover,.trait-popover [aria-selected=true]{background:var(--tint)}.option-chance{margin-left:auto}.option-check{width:12px}.option-check::after{content:""}.trait-popover [aria-selected=true] .option-check::after{content:"";display:block;width:8px;height:5px;border-left:1px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg)}
.trait-swatch{display:grid;place-items:center;flex:none;width:24px;height:24px;border:1px solid var(--line);border-radius:8px;background:var(--tint);font-size:10px}.swatch-character{border-radius:50%}.swatch-glass{background:var(--glow)}.swatch-frame{border-width:3px}
.clear-trait{min-height:44px;width:100%;border:0;border-top:1px solid var(--hairline);background:transparent;color:var(--ink);cursor:pointer}
.collection-tools{flex:none;flex-wrap:nowrap;gap:8px;margin:0;font-size:12px}.collection-tools select{font-size:12px;padding:8px;max-width:132px}.collection-tools .btn{font-size:12px;padding:8px;min-height:44px}.collection-tools output{white-space:nowrap}
.active-filters{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.active-filters:empty{margin:0}.active-filters button{min-height:32px;padding:4px 8px;border:1px solid var(--line);border-radius:8px;background:var(--tint);color:var(--ink);font:400 12px/1.4 var(--font-body)}
.collection-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 16px;margin-top:24px}
.collection-piece .piece-card:hover{transform:translateY(-3px);filter:drop-shadow(0 5px 5px var(--hairline))}
.collection-showing{text-align:center;font-size:13px;margin:24px auto 8px!important}#showAllPieces{display:block;margin:0 auto}#showAllPieces[hidden]{display:none}
#openFilters,.sheet-close,.sheet-apply{display:none}.sheet-backdrop{position:fixed;inset:0;z-index:69;background:color-mix(in srgb,var(--ink) 40%,transparent)}
.sheet-open{overflow:hidden}
@media(min-width:1440px){.collection-grid{grid-template-columns:repeat(8,minmax(0,1fr))}}
@media(min-width:768px) and (max-width:1199px){.collection-bar{gap:4px}.collection-filters{gap:2px}.rarity-segments{gap:2px}.rarity-segments button,.trait-toggle{font-size:12px;padding-inline:6px}.collection-tools{gap:4px;font-size:12px}.collection-tools select,.collection-tools .btn{font-size:12px;max-width:112px;padding-inline:6px}}
@media(min-width:768px) and (max-width:1023px){.collection-bar{flex-wrap:wrap}.collection-filter-panel{flex-basis:100%}.collection-tools{margin-left:auto}.collection-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){
 .build-bench{grid-template-columns:minmax(0,1fr)}.build-card{width:min(100%,320px)}
 .tier-legend{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;max-width:100%;gap:12px}.ladder-step{flex:0 0 128px;scroll-snap-align:start}
 .collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
 .collection-bar{justify-content:space-between}.collection-tools output{display:none}
 #openFilters{display:block;font-size:14px;padding:8px}.collection-tools #collectionClear{display:none}
 .collection-filter-panel{position:fixed;z-index:70;inset:auto 0 0;max-height:85dvh;overflow-y:auto;padding:16px 16px calc(16px + env(safe-area-inset-bottom));background:var(--card);border-radius:24px 24px 0 0;border:1px solid var(--line)}
 .collection-filters{display:block}.rarity-segments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}.rarity-segments button{min-height:48px;font-size:14px}.filter-share{display:inline}
 .trait-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;font-size:14px;margin-top:8px;padding:12px}.trait-popover{position:static;width:100%;max-width:100%;box-shadow:none;border:0;padding:4px 0}.trait-popover [role=option]{font-size:14px}
 .sheet-close,.sheet-apply{display:block;width:100%;min-height:48px;margin-top:8px}.sheet-close{background:transparent;border:0;color:var(--ink);font:400 14px/1.4 var(--font-body)}
}
@media(prefers-reduced-motion:reduce){.nav-wordmark .brand-ground img,.piece-card,.piece-turn{transition:none}.nav-wordmark:hover .brand-ground img,.nav-wordmark:focus-visible .brand-ground img{transform:none}.collection-piece .piece-card:hover{transform:none}}

.collection-piece .piece-front .piece-rank,.marquee-tile .piece-front .piece-rank,.rail-piece .piece-front .piece-rank,.wallet-piece .piece-front .piece-rank{display:inline-block;width:max-content;max-width:100%;white-space:nowrap}
.piece-card.is-flipped .piece-turn,.piece-card.is-flipped .piece-back{position:relative}
.collection-piece .piece-back{gap:8px}