/* Approved metallic X tier cards and glossy numbered My Cards shortcuts. */
#app .slx-tier-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#app .slx-tier-strip>.slx-tier-count.total{grid-column:1/-1}
#app .slx-tier-strip>.slx-tier-count:not(.total){
 --metal-bevel:4px;--metal-glow:.44;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:222px;padding:35px 18px 19px;text-align:center;border-radius:16px!important;
 --metal-face:repeating-linear-gradient(0deg,#fff1 0px,#fff1 .5px,#0002 .5px,#0002 1px,transparent 1px,transparent 3px),linear-gradient(180deg,#ffffff18,transparent 20%,#0004 75%,#0008),linear-gradient(110deg,hsl(var(--metal-h) var(--metal-s) 12%),hsl(var(--metal-h) var(--metal-s) 30%) 19%,hsl(var(--metal-h) var(--metal-s) 13%) 35%,hsl(var(--metal-h) var(--metal-s) 42%) 60%,hsl(var(--metal-h) var(--metal-s) 16%) 79%,hsl(var(--metal-h) var(--metal-s) 8%));
 background:var(--metal-face)!important;--metal-shadow:inset 0 1px 2px #fffd,inset 0 -2px 4px #000e,0 3px 4px #0009,0 0 14px hsl(var(--metal-h) var(--metal-s) 50% / .4);box-shadow:var(--metal-shadow)!important;
}
#app .slx-tier-strip>.slx-tier-count.pending{--metal-h:210;--metal-s:8%}
#app .slx-tier-strip>.slx-tier-count:not(.total)>:is(.tier-engraving,.slx-count-label){position:absolute;top:16px;left:18px;margin:0;width:auto;font:800 13px/1.2 'Segoe UI',Arial,sans-serif;letter-spacing:.65px;text-transform:uppercase;color:hsl(var(--metal-h) 85% 78%)!important;text-shadow:0 1px 1px #000e,0 -1px 0 #ffffff35;text-align:left;pointer-events:none}
#app .slx-tier-strip>.slx-tier-count.pending>:is(.tier-engraving,.slx-count-label){color:#e0e4e7!important}
#app .slx-tier-x{display:grid;place-items:center;position:relative;flex:none;width:94px;height:94px;margin:4px auto 5px;border-radius:50%;border:3px solid hsl(var(--metal-h) 70% 72%);background:linear-gradient(145deg,#ffffff18,#0003);color:hsl(var(--metal-h) 85% 76%);box-shadow:inset 0 1px 2px #ffffffe0,inset 0 -2px 3px #000d,0 2px 4px #000c,0 0 9px #0005}
#app .slx-tier-x::before{content:"";position:absolute;inset:4px;border:1px solid hsl(var(--metal-h) 65% 66%);border-radius:50%;box-shadow:inset 0 1px 2px #0009,0 1px 1px #fff9}
#app .slx-tier-x>span{display:block;font:900 62px/.95 Arial,sans-serif;font-style:italic;padding-right:4px;color:inherit;text-shadow:0 1px 0 #fff9,0 3px 2px #000e,0 5px 5px #0008}
#app .pending .slx-tier-x{color:#e0e5e8;border-color:#d1d7db}#app .pending .slx-tier-x::before{border-color:#bac3c9}
#app .slx-tier-strip>.slx-tier-count:not(.total)>:is(b,.slx-count-num){margin:0;font-size:44px;font-weight:800;line-height:1.05;color:#fff;text-shadow:0 2px 3px #000b}
#app .slx-tier-strip>.slx-tier-count:not(.total)>small{margin:0;font-size:16px;font-weight:700;line-height:1.4;letter-spacing:.2px;color:#fff;text-shadow:0 2px 2px #000b}
#app .slx-my-cards{padding:20px 24px;margin:0 0 20px;border:1px solid #7f919e;border-radius:16px;background:var(--silver-panel);box-shadow:inset 0 1px 2px #fff9,0 1px 2px #0003;color:#17222e}
#app .slx-my-cards-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
#app .slx-my-cards-heading h2{margin:0;font:750 28px/1.2 'Segoe UI',Arial,sans-serif;color:#17222e;text-shadow:0 1px #fff8}
#app .slx-my-cards-heading .btn{min-height:44px;padding:12px 20px;font-size:18px;background:var(--silver-grain),linear-gradient(100deg,#99815b,#f3e8c8 18%,#c6ae7e 42%,#9c8250 63%,#eadbb5 85%,#b69b64)!important;border:2px solid #f3e8cf!important;border-radius:12px;box-shadow:inset 0 1px 2px #fffd,inset 0 -2px 3px #0008,0 3px 5px #0005!important;color:#252315!important;text-shadow:0 1px #ffffff60}
#app .slx-my-cards-tiers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
#app .slx-my-cards-tiers>button{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;min-height:44px;padding:8px 2px;margin:0;border:2px solid transparent;border-radius:10px;background:transparent!important;box-shadow:none!important;color:#17222e!important;font:400 18px/1.3 'Segoe UI',Arial,sans-serif;text-shadow:0 1px #fff7;cursor:pointer}
#app .slx-my-cards-tiers>button:hover{background:#ffffff25!important;border-color:#697f91}#app .slx-my-cards-tiers>button:focus-visible{outline:3px solid #165a89;outline-offset:2px}
#app .slx-shortcut-ball{display:block;width:100%;max-width:112px;aspect-ratio:1;background-image:url('/collector-home-tier-balls-v1.webp');background-size:500% 100%;background-repeat:no-repeat}
@media(max-width:600px){#app .slx-tier-strip{gap:12px}#app .slx-tier-strip>.slx-tier-count:not(.total){min-height:198px;padding:32px 10px 16px;gap:7px}#app .slx-tier-strip>.slx-tier-count:not(.total)>:is(.tier-engraving,.slx-count-label){font-size:11px;top:13px;left:13px}#app .slx-tier-x{width:76px;height:76px;margin:5px auto}#app .slx-tier-x>span{font-size:50px}#app .slx-tier-strip>.slx-tier-count:not(.total)>:is(b,.slx-count-num){font-size:36px}#app .slx-tier-strip>.slx-tier-count:not(.total)>small{font-size:14px}#app .slx-my-cards{padding:14px 12px}#app .slx-my-cards-heading h2{font-size:23px}#app .slx-my-cards-heading .btn{font-size:14px;padding:9px 12px}#app .slx-my-cards-tiers{gap:2px}#app .slx-my-cards-tiers>button{font-size:12px;gap:4px}#app .slx-my-cards-heading{margin-bottom:4px}}
