.App{width:100vw;height:100vh}.Container{min-height:100vh;display:flex;flex-direction:column;align-items:center;background:#0f4778;padding:20px}.home-content{text-align:center;animation:slideIn .8s ease-out}.home-start{width:25vw;height:25vw;background:transparent;margin-top:73vh}button{border:none}.select-bg-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:40px 20px}.select-bg-content{width:100%;text-align:center;animation:fadeIn .8s ease-out}.select-bg-title{font-size:clamp(2rem,4vw,3rem);font-weight:800;color:#fff;margin-bottom:50px;text-shadow:0 4px 20px rgba(0,0,0,.3);margin-top:23vw}.bg-grid{display:flex;flex-wrap:wrap;justify-content:center;column-gap:5vw;row-gap:5vw;margin-bottom:50px;padding:0 20px;width:100%}.bg-card{width:43vw;position:relative;border-radius:2vw;overflow:hidden;cursor:pointer;aspect-ratio:3/2;border:4px solid transparent}.bg-card.selected{border-color:#fff;box-shadow:0 15px 50px #fff6;transform:scale(1.05)}.bg-image{width:100%;object-fit:contain;display:block}.bg-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#0000004d;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.bg-card:hover .bg-overlay{opacity:1}.bg-card.selected .bg-overlay{opacity:1;background:#8a2be266}.check-mark{width:80px;height:80px;border-radius:50%;background:#fff;color:#8a2be2;font-size:50px;display:flex;align-items:center;justify-content:center;font-weight:700;animation:scaleIn .3s ease-out}.continue-btn{width:30vw;height:10vw;border-radius:30px;border:none;margin-top:8vw;background:linear-gradient(135deg,#8a2be2,#9b59b6);color:#fff;font-size:4.6vw;font-weight:700;cursor:pointer;box-shadow:0 8px 30px #8a2be266;transition:all .3s cubic-bezier(.4,0,.2,1);animation:slideUp .5s ease-out}.continue-btn:hover{transform:translateY(-3px);box-shadow:0 12px 40px #8a2be280}.continue-btn:active{transform:translateY(-1px)}@keyframes fadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.camera-list{position:absolute;top:60px;right:0;background:#fff;border-radius:10px;padding:10px 0;min-width:120px;box-shadow:0 4px 12px #00000026}.camera-option{display:block;width:100%;padding:8px 16px;background:none;border:none;text-align:left;cursor:pointer;font-size:14px;background-color:#639}.camera-option:hover{background:#f0f0f0}.camera-option.selected{background:#007bff;color:#fff}.camera-select{position:absolute;top:10px;left:10px;z-index:10}.camera-select select{padding:8px 12px;font-size:16px;border-radius:8px;background-color:#fff;border:1px solid #ccc;cursor:pointer}.camera-container{display:flex;justify-content:center;position:relative;z-index:1;margin-top:22vw}.camera-container .camera-box{height:60vw;object-fit:cover;object-position:center}.camera-container video{width:100%;height:100%}.camera-container .preview-img{height:60vw;object-fit:cover;object-position:center;position:relative}.camera-container .preview-img img{width:100%;height:100%;object-fit:cover}.countdown-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#4100f584 0% 0% no-repeat padding-box;opacity:.81;display:flex;align-items:center;justify-content:center;z-index:9999}.smile-overlay{animation:fadeOut .5s ease-out .3s forwards}.countdown-number{font-size:20vw!important;font-weight:700;color:#fff;position:relative;animation:countAnim 1s ease-in-out forwards}.click-text{font-size:50px;font-weight:700;color:#fff;margin-top:20px;animation:pulse .2s ease-in-out 3}@keyframes countAnim{0%{opacity:0;transform:scale(.5)}20%{opacity:1;transform:scale(1.2)}80%{opacity:1;transform:scale(1)}to{opacity:1;transform:scale(1)}}.click-btn{width:20vw;height:20vw;border-radius:50%;border:none;position:absolute;z-index:2;top:52vh;background:linear-gradient(135deg,#c90f37,#db031c);color:#fff;font-size:4vw;font-weight:700;cursor:pointer;box-shadow:0 8px 30px #8a2be266;transition:all .3s cubic-bezier(.4,0,.2,1);border:.4vw white solid}@keyframes slideIn{0%{opacity:0;transform:translate(-100px)}to{opacity:1;transform:translate(0)}}.retake-confirm{position:absolute;top:52vh;z-index:2;display:flex;justify-content:space-between;width:70%}.retake-confirm .retake,.confirm{width:30vw;height:10vw;border-radius:3vw;border:none;background:linear-gradient(135deg,#8a2be2,#9b59b6);color:#fff;font-size:4.6vw;font-weight:700;cursor:pointer;box-shadow:0 8px 30px #8a2be266;transition:all .3s cubic-bezier(.4,0,.2,1);animation:slideUp .5s ease-out;display:flex;align-items:center;justify-content:center}.final-img{width:80vw;margin-top:12vw}.final-img img{width:100%;object-fit:contain}.qr{padding:1vw;background-color:#fff;display:flex;justify-content:center;align-items:center;z-index:2;margin-top:4vw}.home-print{z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;width:70%;gap:2vw;margin-top:8vw}.home-print .home,.print{width:30vw;height:10vw;border-radius:3vw;border:none;background:linear-gradient(135deg,#8a2be2,#9b59b6);color:#fff;font-size:4.6vw;font-weight:700;cursor:pointer;box-shadow:0 8px 30px #8a2be266;transition:all .3s cubic-bezier(.4,0,.2,1);animation:slideUp .5s ease-out;display:flex;align-items:center;justify-content:center}.printAreaContainer{width:6in;height:4in;position:absolute;box-sizing:border-box;z-index:-1}.printAreaContainer img{width:100%;height:100%;display:block}.loader-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#e7eaf554;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .3s ease-out}.loader-content{text-align:center;animation:slideUp .5s ease-out}.spinner-container{position:relative;width:120px;height:120px;margin:0 auto 30px}.spinner{position:absolute;width:100%;height:100%;border:6px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}.spinner-inner{position:absolute;top:15px;left:15px;width:calc(100% - 30px);height:calc(100% - 30px);border:6px solid rgba(255,255,255,.2);border-bottom-color:#fff;border-radius:50%;animation:spin .7s linear infinite reverse}.loader-message{color:#fff;font-size:24px;font-weight:600;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;text-shadow:0 2px 10px rgba(0,0,0,.2);animation:pulse 1.5s ease-in-out infinite}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@media (max-width: 768px){.spinner-container{width:100px;height:100px}.loader-message{font-size:20px}}@media (max-width: 480px){.spinner-container{width:80px;height:80px}.loader-message{font-size:18px}}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;padding:0;height:100%;width:100%;overflow:hidden}