:root{--BodyFont:"Inter", sans-serif;--HeaderFont:"Syne", sans-serif;--Background:#f8f0e3;--BoxTextColor:#faf9f6}.movie-poster{border-radius:10px;width:100%;height:auto}.flip-card{perspective:1000px;background-color:#0000;width:350px;height:520px}.flip-card-front,.flip-card-back{backface-visibility:hidden;width:100%;height:100%;transition:transform .5s;position:absolute;top:0;left:0}.flip-card-back{box-sizing:border-box;font-family:var(--BodyFont);background-color:#575757;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;font-size:40px;display:flex;transform:rotateY(180deg)}.flip-card-front{box-sizing:border-box;background-color:#f8f8f8;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;display:flex;transform:rotateY(0)}.movie-poster-container{justify-content:center;align-items:center;height:100%;padding:10px;display:flex}.flip-card.flip-in .flip-card-front{transform:rotateY(180deg)}.flip-card.flip-in .flip-card-back{transform:rotateY(360deg)}@media screen and (width<=768px){.flip-card{width:330px;height:490px}.movie-poster-container{padding:0}}.movie-info{flex-direction:row;justify-content:center;align-items:center;gap:20px;padding:20px;display:flex}.movie-info>h3{font-family:var(--BodyFont);font-size:20px;font-weight:700}.movie-info>p{font-family:var(--BodyFont);font-size:20px}body{color:#fff;background-color:#111;margin:0}.score{font-size:28px;font-family:var(--HeaderFont);position:relative}.App{text-align:center;box-sizing:border-box;flex-direction:column;max-width:100%;min-height:100vh;margin:0 auto;display:flex;position:relative;overflow:hidden}.content>h1{font-family:var(--HeaderFont);color:var(--text-h);letter-spacing:1.68px;margin:20px;font-size:56px}.bg-layer{filter:blur(20px);z-index:1;background-position:50%;background-repeat:no-repeat;background-size:cover;transition:opacity .5s;position:absolute;inset:0}.content{z-index:2;width:100%;height:100%;position:relative}.fade-in{animation:1s forwards fadeUp}.movie-input input[type=number],.movie-input textarea{box-sizing:border-box;resize:vertical;-webkit-backdrop-filter:blur(16px);width:150px;font-family:var(--BodyFont);color:#fff;background:#80808037;border:1px solid #111;border-radius:20px;padding:12px}.movie-input>form>button{color:#fff;cursor:pointer;background-color:#111;border:2px solid #fff;border-radius:30px;padding:12px 30px;font-size:18px;transition:all .3s}.movie-input>form{flex-direction:row;justify-content:center;align-items:center;gap:20px;width:100%;margin:auto;display:flex}.movie-input{padding-bottom:20px}@media screen and (width<=768px){.movie-input input{font-size:16px!important}.score{padding-bottom:20px}.content>h1{font-family:var(--HeaderFont);color:var(--text-h);letter-spacing:1.68px;margin:10px;font-size:56px}}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}