*,:before,:after{box-sizing:border-box}body{margin:0}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{color:#fff;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:#111;width:100%;height:100%;font-family:Segoe UI,system-ui,sans-serif;overflow:hidden}.app{width:100vw;height:100vh;display:flex;overflow:hidden}.screen{flex-direction:column;justify-content:center;align-items:center;gap:clamp(16px,3vh,40px);width:100%;height:100%;padding:clamp(20px,4vh,48px) clamp(20px,4vw,48px);display:flex;overflow:hidden}.kiosk-scene{width:100%;height:100%;display:flex;overflow:hidden}.kiosk-body{background:linear-gradient(160deg,#f0ebe3 0%,#dbd3c7 100%);flex-direction:column;align-items:center;gap:clamp(10px,1.8vh,24px);width:100%;height:100%;padding:clamp(12px,2vh,32px) clamp(16px,2.5vw,48px);display:flex;overflow:hidden}.kiosk-meta{flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:0 2px;display:flex}.kiosk-initiative{color:#1e1810;letter-spacing:-.4px;text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:clamp(7px,1vw,11px);min-width:0;font-size:clamp(15px,2.4vw,26px);font-weight:800;line-height:1.2;display:flex;overflow:hidden}.kiosk-initiative:before{content:"";background:#2e7d32;border-radius:50%;flex-shrink:0;width:clamp(8px,1.2vw,12px);height:clamp(8px,1.2vw,12px);display:block;box-shadow:0 0 8px #2e7d3299}.kiosk-step{color:#1e181066;letter-spacing:1.5px;white-space:nowrap;background:#00000012;border-radius:999px;flex-shrink:0;padding:4px 10px;font-family:Courier New,monospace;font-size:clamp(11px,1.6vw,17px);font-weight:700}.kiosk-lcd{text-align:center;background:#061006;border:4px solid #1a1a1a;border-radius:clamp(8px,1.2vw,14px);flex-shrink:0;width:100%;padding:clamp(14px,2vh,28px) clamp(18px,3vw,40px);box-shadow:inset 0 3px 16px #000000e6,0 2px #ffffff1a,0 4px 20px #00000040}.kiosk-lcd-text{color:#a8e6a0;letter-spacing:clamp(1px,.4vw,4px);text-transform:uppercase;text-shadow:0 0 12px #64e664bf,0 0 24px #64e6644d;font-family:Courier New,monospace;font-size:clamp(20px,3.8vw,42px);font-weight:700;line-height:1.35;display:block}@keyframes question-enter{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes question-exit{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-24px)}}.kiosk-body--enter{animation:.38s cubic-bezier(.22,1,.36,1) both question-enter}.kiosk-body--exit{pointer-events:none;animation:.22s ease-in both question-exit}.kiosk-panel{background:linear-gradient(#c8c0b4 0%,#b0a898 100%);border-radius:clamp(10px,2vw,20px);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:clamp(8px,1.5vh,24px);width:100%;min-height:0;padding:clamp(12px,2vh,32px) clamp(12px,2vw,32px) clamp(10px,1.5vh,24px);display:flex;overflow:hidden;box-shadow:inset 0 3px 8px #00000040,inset 0 -2px 4px #ffffff40}.face-row{flex:1;justify-content:center;align-items:center;gap:clamp(10px,4vw,60px);width:100%;min-height:0;display:flex}.face-slot{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:clamp(6px,1.2vh,14px);min-width:0;display:flex}.face-btn{cursor:pointer;-webkit-user-select:none;user-select:none;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:min(28vw,46vh,320px);height:min(28vw,46vh,320px);padding:min(2.5vw,4vh,32px);transition:transform 80ms,box-shadow 80ms;display:flex;position:relative;overflow:hidden}.face-btn:active{transform:translateY(6px);box-shadow:var(--active-shadow)!important}.face-gloss{filter:blur(8px);pointer-events:none;background:#ffffff73;border-radius:50%;width:38%;height:30%;position:absolute;top:10%;left:15%}.face-svg{z-index:1;width:100%;height:100%;position:relative}.face-label{color:#1e1810;text-transform:uppercase;letter-spacing:2px;white-space:nowrap;margin-top:clamp(6px,1.2vh,14px);font-size:clamp(14px,min(2.2vw,2.6vh),26px);font-weight:800}.kiosk-nfc{flex-shrink:0;justify-content:center;display:flex}.nfc-ring{background:#0000001f;border:2px solid #00000038;border-radius:50%;justify-content:center;align-items:center;width:clamp(36px,6vh,64px);height:clamp(36px,6vh,64px);display:flex;box-shadow:inset 0 2px 5px #00000040}.nfc-icon{color:#0006;letter-spacing:-1px;font-size:clamp(9px,1.4vw,14px);font-weight:700}.record-screen{gap:0;padding:0}.record-idle{flex-direction:column;justify-content:center;align-items:center;gap:clamp(16px,3vh,40px);width:100%;height:100%;padding:clamp(20px,4vh,56px) clamp(20px,5vw,60px);display:flex;overflow:hidden}.record-idle-title{text-align:center;letter-spacing:-.5px;font-size:clamp(26px,4.5vw,52px);font-weight:700}.record-choice-row{flex-wrap:wrap;justify-content:center;align-items:stretch;gap:clamp(24px,5vw,56px);width:100%;display:flex}.record-choice-btn{cursor:pointer;-webkit-user-select:none;user-select:none;color:#fff;background:#ffffff0f;border-radius:28px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:clamp(12px,2vh,28px);max-width:clamp(180px,40vw,360px);padding:clamp(20px,4vh,60px) clamp(24px,6vw,80px);transition:transform .15s,background .15s,border-color .15s;display:flex}.record-choice-btn:active{transform:scale(.96)}.record-choice-yes{border:3px solid #4fc3f7}.record-choice-yes:hover{background:#4fc3f71a}.record-choice-no{border:3px solid #fff3}.record-choice-no:hover{background:#ffffff1a}.record-choice-icon{font-size:clamp(64px,13vw,120px);line-height:1}.record-choice-label{letter-spacing:.5px;text-align:center;font-size:clamp(18px,3vw,32px);font-weight:700}.record-privacy-note{color:#ffffff73;text-align:center;letter-spacing:.1px;max-width:480px;font-size:clamp(12px,1.8vw,16px);line-height:1.5}.record-active{flex-direction:column;justify-content:center;align-items:center;gap:clamp(16px,3vh,40px);width:100%;height:100%;padding:clamp(20px,4vh,56px) clamp(20px,5vw,64px);display:flex;overflow:hidden}.recording-label{color:#ff5c5c;text-align:center;font-size:clamp(24px,4vw,44px);font-weight:700;animation:1s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.audio-bars{align-items:flex-end;gap:clamp(5px,1vw,10px);height:clamp(64px,14vw,120px);display:flex}.bar{background:#4fc3f7;border-radius:5px;width:clamp(10px,2vw,18px);min-height:10px}.silence-countdown{color:#ffb74d;text-align:center;font-size:clamp(15px,2.5vw,24px)}.stop-btn{color:#ff5c5c;cursor:pointer;letter-spacing:.5px;background:#ff5c5c1a;border:3px solid #ff5c5c;border-radius:20px;width:100%;max-width:520px;padding:clamp(20px,3vw,32px);font-size:clamp(18px,3vw,28px);font-weight:700;transition:background .12s,transform .12s}.stop-btn:hover{background:#ff5c5c33}.stop-btn:active{transform:scale(.97)}.record-done{flex-direction:column;justify-content:center;align-items:center;gap:clamp(16px,3vh,36px);width:100%;height:100%;padding:clamp(20px,4vh,56px) clamp(20px,5vw,64px);display:flex;overflow:hidden}.done-check{color:#66bb6a;font-size:clamp(80px,16vw,140px);line-height:1;animation:.4s fadeInUp}.done-title{text-align:center;font-size:clamp(26px,4.5vw,48px);font-weight:700;animation:.4s .1s both fadeInUp}.record-done .btn{border-radius:20px;max-width:520px;padding:clamp(20px,3vw,32px);font-size:clamp(18px,3vw,28px)}.record-actions{flex-direction:column;align-items:center;gap:16px;width:100%;max-width:400px;display:flex}.btn{cursor:pointer;letter-spacing:.5px;border:none;border-radius:16px;width:100%;padding:18px 32px;font-size:clamp(16px,2.5vw,22px);font-weight:700;transition:transform .15s,opacity .15s}.btn:active{transform:scale(.97)}.btn-primary{color:#000;background:#4fc3f7}.btn-primary:hover{opacity:.9}.btn-secondary{color:#ffffffb3;background:#ffffff1a;border:2px solid #ffffff26}.btn-secondary:hover{background:#ffffff29}.thank-body{justify-content:center;align-items:center;gap:clamp(20px,4vh,48px)}@keyframes thankPop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.thank-text{text-align:center;flex-direction:column;gap:clamp(8px,1.5vh,16px);animation:.4s .2s both fadeInUp;display:flex}.thank-title{color:#1e1810;letter-spacing:-1px;font-size:clamp(36px,7vw,80px);font-weight:900;line-height:1}.thank-subtitle{color:#5a5248;font-size:clamp(15px,2.5vw,28px);font-weight:500}.thank-check{color:#2e7d32;font-size:clamp(80px,16vmin,160px);font-weight:900;line-height:1;animation:.5s cubic-bezier(.34,1.56,.64,1) both thankPop}.thank-progress-bar{background:#0000001f;border-radius:999px;width:min(80%,480px);height:6px;animation:.4s .3s both fadeInUp;overflow:hidden}.thank-progress-fill{background:#2e7d32;border-radius:999px;width:100%;height:100%;animation:2.5s linear forwards drainProgress}.thank-progress-fill--error{background:#ef5350}@keyframes drainProgress{0%{width:100%}to{width:0%}}.thank-saving{flex-direction:column;align-items:center;gap:clamp(16px,3vh,32px);display:flex}.thank-saving-text{color:#5a5248;font-size:clamp(16px,2.5vw,26px);font-weight:500}.thank-spinner{border:5px solid #0000001a;border-top-color:#2e7d32;border-radius:50%;width:clamp(48px,8vmin,72px);height:clamp(48px,8vmin,72px);animation:.8s linear infinite spin}.thank-error-icon{font-size:clamp(64px,12vmin,120px);line-height:1;animation:.4s both thankPop}.thank-error-msg{color:#b91c1c;text-align:center;font-size:clamp(16px,2.5vw,24px);font-weight:500;animation:.4s .1s both fadeInUp}.error-msg{color:#ef5350;text-align:center;font-size:clamp(16px,2.5vw,22px)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.waiting-panel{text-align:center;justify-content:center;gap:clamp(16px,2.5vw,28px);position:relative}.waiting-header{flex-direction:column;align-items:center;gap:clamp(18px,3vh,34px);padding:0 clamp(8px,1.5vw,20px);display:flex}.waiting-header .waiting-icon{font-size:clamp(72px,12vw,120px)}.waiting-header .waiting-title{font-size:clamp(24px,4vw,38px)}.waiting-header .waiting-subtitle{max-width:520px;font-size:clamp(16px,2.4vw,24px)}.waiting-icon{font-size:clamp(56px,10vw,90px);line-height:1;animation:2s ease-in-out infinite waiting-pulse}@keyframes waiting-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.95)}}.waiting-title{color:#1e1810;text-transform:uppercase;letter-spacing:1px;font-size:clamp(18px,3vw,28px);font-weight:700}.waiting-subtitle{color:#5a5046;max-width:380px;font-size:clamp(13px,2vw,18px)}.kiosk-logo{justify-content:center;display:flex;position:absolute;bottom:clamp(10px,2vh,24px);left:50%;transform:translate(-50%)}.kiosk-logo-image{object-fit:contain;width:min(20vw,100px);height:auto;max-height:14vh}.waiting-blink{animation:1.8s step-end infinite blink}.waiting-qr{flex-direction:column;align-items:center;gap:8px;margin:16px 0 8px;display:flex}.waiting-qr-canvas{border-radius:12px;box-shadow:0 4px 20px #0006}.waiting-device-id{color:#888;letter-spacing:2px;font-family:monospace;font-size:13px}@keyframes blink{0%,to{opacity:1}50%{opacity:.25}}.fs-overlay{z-index:9999;cursor:pointer;-webkit-backdrop-filter:blur(4px);background:#000000b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.fs-prompt{color:#fff;text-align:center;flex-direction:column;align-items:center;gap:1rem;animation:.4s both fadeInUp;display:flex}.fs-icon{opacity:.9;font-size:clamp(48px,10vmin,96px);line-height:1}.fs-prompt p{opacity:.85;letter-spacing:.5px;font-size:clamp(16px,3vmin,28px);font-weight:600}.choice-screen{gap:48px}.choice-title{text-align:center;font-size:clamp(24px,4.5vw,48px);font-weight:700}.choice-row{flex-wrap:wrap;justify-content:center;gap:clamp(24px,6vw,64px);display:flex}.choice-btn{cursor:pointer;-webkit-user-select:none;user-select:none;color:#fff;background:#ffffff0f;border:3px solid #ffffff26;border-radius:28px;flex-direction:column;align-items:center;gap:16px;padding:clamp(28px,5vw,56px) clamp(36px,7vw,80px);transition:transform .15s,background .15s,border-color .15s;display:flex}.choice-btn:hover{background:#ffffff1f}.choice-btn:active{transform:scale(.96)}.choice-yes{border-color:#4fc3f7}.choice-no{border-color:#ffffff40}.choice-icon{font-size:clamp(52px,10vw,100px);line-height:1}.choice-label{letter-spacing:.5px;font-size:clamp(16px,2.5vw,26px);font-weight:600}.spinner{border:5px solid #ffffff26;border-top-color:#4fc3f7;border-radius:50%;width:56px;height:56px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}