.draft-card p b{font-weight:400;color:#22f0ff}.draft-card .level.keys{justify-content:flex-start;flex-wrap:wrap;gap:5px;min-height:22px}.draft-card .keys kbd{min-width:22px;height:22px;padding:1px 6px 0;border:0;border-radius:5px;font:400 9px/1 var(--pixel);letter-spacing:.06em;color:#e9f6ff;background:linear-gradient(180deg,#59616a,#343a40 60%,#2a2f34);box-shadow:inset 0 1px #ffffff4d,0 2px #050608,0 3px 4px #00000080}.draft-card .keys kbd.icon{padding:0 4px}.draft-card .keys kbd svg{width:11px;height:14px}.draft-card .keys .or{font:400 9px/1 var(--pixel);letter-spacing:.12em;text-transform:uppercase;color:#9aa1a8}.draft-card{--pixel: "Silkscreen", var(--hud-font);--pixel-text: "VT323", var(--hud-font);--frame: linear-gradient(155deg, #f2f5f8, #9aa3ad 22%, #e9eef2 40%, #747d87 62%, #d3d9df 82%, #8d96a0);--coin: radial-gradient(circle at 36% 30%, #ffffff, #e3e7eb 40%, #9aa1a8 85%);--tier: #7fc4ff;--tier-glow: rgba(34, 240, 255, .35);--edge: rgba(220, 230, 240, .85);position:relative;display:block;width:100%;aspect-ratio:5 / 7;padding:0;border:0;border-radius:16px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;perspective:700px;transform-style:preserve-3d;transition:translate .25s cubic-bezier(.2,.9,.3,1.2)}.draft-card.tier-rare{--frame: linear-gradient(155deg, #fff4c2, #c8902a 22%, #ffe58a 40%, #8a6116 62%, #ffd45e 82%, #a87a22);--coin: radial-gradient(circle at 36% 30%, #fffbe6, #ffd45e 45%, #a87a22 90%);--tier: #fff23a;--tier-glow: rgba(255, 242, 58, .35);--edge: rgba(255, 228, 120, .9)}.draft-card.tier-elite{--frame: linear-gradient(155deg, #ffd0d8, #c2223f 22%, #ff8aa0 40%, #7a0f24 62%, #ff5a7a 82%, #9e1830);--coin: radial-gradient(circle at 36% 30%, #fff0f3, #ff7d96 45%, #a0182f 90%);--tier: #ff3d6e;--tier-glow: rgba(255, 43, 214, .4);--edge: rgba(255, 120, 160, .9)}.draft-card.focus{translate:0 -8px}.draft-card .face{position:relative;display:block;height:100%;padding:6px;border-radius:16px;background:var(--frame);box-shadow:inset 0 1px #fffc,inset 0 -1px #0006,0 16px 30px #000000a6,0 3px 6px #0009;transform:rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));transition:transform .5s cubic-bezier(.2,.9,.3,1),box-shadow .25s;overflow:hidden;isolation:isolate}.draft-card.tracking .face{transition:transform .08s linear,box-shadow .25s}.draft-card:hover .face,.draft-card.focus .face{box-shadow:inset 0 1px #fffc,0 0 0 1px var(--edge),0 0 28px var(--tier-glow),0 22px 36px #000000b3}.draft-card.focus:not(.tracking) .face{animation:card-sway 5s ease-in-out infinite}@keyframes card-sway{0%,to{transform:rotateX(3deg) rotateY(-6deg)}50%{transform:rotateX(-2deg) rotateY(6deg)}}.draft-card .frame{position:relative;display:flex;flex-direction:column;gap:8px;height:100%;padding:8px;border-radius:11px;background:linear-gradient(180deg,#16191d,#0d0f12 70%,#111417);box-shadow:inset 0 0 0 2px #050608,inset 0 3px 8px #000000b3}.draft-card .plate{display:flex;align-items:center;gap:9px;min-height:40px;padding:5px 9px 5px 6px;border-radius:8px;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),linear-gradient(180deg,#5d646c,#3b4148 55%,#2c3136);box-shadow:inset 0 1px #ffffff4d,inset 0 -2px #00000073,0 2px #0009}.draft-card .key{flex:none;display:grid;place-content:center;width:26px;height:26px;min-width:0;padding:0 0 1px 1px;border:0;border-radius:50%;font:700 13px/1 var(--pixel);color:#0a0b0d;background:var(--coin);box-shadow:inset 0 -2px 2px #00000040,0 2px 3px #000000b3}.draft-card h3{display:-webkit-box;min-width:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;font:700 12px/1.15 var(--pixel);letter-spacing:.02em;text-transform:uppercase;color:#fff;text-shadow:1px 0 #000,-1px 0 #000,0 1px #000,0 -1px #000,2px 2px 0 #000}.draft-card .art{position:relative;display:grid;place-items:center;flex:none;aspect-ratio:16 / 10;overflow:hidden;border-radius:8px;color:var(--tier);background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px),radial-gradient(circle at 50% 50%,rgba(34,240,255,.16),transparent 60%),repeating-radial-gradient(circle at 50% 50%,transparent 0 21px,rgba(34,200,220,.3) 21px 22px),linear-gradient(rgba(34,200,220,.24) 1px,transparent 1px) -1px -1px / 14px 14px,linear-gradient(90deg,rgba(34,200,220,.24) 1px,transparent 1px) -1px -1px / 14px 14px,radial-gradient(circle at 50% 45%,#0a2228,#03080b 75%);box-shadow:inset 0 0 0 1px #000000e6,inset 0 0 0 2px #ffffff0d,inset 0 0 30px #000000bf}.draft-card .art svg{position:relative;z-index:1;width:64px;height:64px}.draft-card .art .sprite{position:relative;z-index:1;width:108px;height:108px;image-rendering:pixelated;filter:drop-shadow(0 0 10px var(--tier-glow));animation:sprite-glitch 3.4s calc(var(--turn-delay, 0s) + 1s) infinite steps(1)}@keyframes sprite-glitch{0%,88%,to{transform:none;filter:drop-shadow(0 0 10px var(--tier-glow))}89%{transform:translate(3px);filter:drop-shadow(-3px 0 0 #ff2bd6) drop-shadow(0 0 10px var(--tier-glow))}91%{transform:translate(-3px) skew(-6deg);filter:drop-shadow(3px 0 0 #22f0ff)}93%{transform:translate(1px)}}.draft-card .art.window{background:radial-gradient(ellipse 80% 70% at 50% 40%,rgba(34,240,255,.14),transparent 70%),linear-gradient(180deg,#071318,#02060a)}.draft-card .art .view{position:absolute;inset:0;z-index:1;width:100%;height:100%;opacity:0;transition:opacity .5s}.draft-card .art.window.shown .view{opacity:1}.draft-card .art.window.shown .sprite,.draft-card .art.window.shown>svg{opacity:0;transition:opacity .3s}.draft-card .art.window:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.1),transparent 35%),repeating-linear-gradient(0deg,rgba(0,0,0,.2) 0 1px,transparent 1px 3px);box-shadow:inset 0 0 0 1px #000000e6,inset 0 0 24px #000000b3}.draft-card .type{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:2px 2px 7px;border-bottom:2px solid rgba(255,255,255,.07);font:400 9px/1 var(--pixel);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}.draft-card .type b{overflow:hidden;font-weight:400;text-overflow:ellipsis;color:#a9b0b8}.draft-card .type em{font-style:normal;color:var(--tier);text-shadow:0 0 8px var(--tier-glow)}.draft-card p{flex:1;padding:0 2px;font:400 17px/.95 var(--pixel-text);letter-spacing:.02em;text-transform:uppercase;color:#f1f5f8;text-shadow:1px 1px 0 #000}.draft-card .level{display:flex;align-items:center;justify-content:space-between;padding:0 2px 2px}.stacks{display:flex;align-items:center;gap:4px}.stacks i{width:18px;height:7px;border-radius:4px;background:#ffffff14}.stacks i.have{background:#22f0ff;box-shadow:0 0 8px #22f0ff99}.stacks i.next{background:var(--tier);box-shadow:0 0 8px var(--tier-glow);animation:pulse 1s ease-in-out infinite}.draft-card.tier-common .stacks i.next{background:#22f0ff;box-shadow:0 0 8px #22f0ff99}.draft-card .lv{font:400 9px/1 var(--pixel);letter-spacing:.18em;text-transform:uppercase;color:#9aa1a8}.draft-card .bits{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;transition:opacity .2s}.draft-card .bits>span{position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;animation:bit-jump var(--t) var(--d) infinite steps(1)}.draft-card .bits i{position:absolute;width:var(--s);height:var(--s);background:var(--c);box-shadow:0 0 6px var(--c)}@keyframes bit-jump{0%,60%{transform:none;opacity:1}62%{transform:translate(6px,-4px);opacity:1}66%{opacity:0}74%{transform:translate(-4px,3px);opacity:1}80%{transform:none}90%{opacity:.25}92%{opacity:1}}.draft-card.tier-rare .bits,.draft-card.tier-elite .bits{opacity:1;animation:bits-in .2s var(--turn-delay, 0s) backwards}.draft-card.tier-common:hover .bits,.draft-card.tier-common.focus .bits{opacity:1}@keyframes bits-in{0%{opacity:0}}.draft-card .holo,.draft-card .glitter,.draft-card .glare{position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none}.draft-card .holo{display:none;background-image:linear-gradient(115deg,transparent 30%,rgba(34,240,255,.3) 39%,rgba(255,43,214,.3) 47%,rgba(255,242,58,.3) 55%,rgba(34,240,255,.24) 62%,transparent 70%),repeating-linear-gradient(-55deg,rgba(255,255,255,.05) 0 1px,transparent 1px 4px);background-size:250% 250%,auto;background-position:var(--px, 50%) var(--py, 50%),0 0;mix-blend-mode:plus-lighter;opacity:.85;animation:holo-drift 7s ease-in-out infinite alternate}.draft-card.tracking .holo{animation:none;opacity:calc(.7 + var(--hyp, 0) * .5)}@keyframes holo-drift{0%{background-position:10% 20%,0 0}to{background-position:90% 80%,0 0}}.draft-card.tier-rare .art .holo{display:block;z-index:2}.draft-card.tier-elite .face>.holo{display:block;opacity:.6}.draft-card.tier-elite.tracking .face>.holo{opacity:calc(.5 + var(--hyp, 0) * .5)}.draft-card .glitter{display:none}.draft-card.tier-elite .glitter{display:block;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.25' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 0.92 0 0 0 14 -9.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.35' seed='9'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 0.92 0 0 0 14 -10.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:160px 160px,210px 210px;background-position:calc(var(--px, 50%) * .4) calc(var(--py, 50%) * .4),calc(var(--px, 50%) * -.3) calc(var(--py, 50%) * -.3);mix-blend-mode:plus-lighter;opacity:.85;-webkit-mask:radial-gradient(circle at var(--px, 50%) var(--py, 40%),#000,rgba(0,0,0,.15) 65%);mask:radial-gradient(circle at var(--px, 50%) var(--py, 40%),#000,rgba(0,0,0,.15) 65%);animation:glitter 1.8s ease-in-out infinite alternate}@keyframes glitter{to{opacity:.35}}.draft-card.tier-rare .face:after,.draft-card.tier-elite .face:after{content:"";position:absolute;inset:0;z-index:3;padding:6px;border-radius:inherit;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.75) 50%,transparent 58%) no-repeat;background-size:300% 100%;mix-blend-mode:plus-lighter;-webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);pointer-events:none;animation:frame-glint 4s calc(var(--turn-delay, 0s) + .6s) infinite ease-in-out}@keyframes frame-glint{0%{background-position:120% 0}40%,to{background-position:-20% 0}}.draft-card .glare{background:radial-gradient(farthest-corner circle at var(--px, 50%) var(--py, 20%),rgba(255,255,255,.32),rgba(255,255,255,.05) 35%,rgba(0,0,0,.28) 95%);mix-blend-mode:overlay;opacity:0;transition:opacity .3s}.draft-card:hover .glare,.draft-card.focus .glare{opacity:1}.draft-card.tier-common .glare{background:radial-gradient(farthest-corner circle at var(--px, 50%) var(--py, 20%),rgba(255,255,255,.16),transparent 40%,rgba(0,0,0,.2) 95%)}@keyframes card-deal{0%{translate:var(--dx, 0) var(--dy, 40px);scale:.18;opacity:0}25%{opacity:1}}@keyframes card-turn{0%{transform:perspective(900px) rotateY(0)}50%{transform:perspective(900px) rotateY(90deg) scale(1.04)}to{transform:perspective(900px) rotateY(0)}}@keyframes tier-burst{0%{box-shadow:0 0 90px 24px var(--tier),inset 0 0 60px var(--tier)}}.card-back{position:absolute;inset:0;z-index:6;display:block;padding:6px;border-radius:16px;color:#22f0ff;background:linear-gradient(155deg,#f2f5f8,#9aa3ad 22%,#e9eef2 40%,#747d87 62%,#d3d9df 82%,#8d96a0);box-shadow:inset 0 1px #fffc,0 16px 30px #000000a6;pointer-events:none;animation:back-off .25s var(--turn-delay, 0s) forwards steps(1,end)}.back-face{display:grid;place-items:center;height:100%;border-radius:11px;background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px),radial-gradient(circle at 50% 50%,rgba(34,240,255,.18),transparent 55%),repeating-radial-gradient(circle at 50% 50%,transparent 0 21px,rgba(34,200,220,.22) 21px 22px),linear-gradient(rgba(34,200,220,.16) 1px,transparent 1px) -1px -1px / 14px 14px,linear-gradient(90deg,rgba(34,200,220,.16) 1px,transparent 1px) -1px -1px / 14px 14px,#05090c;box-shadow:inset 0 0 0 2px #050608,inset 0 0 40px #000000d9}.back-face b{font:700 72px/1 "Silkscreen",var(--hud-font);color:currentColor;text-shadow:4px 0 0 #ff2bd6,-4px 0 0 rgba(255,242,58,.8),0 0 18px currentColor}.draft-card.tier-rare .card-back,.draft-card.tier-elite .card-back{animation:back-tease .6s calc(var(--deal-delay, 0s) + .45s) infinite alternate ease-in-out,back-off .25s var(--turn-delay, 0s) forwards steps(1,end)}@keyframes back-off{to{opacity:0;visibility:hidden}}@keyframes back-tease{0%{color:#22f0ff;box-shadow:0 16px 30px #000000a6}to{color:var(--tier);box-shadow:0 0 0 2px var(--tier),0 0 34px var(--tier-glow),0 16px 30px #000000a6}}