.app__container{height:auto;width:320px;display:flex;padding:2rem 1rem 1.5rem;flex-direction:column;justify-content:center;align-items:center;border-radius:20px;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background-color:#ffffffbf}.lottie{height:auto}.app__onomatopoeia{margin-top:var(--size-xl);color:#8597cf}.app__title{color:#8597cf;font-size:var(--size-base)}.app__btnContainer{height:auto;width:100%;display:flex;justify-content:center;gap:var(--size-xxs)}.btn{height:var(--size-5xl);width:auto;padding:0;display:flex;align-items:center;justify-content:center;color:#f0f8ff;font-size:var(--size-base);border:1px solid black;border-radius:10px;text-decoration:none;background-color:#b2c7da}.btn:hover{background-color:#79bffd}.btn-home{margin-top:var(--size-5xl);padding-inline:1rem}.app__svg{width:var(--size-3xl)}.scanner__container{height:auto;width:18.75rem;margin:0 auto;padding:1rem;border-radius:20px;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background-color:#ffffffbf;box-shadow:0 .6px 3.1px #00000020,0 5px 25px #00000040}.scan-title{font-size:var(--size-2xl);margin-bottom:var(--size-xxs);text-align:center}.qrReader__data{margin-top:1rem;text-align:center}.qr-scanner__btns{display:grid;margin-top:var(--size-xl);grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:.8rem}.btn-scan{grid-column:span 2}.result__container{position:relative;width:90dvw;height:auto;padding:1rem;display:flex;align-items:center;flex-direction:column;border-radius:20px;box-shadow:0 2.6px 3.1px #00000020,0 21px 25px #00000040;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background-color:#ffffffbf}.btn-result{position:absolute;top:300px;right:var(--size-base)}.fieldset-top{margin-top:var(--size-3xl)}.result__img{max-width:20rem;max-height:20rem;border-radius:50%;aspect-ratio:1/1}.result__likesDislikes{width:100%;display:flex;flex-direction:column;gap:1rem}.btn-result{padding-inline:1rem;margin:1rem 0;margin-left:auto}fieldset{width:100%;margin-top:20px;padding:25px;color:var(--clr-dark);border:2px solid #ccc;border-radius:5px}legend{position:relative;top:-12px;padding:0 18px;border:2px solid #ccc;border-bottom:0;border-radius:5px 5px 0 0}legend span{position:relative;top:8px}.birthday-wrapper{width:90dvw;height:auto;display:flex;align-items:center;flex-direction:column;border-radius:20px;box-shadow:0 2.6px 3.1px #00000020,0 21px 25px #00000040;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background-color:#ffffffbf}.birthday-wrapper p:nth-of-type(1){padding-inline:.5rem;background-color:pink}.birthday-wrapper p:nth-of-type(3){width:30ch;text-align:center;font-size:14px}.birthday-wrapper p:nth-of-type(4){margin-bottom:.5rem;background-color:#c0f8ff}.birthday-wrapper p:nth-of-type(n+5):nth-of-type(-n+12){text-align:center;font-size:14px}.birthday-wrapper p:nth-of-type(13){margin-bottom:.5rem;background-color:#fdc0ff}.birthday-wrapper p:nth-of-type(n+14):nth-of-type(-n+23){text-align:center;font-size:14px}.birthday__title{width:100%;padding:1rem;border-radius:20px 20px 0 0;text-align:center;background-color:#383030;color:pink}.birthday__picture-wrapper{max-width:400px;padding:1rem}.birthday__picture{width:100%;padding:1rem;border:1px dashed black}.birthday__footer{width:100%;padding:1rem;border-radius:0 0 20px 20px;text-align:center;background-color:#383030;color:pink}.smol-album{width:100%;height:auto;display:grid;padding:1rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));grid-template-rows:1fr 1fr 1fr 1fr;place-items:center;row-gap:1rem;column-gap:1rem}.thumbnail{max-width:100%;height:100%;aspect-ratio:1/1;border-radius:20px;background-color:bisque;object-fit:cover;cursor:pointer}.album-text-wrapper{display:flex;justify-content:center;align-items:center}.album-text{width:14ch;text-align:center;color:#2e77fd;background-color:#fff0!important}.gif{width:380px;padding:1rem}.wish{width:30ch;text-align:center}.author{position:absolute;right:.625rem;margin-top:1.875rem;display:inline-block;text-align:right}.poem{text-align:center}.image-preview{position:fixed;display:none;width:100%;height:100dvh;top:0;left:0;justify-content:center;align-items:center;background-color:#000000e6;cursor:pointer}.pop-preview{max-width:100%;max-height:100%;margin:auto;display:block}@media (min-width: 400px){.result__likesDislikes{flex-direction:row;gap:1rem}}@media (min-width: 768px){.smol-album{width:37.5rem}}@media (min-width: 1280px){.result__container{width:70dvw;padding:3rem}.btn-result{top:var(--size-5xl);right:var(--size-5xl)}.birthday-wrapper{width:70dvw;padding:3rem}}.generator__container{height:auto;width:18.75rem;margin:0 auto;padding:1rem;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:20px;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);background-color:#ffffff80;box-shadow:0 .6px 3.1px #00000020,0 5px 25px #00000040}.generator__container h1{font-size:var(--size-2xl);margin-bottom:var(--size-xxs)}.generator__input{width:100%;margin-top:var(--size-l)}.qr-code__contianer{display:flex;flex-direction:column}.qr-code{width:100%;height:100%;padding:3rem;border-radius:10px;background-color:#4378e9}.qr-code__btns{display:grid;grid-template-columns:1fr 1fr;column-gap:.8rem}.btn-genet{margin-top:var(--size-xl)}*{margin:0;padding:0;box-sizing:border-box}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;--clr-dark: black;--clr-light: #fffffe;--clr-primary: hsl(212, 56%, 80%);--clr-secondary: rgb(84, 84, 105);--clr-tertiary: hsla(238, 46%, 23%, 1);--clr-rose: rgb(240, 54, 54);--clr-highlight: hsla(59, 100%, 50%, 1);--size-xxs: .5rem;--size-xs: .75rem;--size-s: .875rem;--size-base: 1rem;--size-l: 1.125rem;--size-xl: 1.25rem;--size-2xl: 1.5rem;--size-3xl: 1.875rem;--size-4xl: 2.25rem;--size-5xl: 3rem;--size-6xl: 3.75rem;--size-7xl: 4.5rem;--size-8xl: 6rem;--size-9xl: 8rem;--size-10xl: 10rem}body{width:100%;height:auto;min-height:100dvh;padding:1rem;display:flex;justify-content:center;align-items:center;background:url(/images/assets/patternpad.jpeg);background-color:var(--clr-primary)}section{margin-top:var(--size-3xl)}h1,h2,h3,p{color:#000}input{padding:1rem;background-color:var(--clr-secondary);border-radius:10px;color:var(--clr-light)}input::placeholder{color:#f0f8ff}