*{touch-action:none;font-family:Lilita One}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#000;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;min-width:320px;min-height:100vh;overflow:hidden}h1{z-index:2;font-size:3.2rem;line-height:1.1}.front-top{z-index:2;font-size:1.8rem;line-height:1.1}.front-middle{z-index:2;font-size:2.6rem;line-height:1.1}.other-text{z-index:2;font-size:1.2rem;line-height:1.1}*{-webkit-user-select:none;user-select:none}.text-shadow{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-shadow:-2px 2px black,0 1px black,1px 0 black,0 -1px black}.background{background:radial-gradient(circle at 50% 68.8%,#323232,#000 99.4%)}.gender-button{border-radius:8px;border:1.5px solid black;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#f4c2c2;cursor:pointer;transition:border-color .25s;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.gender-button:hover{border:2px solid white}.boy-color{color:#63c7f5;fill:#63c7f5}.gold-text{background:linear-gradient(to bottom,#cfc09f 22%,#634f2c,#cfc09f 26%,#cfc09f 27%,#ffecb3 40%,#3a2c0f 78%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.girl-color{color:#ef96c2;fill:#ef96c2}.girl-bg{background-color:#f4c2c2}.boy-bg{background-color:#89cff0}.reveal-bg{background:radial-gradient(ellipse farthest-corner at right bottom,#FEDB37 0%,#FDB931 8%,#9f7928 30%,#8A6E2F 40%,transparent 80%),radial-gradient(ellipse farthest-corner at left top,#fff,#ffffac 8%,#d1b464 25%,#5d4a1f,#5d4a1f)}.scratch-fieldset{margin:10px;padding:10px;background-color:#1a1c19;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:2px solid gray;border-radius:25px;overflow:hidden;z-index:2}.scratch-legend{margin:0 auto}.scratch-container{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:5px;justify-items:center;background-color:#1a1c19;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;max-width:600px;border-radius:1rem}.scratch-item{background-color:#1a1c19;font-size:20px;color:#fff;cursor:grab}.shifting-background{background:linear-gradient(315deg,#3c84ce 3%,#94bbe9 38%,pink,#eeaeca 98%);animation:gradient 10s ease infinite;background-size:400% 400%!important;background-attachment:fixed}@keyframes gradient{0%{background-position:0% 0%}50%{background-position:100% 100%}to{background-position:0% 0%}}#root{width:100%;background:#000}.flip-card{perspective:1000px;overflow:hidden}.flip-card-inner{transition:transform 1s;transform-style:preserve-3d;width:100%;height:100%;position:relative}.flip-card-front,.flip-card-back{backface-visibility:hidden;width:100%;height:100%;position:absolute}.flip-card-back{transform:rotateY(180deg)}.animated-border{border-radius:10px;position:relative}.animated-border:before{filter:blur(1.5rem);opacity:.5}.animated-border:after,.card:before{content:"";position:absolute;height:100%;width:100%;background-image:conic-gradient(from var(--angle),#ff4545,#00ff99,#006aff,#ff0095,#ff4545);top:50%;left:50%;translate:-50% -50%;z-index:-1;padding:8px;border-radius:10px;animation:3s spin linear infinite}@property --angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@keyframes spin{0%{--angle: 0deg}to{--angle: 360deg}}:root{--cloud-rotation: 0deg;--cloud-size: 1;--cloud-color: #fff}.cloud{background-color:var(--cloud-color);background-image:-webkit-linear-gradient(hsla(0,0%,0%,0),hsla(0,0%,0%,.1));border-radius:calc(1em * var(--cloud-size));display:inline-block;height:calc(1em * var(--cloud-size));margin-left:calc(-1.5em * var(--cloud-size));position:absolute;width:calc(3em * var(--cloud-size));filter:drop-shadow(0 calc(2px * var(--cloud-size)) calc(3px * var(--cloud-size)) hsla(0,0%,0%,.25));-webkit-filter:drop-shadow(0 calc(2px * var(--cloud-size)) calc(3px * var(--cloud-size)) hsla(0,0%,0%,.25));transform:rotate(var(--cloud-rotation));font-size:16px;z-index:1}.cloud:after,.cloud:before{background-color:var(--cloud-color);content:"";border-radius:100%;position:absolute}.cloud:after{background-image:-webkit-linear-gradient(hsla(0,0%,0%,0) 50%,hsla(0,0%,0%,.025));height:calc(1em * var(--cloud-size));right:calc(.4em * var(--cloud-size));top:calc(-.5em * var(--cloud-size));width:calc(1em * var(--cloud-size))}.cloud:before{background-image:-webkit-linear-gradient(hsla(0,0%,0%,0) 50%,hsla(0,0%,0%,.075));height:calc(1.6em * var(--cloud-size));left:calc(.4em * var(--cloud-size));top:calc(-.75em * var(--cloud-size));width:calc(1.6em * var(--cloud-size))}@keyframes fall{0%{opacity:1;transform:translateY(0) rotate(0)}10%{opacity:1}90%{opacity:1}to{opacity:1;transform:translateY(105vh) rotate(360deg)}}.heart{animation-name:fall;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute}.statistics-bar-container{width:100%;background-color:#f3f3f3;border:1px solid #ddd;margin-bottom:10px;overflow:hidden;display:flex;border-radius:.5rem}.statistics-bar-segment{height:2.5rem;width:100%}.statistics-bar{height:100%;text-align:center;line-height:20px;color:#fff;transition:width .3s ease;display:flex;justify-content:center;align-items:center;font-size:2rem}
