@import"https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css";*{padding:0;margin:1%;box-sizing:border-box}@keyframes shake{0%{transform:translate(0)}25%{transform:translate(-5px)}50%{transform:translate(5px)}75%{transform:translate(-5px)}to{transform:translate(0)}}.shake{animation:shake .5s ease-in-out}.option{margin:1rem;display:flex;align-items:center;background-color:#4caf50;border:none;color:#fff;padding:12px 24px;text-align:center;font-size:16px;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 8px #0003;max-width:200px;max-height:50px;box-sizing:border-box}.option:hover{background-color:#45a049;box-shadow:0 6px 12px #0000004d;transform:translateY(-2px)}.button-group{display:flex;justify-content:center;gap:10px}.button-group button{padding:10px 20px;border-radius:8px}.option:active{background-color:#3e8e41;transform:translateY(2px)}.option.selected{background-color:plum}.option img{width:25px;height:auto;margin-right:10px}.option span{font-weight:500}.tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background-color:#333;color:#fff;padding:8px 12px;border-radius:4px;font-size:14px;white-space:nowrap;box-shadow:0 2px 10px #0000001a;transition:opacity .3s ease;opacity:1}.tooltip:before{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:#333 transparent transparent transparent}.input-group{display:flex;align-items:center;margin-bottom:15px}.input-group input{width:100%;border:2px solid #ccc;border-radius:8px;font-size:16px;outline:none;transition:border-color .3s ease,box-shadow .3s ease;box-sizing:border-box;text-align:center}.input{display:flex;justify-content:center;width:100%;max-width:400px;height:50px;margin:20px auto;padding:10px;box-sizing:border-box}.input input{width:100%;padding:12px 20px;border:2px solid #ccc;border-radius:8px;font-size:16px;outline:none;transition:border-color .3s ease,box-shadow .3s ease;box-sizing:border-box}.input.email{width:100%;max-width:400px;height:50px;margin:20px auto;padding:10px;box-sizing:border-box}.input input::-moz-placeholder{color:#999;font-style:italic}.input input::placeholder{color:#999;font-style:italic}.input input:focus{border-color:#1e90ff;box-shadow:0 0 8px #1e90ff4d}.color-picker-label{display:flex;align-items:center;font-size:1rem;font-weight:700;color:#333;margin-bottom:10px}.color-picker-label:before,.color-picker-label:after{content:"";display:inline-block;width:20px;height:2px;background-color:#888;margin:0 10px}.color-picker-input{border:none;padding:1%;background-color:transparent;cursor:pointer}#qr{width:70%;height:50%}.qr-container{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:600px;margin:0 auto;padding:20px;background-color:#f9f9f9;border-radius:8px;box-shadow:0 2px 10px #0000001a}.container{display:flex;justify-content:space-between;align-items:flex-start;padding:20px}.left-component{background-color:#f7f7f7;border:1px solid #ddd;border-radius:8px;padding:20px;box-shadow:0 2px 5px #0000001a;width:48%}.qr-preview{background-color:#fff;border:1px solid #ddd;border-radius:8px;padding:20px;box-shadow:0 2px 5px #0000001a;width:48%}@media (max-width: 768px){.container,.button-group{flex-direction:column;align-items:center;width:100%}.left-component,.qr-preview,.option{width:90%;margin-top:20px}}.grid-container{display:grid;grid-template-columns:auto auto auto;background-color:#b1b1b1;padding:10px;width:50%}.grid-item{background-color:#fffc;border:1px solid rgba(0,0,0,.8);padding:20px;font-size:30px;text-align:center}