@import"https://fonts.googleapis.com/css2?family=Preahvihear&family=Poppins:wght@400;700;900&display=swap";:root{--screen-padding: 2rem;--screen-padding-scrollable: 3rem 2rem;--radius-lg: 20px;--radius-md: 15px;--radius-sm: 10px;--button-padding-block: 1.5rem;--button-padding-inline: 4rem;--button-font-size: clamp(1rem, 1.35vw, 1.8rem)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#000;overflow-x:hidden;overflow-y:auto}#root{width:100vw;min-height:100vh;display:flex;align-items:center;justify-content:center}.screen{width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--screen-padding);color:#fff;text-align:center}.screen.scrollable{height:auto;min-height:100vh;justify-content:flex-start;overflow-y:auto;padding:var(--screen-padding-scrollable)}.screen h1{font-size:clamp(2.25rem,3.2vw,4rem);margin-bottom:1rem;line-height:1.12;text-shadow:2px 2px 8px rgba(0,0,0,.3)}.screen h2{font-size:clamp(1.6rem,2.2vw,2.5rem);margin-bottom:2rem;line-height:1.18;text-shadow:2px 2px 6px rgba(0,0,0,.2)}.screen p{font-size:clamp(1rem,1.35vw,1.5rem);margin-bottom:1rem;line-height:1.5;opacity:.9}button{background:#fff;color:#667eea;border:none;padding:var(--button-padding-block) var(--button-padding-inline);font-size:var(--button-font-size);font-weight:700;border-radius:3.125rem;cursor:pointer;transition:all .3s ease;box-shadow:0 8px 20px #0003;margin:1rem;min-height:2.4rem}button:hover{transform:translateY(-4px);box-shadow:0 12px 30px #0000004d}button:active{transform:translateY(-2px)}button.secondary{background:transparent;color:#fff;border:3px solid white}button.secondary:hover{background:#ffffff1a}.qr-container{background:#fff;padding:2rem;border-radius:var(--radius-lg);box-shadow:0 10px 40px #0000004d;margin:2rem 0}.qr-container img{width:min(100%,300px);height:auto;aspect-ratio:1;display:block}.countdown{font-size:clamp(5rem,12vw,15rem);font-weight:700;line-height:1;text-shadow:4px 4px 15px rgba(0,0,0,.5);animation:pulse 1s ease-in-out}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.camera-preview{width:80vw;max-width:1000px;height:60vh;background:#000;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 15px 50px #00000080;margin:2rem 0;position:relative}.camera-preview img{width:100%;height:100%;object-fit:contain}.progress-bar{width:60%;max-width:40rem;min-width:min(100%,16rem);height:1.875rem;background:#fff3;border-radius:.9375rem;overflow:hidden;margin:2rem 0}.progress-fill{height:100%;background:#fff;transition:width .3s ease;border-radius:.9375rem}.photo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(.75rem,1vw,1rem);max-width:600px;width:min(100%,600px);margin:2rem 0}.photo-slot{width:100%;max-width:280px;min-height:170px;aspect-ratio:14 / 10;background:#ffffff1a;border:3px dashed rgba(255,255,255,.3);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:clamp(1.75rem,2.6vw,3rem);position:relative}.photo-slot.captured{background:#fff3;border:3px solid rgba(255,255,255,.8)}.photo-slot.active{border-color:gold;animation:blink .5s ease-in-out infinite}@keyframes blink{0%,to{border-color:gold}50%{border-color:#ffd7004d}}.package-card{background:#fff;color:#667eea;padding:2rem;border-radius:var(--radius-lg);margin:1rem;min-width:min(100%,18.75rem);cursor:pointer;transition:all .3s ease;box-shadow:0 8px 20px #0003}.package-card:hover{transform:translateY(-8px);box-shadow:0 15px 40px #0000004d}.package-card.selected{border:4px solid #ffd700;background:#fff8dc}.package-card h3{font-size:clamp(1.4rem,1.8vw,2rem);margin-bottom:1rem}.package-card .price{font-size:clamp(1.2rem,1.6vw,1.8rem);font-weight:700;color:#764ba2}.tutorial-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,1.5vw,2rem);max-width:1000px;margin:2rem 0}.tutorial-step{background:#ffffff1a;padding:2rem;border-radius:var(--radius-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tutorial-step .number{font-size:clamp(2rem,2.6vw,3rem);font-weight:700;color:gold;margin-bottom:1rem}.tutorial-step h3{font-size:clamp(1.2rem,1.5vw,1.8rem);margin-bottom:.5rem}.tutorial-step p{font-size:clamp(.95rem,1vw,1.2rem)}.camera-animation{width:clamp(130px,16vw,200px);height:clamp(130px,16vw,200px);margin:2rem 0;animation:bounce 2s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.loading-spinner{width:clamp(72px,8vw,100px);height:clamp(72px,8vw,100px);border:10px solid rgba(255,255,255,.3);border-top:10px solid white;border-radius:50%;animation:spin 1s linear infinite;margin:2rem 0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-message{background:#f44;color:#fff;padding:1rem 2rem;border-radius:var(--radius-sm);margin:1rem 0;font-size:clamp(.95rem,1vw,1.2rem)}.success-message{background:#4f4;color:#333;padding:1rem 2rem;border-radius:var(--radius-sm);margin:1rem 0;font-size:clamp(.95rem,1vw,1.2rem);font-weight:700}.bypass-input{padding:1rem 1.5rem;font-size:clamp(1rem,1.2vw,1.5rem);border:3px solid white;border-radius:var(--radius-sm);background:#ffffffe6;margin:1rem 0;text-align:center;width:min(100%,300px)}.timer{font-size:clamp(1.15rem,1.6vw,2rem);background:#0000004d;padding:1rem 2rem;border-radius:var(--radius-sm);margin:1rem 0;font-weight:700}.result-image{max-width:90%;max-height:60vh;border-radius:var(--radius-md);box-shadow:0 15px 50px #0006;margin:2rem 0}.pulse-green{width:10px;height:10px;background-color:#10b981;border-radius:50%;box-shadow:0 0 #10b98166;animation:pulse-green 2s infinite}.pulse-red{width:10px;height:10px;background-color:#ef4444;border-radius:50%;animation:pulse-red 2s infinite}@keyframes pulse-green{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 10px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}@keyframes pulse-red{0%{transform:scale(.95);box-shadow:0 0 #ef4444b3}70%{transform:scale(1);box-shadow:0 0 0 10px #ef444400}to{transform:scale(.95);box-shadow:0 0 #ef444400}}@keyframes spinning{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinning{animation:spinning 2s linear infinite}@media (max-width: 1366px){:root{--screen-padding: 1.5rem;--screen-padding-scrollable: 2rem 1.5rem;--radius-lg: 18px;--radius-md: 14px;--radius-sm: 9px;--button-padding-block: 1rem;--button-padding-inline: 2.75rem}.screen{overflow-x:hidden}}@media (max-width: 1280px){:root{--screen-padding: 1.25rem;--screen-padding-scrollable: 1.75rem 1.25rem;--radius-lg: 16px;--radius-md: 12px;--radius-sm: 8px;--button-padding-block: .875rem;--button-padding-inline: 2.25rem}.photo-grid,.tutorial-steps{width:min(100%,100%)}.progress-bar{width:min(100%,32rem)}}@media (max-width: 1024px){:root{--screen-padding: 1rem;--screen-padding-scrollable: 1.5rem 1rem;--button-padding-block: .8rem;--button-padding-inline: 1.5rem}#root{width:100%;align-items:stretch}.screen{height:auto;min-height:100vh}.photo-grid,.tutorial-steps{grid-template-columns:1fr}.package-card{width:min(100%,24rem);min-width:0}.camera-preview{width:100%;height:auto;min-height:18rem}.progress-bar{width:100%;min-width:0}}