.hb-card{--u:calc(var(--xi-card) / 150);--chamfer:polygon(calc(10 * var(--u)) 0, calc(100% - 10 * var(--u)) 0, 100% calc(10 * var(--u)), 100% calc(100% - 10 * var(--u)), calc(100% - 10 * var(--u)) 100%, calc(10 * var(--u)) 100%, 0 calc(100% - 10 * var(--u)), 0 calc(10 * var(--u)));--shield:polygon(0 0, 100% 0, 100% 58%, 50% 100%, 0 58%);width:calc(132 * var(--u));height:calc(150 * var(--u));isolation:isolate;flex:none;position:relative}.hb-card:before,.hb-card:after{content:"";z-index:-1;inset:calc(5 * var(--u));pointer-events:none;position:absolute}.hb-card:before{box-shadow:0 calc(7 * var(--u)) calc(16 * var(--u)) calc(2 * var(--u)) #0009;background:#0000004d}.hb-rim,.hb-field{clip-path:var(--chamfer);position:absolute}.hb-rim{inset:0}.hb-field{inset:calc(var(--field-inset,4) * var(--u));overflow:hidden}.hb-content{z-index:3;padding-top:calc(45 * var(--u));flex-direction:column;align-items:center;display:flex;position:absolute;inset:0}.hb-name{width:calc(110 * var(--u));height:calc(40 * var(--u));font-family:var(--font-card-name), Georgia, serif;font-size:calc(17 * var(--u));text-align:center;text-wrap:balance;justify-content:center;align-items:center;font-weight:900;line-height:1.02;display:flex;overflow:hidden}.hb-long{font-size:calc(14.5 * var(--u))}.hb-longer{font-size:calc(12.5 * var(--u))}.hb-longest{font-size:calc(10.5 * var(--u))}.hb-rule{width:calc(96 * var(--u));height:calc(4 * var(--u));margin-top:calc(4 * var(--u));opacity:.4;border-top:1px solid;border-bottom:1px solid}.hb-ratings{width:calc(104 * var(--u));margin-top:calc(7 * var(--u));display:flex}.hb-rating{align-items:center;gap:calc(3 * var(--u));flex-direction:column;flex:1;display:flex}.hb-rating+.hb-rating{box-shadow:-1px 0 0 var(--divider)}.hb-rating span{font-family:var(--font-card-name), Georgia, serif;font-size:calc(8.5 * var(--u));letter-spacing:.2em;opacity:.85;padding-left:.2em;font-weight:700;line-height:1}.hb-rating b{font-family:var(--font-card-number), Georgia, serif;font-size:calc(24 * var(--u));opacity:.62;font-weight:400;line-height:1}.hb-main b{color:var(--main);opacity:1}.hb-nail{z-index:4;width:calc(5 * var(--u));height:calc(5 * var(--u));background:var(--nail);border-radius:50%;position:absolute}.hb-n1{top:calc(var(--nail-at,10) * var(--u));left:calc(var(--nail-at,10) * var(--u))}.hb-n2{top:calc(var(--nail-at,10) * var(--u));right:calc(var(--nail-at,10) * var(--u))}.hb-n3{bottom:calc(var(--nail-at,10) * var(--u));left:calc(var(--nail-at,10) * var(--u))}.hb-n4{right:calc(var(--nail-at,10) * var(--u));bottom:calc(var(--nail-at,10) * var(--u))}.hb-wing{z-index:4;top:calc(14 * var(--u));height:calc(3 * var(--u));border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);opacity:.6;position:absolute}.hb-w1{left:calc(20 * var(--u));right:calc(50% + 24 * var(--u))}.hb-w2{right:calc(20 * var(--u));left:calc(50% + 24 * var(--u))}.hb-crest,.hb-crest-shadow{z-index:5;top:calc(-7 * var(--u));width:calc(38 * var(--u));height:calc(46 * var(--u));margin-left:calc(-19 * var(--u));clip-path:var(--shield);position:absolute;left:50%}.hb-crest{background:var(--crest-metal)}.hb-crest:after{content:"";pointer-events:none;background:linear-gradient(115deg,#fff0 35%,#ffffff59 48%,#fff0 60%);position:absolute;inset:0}.hb-crest-shadow{z-index:4;filter:blur(3px);transform:translateY(calc(4 * var(--u)));background:#00000073}.hb-paint{inset:calc(2.5 * var(--u)) calc(2.5 * var(--u)) calc(3.5 * var(--u));padding-top:calc(3 * var(--u));clip-path:var(--shield);background:linear-gradient(180deg, #fff3, #00000040 75%), var(--paint);color:#fbf3dc;justify-content:center;align-items:flex-start;display:flex;position:absolute}.hb-symbol{top:calc(-4.5 * var(--u));width:calc(52 * var(--u));height:calc(52 * var(--u));max-width:none;margin-left:calc(-26 * var(--u));pointer-events:none;-webkit-user-drag:none;position:absolute;left:50%}.hb-bat{--paint:#2f6a45;--cut:#2f6a45}.hb-bowl{--paint:#9b2230;--cut:#9b2230}.hb-wk{--paint:linear-gradient(90deg, #263c78 0 50%, #2f6a45 50% 100%);--cut:#263c78}.hb-ar{--paint:linear-gradient(90deg, #2f6a45 0 50%, #9b2230 50% 100%);--cut:#5a2e2a}.hb-t4{--field-inset:6;--nail-at:13;--ink:#f3d9a8;--main:#fff1d6;--divider:#ffe1a852;--nail:radial-gradient(circle at 35% 35%, #c4bfb6, #5c574f 60%, #2c2925);--crest-metal:linear-gradient(160deg, #8a5a2c, #4a2c12 55%, #7a4c22)}.hb-t4 .hb-rim{background:repeating-linear-gradient(91deg,#00000024 0 2px,#0000 2px 5px),linear-gradient(#5a3517,#36200b)}.hb-t4 .hb-field{background:repeating-linear-gradient(91deg,#00000012 0 2px,#0000 2px 6px,#ffdcaa0d 6px 7px,#0000 7px 11px),linear-gradient(#9a6532,#704621)}.hb-t4 .hb-content{color:#fff1d6;text-shadow:0 1px #00000059}.hb-t3{--ink:#e9edf2;--main:#fff;--divider:#f0f3f74d;--nail:radial-gradient(circle at 35% 35%, #fff, #9aa3b1 60%, #4a525e);--crest-metal:linear-gradient(160deg, #fff, #8e98a7 45%, #f1f4f8 60%, #6c7684)}.hb-t3 .hb-rim{background:linear-gradient(160deg,#f4f7fb,#8e98a7 30%,#fff 48%,#646e7d 70%,#e0e6ee)}.hb-t3 .hb-field{background:repeating-linear-gradient(91deg,#0000001a 0 2px,#0000 2px 6px,#ffc8b40d 6px 7px,#0000 7px 11px),linear-gradient(#7a2618,#45110a)}.hb-t3 .hb-content{color:#f1f3f7}.hb-t3 .hb-main b{color:#0000;background:linear-gradient(#fff,#c2c9d4 60%,#8d96a4);-webkit-background-clip:text;background-clip:text}.hb-t2{--ink:#2a323d;--main:#0c1118;--divider:#141c2647;--nail:radial-gradient(circle at 35% 35%, #8d96a3, #3e4652 55%, #14181d);--crest-metal:linear-gradient(160deg, #fff, #7f8998 45%, #f2f5f8 60%, #59626f);--hb-rim:conic-gradient(#6b7482, #e9eef5, #fff, #9aa3b1, #4f5865, #dfe5ec, #fff, #8a93a1, #6b7482)}.hb-t2:after{box-shadow:0 0 calc(12 * var(--u)) calc(3 * var(--u)) #e1e9f552}.hb-t2 .hb-rim{background:var(--hb-rim)}.hb-t2 .hb-field{background:repeating-linear-gradient(0deg,#ffffff38 0 1px,#0000 1px 2px,#00000009 2px 3px),linear-gradient(160deg,#e8ecf1,#b4bcc7 40%,#eef1f5 58%,#a3adb9);box-shadow:inset 0 0 0 1px #1e26308c}.hb-t2 .hb-field:after{content:"";background:linear-gradient(118deg,#0000 30%,#ffffff73 42%,#0000 54%);position:absolute;inset:0}.hb-t2 .hb-content{color:#1b222c;text-shadow:0 1px #ffffffa6}.hb-t1{--ink:#5a3a06;--main:#241502;--divider:#462c0459;--nail:radial-gradient(circle at 35% 35%, #fff3c4, #b07a14 55%, #4a3006);--hb-rim:conic-gradient(#8a5a0a, #ffd76a, #fff8dc, #c48a1c, #6b4404, #ffe58a, #fffbe8, #a8730f, #8a5a0a)}.hb-t1:after{box-shadow:0 0 calc(8 * var(--u)) calc(3 * var(--u)) #ffc8508c, 0 0 calc(22 * var(--u)) calc(7 * var(--u)) #ff961e47}.hb-t1 .hb-rim,.hb-t1 .hb-crest{background:var(--hb-rim)}.hb-t1 .hb-field{background:repeating-linear-gradient(0deg,#fffae138 0 1px,#0000 1px 2px,#5a37000d 2px 3px),linear-gradient(160deg,#f8e5a4,#c9982f 40%,#f4d980 58%,#b5841f);box-shadow:inset 0 0 0 1px #4628008c}.hb-t1 .hb-field:before{content:"";z-index:1;inset:calc(5 * var(--u));position:absolute;box-shadow:inset 0 0 0 1px #50320466,inset 0 0 0 2px #fff8d799}.hb-t1 .hb-content{color:#2e1c03}.hb-t1 .hb-name,.hb-t1 .hb-main b{color:#2a1802;text-shadow:0 1px #fff6d2b3}.hb-dust{z-index:5;width:calc(3 * var(--u));height:calc(3 * var(--u));opacity:0;background:#fffbe8;border-radius:50%;display:none;position:absolute;box-shadow:0 0 5px 1px #ffbe46f2}.hb-d1{top:calc(110 * var(--u));left:calc(8 * var(--u))}.hb-d2{top:calc(86 * var(--u));left:calc(121 * var(--u));animation-delay:.8s}.hb-d3{top:calc(136 * var(--u));left:calc(5 * var(--u));animation-delay:1.6s}.hb-d4{top:calc(136 * var(--u));left:calc(124 * var(--u));animation-delay:2.4s}.hb-d5{top:calc(46 * var(--u));left:calc(104 * var(--u));animation-delay:1.2s}.hb-glint{z-index:6;width:calc(11 * var(--u));height:calc(11 * var(--u));clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);background:#fff6cf;display:none;position:absolute;transform:scale(0)}.hb-g1{top:calc(7 * var(--u));left:calc(7 * var(--u))}.hb-g2{top:calc(7 * var(--u));right:calc(7 * var(--u));animation-delay:.65s}.hb-g3{right:calc(7 * var(--u));bottom:calc(7 * var(--u));animation-delay:1.3s}.hb-g4{bottom:calc(7 * var(--u));left:calc(7 * var(--u));animation-delay:1.95s}.hb-award{width:calc(116 * var(--u));font-family:var(--font-display), sans-serif;font-size:calc(7.6 * var(--u));font-weight:800;line-height:calc(10 * var(--u));letter-spacing:.06em;text-align:center;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;display:block;overflow:hidden}.hb-t0{--ink:#ffe08a;--main:#ffe08a;--divider:#ffd67859;--nail:radial-gradient(circle at 35% 35%, #fff6c8, #e0a830 60%, #7a5008);--hb-rim:conic-gradient(#8a5a0a, #ffd76a, #fff8dc, #c48a1c, #6b4404, #ffe58a, #fffbe8, #a8730f, #8a5a0a)}.hb-t0 .hb-content{padding-top:calc(41 * var(--u));color:#ffe7a8}.hb-t0 .hb-name{height:calc(34 * var(--u))}.hb-t0:after{box-shadow:0 0 calc(10 * var(--u)) calc(3 * var(--u)) #ffc850b3, 0 0 calc(26 * var(--u)) calc(8 * var(--u)) #ff961e61;animation:2.8s ease-in-out infinite hb-breathe}.hb-t0 .hb-rim,.hb-t0 .hb-crest{background:var(--hb-rim)}.hb-t0 .hb-field{background:radial-gradient(circle,#0000 15%,#0d09058c 55%,#0d0905eb 85%),repeating-conic-gradient(#ffd67821 0deg 3deg,#0000 3deg 10deg),radial-gradient(90% 55%,#3a2810,#0d0905 75%)}.hb-t0 .hb-field:before{content:"";z-index:1;inset:calc(5 * var(--u));box-shadow:inset 0 0 0 1px #ffd678b3, inset 0 0 0 calc(3 * var(--u)) #0d0905, inset 0 0 0 calc(3 * var(--u) + 1px) #ffd67859;position:absolute}.hb-t0 .hb-name,.hb-t0 .hb-main b,.hb-t0 .hb-award{color:#0000;background:linear-gradient(100deg,#b8801a 0%,#ffe38a 30%,#fffbe6 40%,#ffd36a 50%,#b8801a 70%,#ffe38a 100%);-webkit-background-clip:text;background-clip:text}.hb-t0 .hb-rating span{color:#f1d48a}.hb-t0 .hb-dust{background:#ffe39a;box-shadow:0 0 5px 1px #ffbe46f2}.hb-t0 .hb-glint{background:#fff}.hb-t0 :is(.hb-rim,.hb-crest):before{content:"";aspect-ratio:1;background:var(--hb-rim);width:160%;animation:4s linear infinite hb-spin;position:absolute;top:50%;left:50%}.hb-t0 .hb-field:after{content:"";z-index:2;background:linear-gradient(105deg,#0000 30%,#fff0c84d 50%,#0000 70%);width:60%;animation:3.4s ease-in-out infinite hb-sweep;position:absolute;top:-20%;bottom:-20%;left:0;transform:translate(-120%)}.hb-t0 .hb-dust{animation:3.2s ease-out infinite hb-rise;display:block}.hb-t0 .hb-glint{animation:2.6s ease-in-out infinite hb-twinkle;display:block}.hb-t0 .hb-d2{animation-delay:.8s}.hb-t0 .hb-d3{animation-delay:1.6s}.hb-t0 .hb-d4{animation-delay:2.4s}.hb-t0 .hb-d5{animation-delay:1.2s}.hb-t0 .hb-d6{animation-delay:2s}.hb-t0 .hb-d7{animation-delay:.4s}.hb-t0 .hb-g2{animation-delay:.65s}.hb-t0 .hb-g3{animation-delay:1.3s}.hb-t0 .hb-g4{animation-delay:1.95s}.hb-d6{top:calc(100 * var(--u));left:calc(30 * var(--u))}.hb-d7{top:calc(118 * var(--u));left:calc(98 * var(--u))}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-t1 :is(.hb-rim,.hb-crest):before,:is(.xi-cell,.card-wrap:hover) .hb-t2 .hb-rim:before{content:"";aspect-ratio:1;background:var(--hb-rim);width:160%;animation:7s linear infinite hb-spin;position:absolute;top:50%;left:50%}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-t1 :is(.hb-rim,.hb-crest):before{animation-duration:4s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-t1:after{animation:2.8s ease-in-out infinite hb-breathe}:is(.xi-cell,.card-wrap:hover) .hb-t2:after{animation:3.4s ease-in-out infinite hb-breathe}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-t1 .hb-field:after{content:"";z-index:2;background:linear-gradient(105deg,#0000 25%,#fffceb8c 50%,#0000 75%);width:60%;animation:3.4s ease-in-out infinite hb-sweep;position:absolute;top:-20%;bottom:-20%;left:0;transform:translate(-120%)}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-crest:after{z-index:2;background:linear-gradient(90deg,#0000,#fffc,#0000);width:55%;animation:4.2s ease-in-out infinite hb-crest-shine;inset:-10% auto -10% 0;transform:translate(-130%)skew(-18deg)}:is(.xi-cell,.hero-cards,.tier-card) .hb-t2 .hb-crest:after{animation-delay:1.1s}:is(.xi-cell,.hero-cards,.tier-card) .hb-t3 .hb-crest:after{animation-delay:2.2s}:is(.xi-cell,.hero-cards,.tier-card) .hb-t4 .hb-crest:after{animation-delay:3.1s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-dust{animation:3.2s ease-out infinite hb-rise;display:block}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-glint{animation:2.6s ease-in-out infinite hb-twinkle;display:block}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-d2{animation-delay:.8s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-d3{animation-delay:1.6s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-d4{animation-delay:2.4s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-d5{animation-delay:1.2s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-g2{animation-delay:.65s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-g3{animation-delay:1.3s}:is(.xi-cell,.hero-cards,.tier-card,.card-wrap:hover) .hb-g4{animation-delay:1.95s}@keyframes hb-spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes hb-crest-shine{0%{transform:translate(-130%)skew(-18deg)}28%,to{transform:translate(240%)skew(-18deg)}}@keyframes hb-sweep{0%{transform:translate(-120%)}55%,to{transform:translate(220%)}}@keyframes hb-breathe{50%{opacity:.45}}@keyframes hb-rise{0%{opacity:0;transform:translateY(0)}20%{opacity:1}to{opacity:0;transform:translateY(calc(-70 * var(--u)))}}@keyframes hb-twinkle{0%,to{transform:scale(0)rotate(0)}15%{transform:scale(1)rotate(45deg)}30%{transform:scale(0)rotate(90deg)}}@media (prefers-reduced-motion:reduce){.hb-card,.hb-card *,.hb-card:after,.hb-card :before,.hb-card :after{animation:none!important}.hb-dust,.hb-glint{display:none!important}}html[data-calm=true] .hb-card:after,html[data-calm=true] .hb-rim:before,html[data-calm=true] .hb-crest:before,html[data-calm=true] .hb-field:after,html[data-calm=true] .hb-crest:after{animation:none!important}html[data-calm=true] :is(.hb-dust,.hb-glint){display:none!important}
