:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow:hidden}.felt{overflow:hidden}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.felt{position:absolute;top:0;left:0;right:0;bottom:0}*{box-sizing:border-box}:root{--highlight-color: yellow;--lowlight-color: rgb(200, 180, 21);--golden_ratio: 1.4180339887;--card-width: 16rem;--font-size: calc(var(--card-width) * 1 / 16);--border: calc(var(--card-width) * .03) solid var(--highlight-color)}body{background-image:url(mat.png)}.card-bg{position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;background-image:url(bg.png);background-size:200%;background-position:50% 0}.card{isolation:isolate;-webkit-user-select:none;user-select:none;z-index:0;position:absolute;transition-property:transform;transition-duration:.1s;transform:rotate(15deg);font-size:var(--font-size);border:var(--border);border-image:linear-gradient(to right,var(--highlight-color),var(--lowlight-color));border-image-slice:1;filter:drop-shadow(1px 1px 3px rgba(0,0,0,.367));aspect-ratio:1 / var(--golden_ratio);width:var(--card-width)}.card.grabbed{box-shadow:calc(var(--card-width) * .01) calc(var(--card-width) * .01) calc(var(--card-width) * .1) calc(var(--card-width) * .001) #0000006c}.card .top-row{display:flex;justify-content:space-between;width:90%;margin:0 auto}.card .top-row h3{margin:0}.card .top-row span{margin:calc(var(--card-width) * .01) 0 0 0}.card .picture{aspect-ratio:var(--golden_ratio);background-image:url(cat.png);background-size:cover;border:var(--border);border-image:linear-gradient(to bottom right,var(--highlight-color),var(--lowlight-color));border-image-slice:1;width:90%;margin:0 auto;box-shadow:.3em .1em .3em #0006}.card .info-lines{display:grid;grid-template-columns:1fr 3fr 1fr;width:97%;margin:1% auto 0}.card .info-lines>*{height:calc(var(--card-width) * .2);border-bottom:solid calc(var(--card-width) * .006) black}.card .holder-container{display:flex;align-items:center}.card .circle-holder{width:100%;display:flex;flex-direction:row;gap:.3em;flex-wrap:wrap;justify-content:center;align-items:center}.card .circle-holder :nth-child(3):last-child{transform:translateY(-10%)}.card .circle-holder .circle{vertical-align:top;--darker-color: color-mix(in srgb, var(--main-color) 50%, black);background-image:linear-gradient(to bottom right,var(--main-color),var(--darker-color));position:relative;border-radius:100%;aspect-ratio:1;width:1.2em;height:1.2em}.card .circle-holder .circle .gleam{--white: rgba(255, 255, 255, .7);box-shadow:0 0 .15em .15em var(--white);position:absolute;top:25%;left:30%;border-radius:100%;aspect-ratio:1;background-color:var(--white);height:.1em}.card .circle-holder .circle .glyph{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card .text-column{padding-left:calc(var(--card-width) * .02);display:flex;align-items:center}.card .text-column .attack-text{font-size:calc(var(--card-width) * .05);line-height:100%}.card .text-column .attack-text h4{font-size:calc(var(--card-width) * .06);display:inline;margin-right:.5em}.card .right-column{display:flex;align-items:center;justify-content:space-around;font-size:calc(var(--card-width) * .1)}.red{--main-color: rgb(214, 37, 37)}.blue{--main-color: rgb(94, 94, 157)}.yellow{--main-color: yellow}.purple{--main-color: rgb(170, 7, 195)}.white{--main-color: white}.green{--main-color: green}.gray{--main-color: gray}.card-yellow{filter:hue-rotate(0deg)}.card-green{filter:hue-rotate(70deg)}.card-blue{filter:hue-rotate(150deg) brightness(70%)}.card-black{filter:grayscale(100%) brightness(40%) contrast(120%)}.card-brown{filter:hue-rotate(20deg) saturate(60%) brightness(70%)}.card-purple{filter:hue-rotate(220deg) brightness(70%)}.card-red{filter:hue-rotate(-30deg) brightness(.7) saturate(200%)}