:root{--red: #dd082f;--dark-red: #3b020d;--green: #2ff901;--yellow: #ffcc02;--sky: #01fbfb;--orange: #ffcc02;--blue: #519afb;font-size:16px}#root{height:100vh;display:flex;align-items:center;justify-content:center}body{margin:0;background-color:var(--dark-red);font-family:Arial,Helvetica,sans-serif}h1,h2{margin:0}ul{padding:0;list-style:none}.App{display:flex;align-items:center;height:100vh;overflow:hidden;margin:0;font-family:system-ui}.pokedex{perspective:1000px;position:relative;overflow:hidden;height:31rem;width:23rem;margin:0 auto;overflow:initial;box-shadow:0 2px 12px -2px #f006}.pokedex:hover .pokedex-right-front,.pokedex.is-active .pokedex-right-front{transform:rotateY(180deg)}.pokedex:hover .pokedex-right-back,.pokedex.is-active .pokedex-right-back{transform:rotateY(0)}.pokedex-right-front{background:var(--red);height:calc(100% - 6rem);width:inherit;position:absolute;left:0;right:0;bottom:0;transition:1s;transform-origin:right center;z-index:2;backface-visibility:hidden;border:1px solid black;box-sizing:border-box;border-radius:10px 0 0 10px;border-left:10px solid #9b0a21}.pokedex-right-front:before{height:5rem;position:absolute;bottom:100%;background:var(--red);width:calc(100% - 9rem);right:0;border-top:1px solid black;content:""}.pokedex-right-front:after{content:"";border-right:2.5rem solid var(--red);border-bottom:2.5rem solid var(--red);border-left:2.5rem solid transparent;border-top:2.5rem solid transparent;position:absolute;right:calc(100% - 9rem);bottom:100%;filter:drop-shadow(0 -1px 0 black)}.pokedex-right-back{background:var(--red);height:calc(100% - 6rem);width:inherit;position:absolute;backface-visibility:hidden;transform:rotateY(-180deg);right:0;bottom:0;transition:1s;left:100%;transform-origin:left top;z-index:1;border-width:1px;border-style:solid;border-color:#000;border-radius:0 10px 10px 0;border-left:none;padding:20px;box-sizing:border-box;display:flex}.pokedex-right-back:before{width:calc(100% - 9rem);height:5rem;position:absolute;bottom:100%;background-color:var(--red);left:0;border-top:1px solid black;content:""}.pokedex-right-back:after{content:"";border-left:2.5rem solid var(--red);border-bottom:2.5rem solid var(--red);border-top:2.5rem solid transparent;border-right:2.5rem solid transparent;display:block;width:0;position:absolute;left:calc(100% - 9rem);bottom:100%;filter:drop-shadow(0 -1px 0 black)}.light{border:1px solid black;box-shadow:-2px 2px #ffffff80;width:20px;height:20px;background:gray;border-radius:50%}.light.is-animated{animation:.3s light linear infinite}@keyframes light{0%{background-color:#fff}50%{background-color:var(--sky)}to{background-color:#fff}}.light.is-big{width:50px;height:50px}.light.is-medium{width:40px;height:40px}.light.is-large{width:80px;border-radius:20px}.light.is-red{background-color:var(--red)}.light.is-blue{background-color:var(--blue)}.light.is-green{background-color:var(--green)}.light.is-sky{background-color:var(--sky)}.light.is-orange{background-color:var(--orange)}.light.is-yellow{background-color:var(--yellow)}.pokedex-left{background:var(--red);height:inherit;width:inherit;border-radius:10px 0 0 10px;border:1px solid black;border-right:10px solid black;box-sizing:border-box;padding:15px 20px}.pokedex-left-top{display:flex;align-items:flex-start}.pokedex-left-top>*{margin-right:.7em}.pokedex-left-bottom-lights{display:flex;align-items:flex-start}.pokedex-left-bottom{margin-top:1em}.pokedex-left-bottom-lights>*{margin-right:.8em}.pokedex-screen-container{background:#b0b0b0;border-radius:10px 10px 0 0;border:1px solid black;margin:20px 0;height:50%;padding:.8rem}.pokedex-screen{background:white;border:2px solid black;border-radius:10px;height:100%;display:flex;align-items:center}.pokemon-info{padding:.8rem;flex-grow:1;display:grid;grid-template-columns:40% calc(60% - .8rem);grid-template-rows:35px 1fr;grid-column-gap:.8rem;grid-row-gap:.8rem;grid-template-areas:"title title" "img   stats"}.pokemon-name{text-align:center;text-transform:capitalize;grid-area:title;font-weight:700}.pokemon-img{width:100%;transform:scale(1.2);align-self:center;grid-area:img}.pokemon-stats{grid-area:stats}.pokemon-stat{font-size:.9rem}.pokedex-no-screen{width:100%;height:100%}.stat-name{text-transform:capitalize}.pokemon-form{display:grid;grid-template-columns:1fr 50px;column-gap:.5rem;margin-top:1em}.pokemon-input{font-family:system-ui;padding:10px;background-color:var(--orange);border:none;border:1px solid black;border-radius:10px;outline:0;font-size:1em;flex-grow:1;transition:.2s}.pokemon-input:focus{border-color:#fff}.pokemon-input:focus::-webkit-input-placeholder{color:#fff}.pokemon-input::-webkit-input-placeholder{color:#fffc}.pokemon-btn{border-radius:50%}.pokemon-btn{width:40px;height:40px;position:relative;background:radial-gradient(hsl(0,100%,70%),hsl(0,97%,25%));text-shadow:0 -1px 0 #c30707;color:#fff;border:solid 1px hsl(0,100%,20%);border-radius:100%;z-index:1;outline:none;box-shadow:inset 0 .5px red,0 1px #600,0 1.5px #5c0000,0 2px #520000,0 2.5px #470000,0 3px #3d0000,0 3.5px #300,0 4px #290000,0 4.5px #1f0000}.pokemon-btn:hover{background:radial-gradient(hsl(0,100%,70%),hsl(0,97%,35%))}.pokemon-btn:active{background:radial-gradient(hsl(0,100%,80%),hsl(0,100%,45%));top:2px;box-shadow:inset 0 .5px red,0 1px #600,0 1.5px #5c0000,0 2px #520000,0 2.5px #470000,0 3px #3d0000,0 3.5px #300}