:root{--title: "Caveat", cursive;--body: "Exo 2", sans-serif;--c1: #bf0413;--c2: #f25c84;--c3: #8ababf;--c3_1: #8ababf9a;--c4: #f2cb05;--c5: #f29f05}h1{font-family:var(--title);text-align:center;text-transform:uppercase;color:var(--c1);font-weight:700;font-size:38px}h2{font-family:var(--body);text-align:center;text-transform:uppercase;color:var(--c1);font-weight:500;font-size:24px;margin:0 0 5px}.main-text{font-family:var(--body);text-align:center;width:auto;background-color:var(--c3_1);border-radius:5px;padding:10px}body{display:grid;place-items:center;height:100vh;background:linear-gradient(32deg,#8ababf,#f2cb05,#f29f05);background-size:contain;background-repeat:no-repeat}.container,.header{display:grid;place-items:center;width:350px;height:auto}.header img{width:50%;border-radius:50%;border:5px solid var(--c2)}.gift{width:170px;cursor:pointer;animation-name:move;animation-duration:.35s;animation-iteration-count:infinite;animation-direction:alternate-reverse;animation-timing-function:ease}@keyframes move{0%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}to{transform:rotate(-5deg)}}.btn-container{display:grid;width:100%;place-items:center;grid-template-columns:1fr 1fr;gap:8px}.btn{width:100%;padding:5px;font-family:var(--body);font-size:300;border:none;border-radius:8px}.btn:focus{background:var(--c2)}.btn:focus-visible{background:var(--c2)}.btn-next-container{width:100%;display:grid;place-items:center}.btn-next{margin-top:24px;width:250px;height:24px;border:none;border-radius:5px}.hint{font-family:var(--body);text-align:center;width:330px;height:auto;background-color:var(--c3_1);border-radius:5px;padding:10px;margin:0}.text-input{width:95%;height:24px;border-radius:5px;padding:2px 8px;border:none;text-align:center}.text-container{display:grid;width:100%;place-items:center;gap:8px}