@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css";*{margin:0;padding:0;box-sizing:border-box}:root{--cert-gradient-start: #73667F;--cert-gradient-end: #3F3C61;--cert-bg-dark: #1a1625;--glass-bg: rgba(255, 255, 255, .08);--glass-border: rgba(255, 255, 255, .15);--glass-shadow: rgba(0, 0, 0, .2);--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .7);--text-muted: rgba(255, 255, 255, .5);--success-color: #4ade80;--error-color: #f87171;--transition-fast: .15s;--transition-normal: .3s;--transition-slow: .5s}html{background-color:#3f3c61}html,body,#root{width:100%;height:100%;overflow:hidden;margin:0;padding:0}body{font-family:Pretendard Variable,Pretendard,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#3f3c61;color:var(--text-primary)}.app-container{position:relative;width:100%;min-height:100vh;min-height:100dvh;overflow:hidden;display:flex;flex-direction:column}.gradient-background{position:fixed;inset:0;top:-50vh;bottom:-50vh;background:linear-gradient(165deg,var(--cert-gradient-start) 0%,var(--cert-gradient-end) 50%,var(--cert-bg-dark) 100%);z-index:0}.stars-container{position:fixed;inset:0;top:-50vh;bottom:-50vh;overflow:hidden;z-index:1}.star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;animation:twinkle var(--duration, 3s) ease-in-out infinite;animation-delay:var(--delay, 0s)}@keyframes twinkle{0%,to{opacity:var(--min-opacity, .2);transform:scale(1)}50%{opacity:var(--max-opacity, .8);transform:scale(1.2)}}.shooting-star{position:absolute;top:var(--start-y, -5%);right:-100px;width:80px;height:2px;background:linear-gradient(to left,transparent 0%,rgba(255,255,255,.05) 20%,rgba(255,255,255,.3) 60%,rgba(255,255,255,.8) 90%,rgba(255,255,255,1) 100%);transform:rotate(-45deg);transform-origin:left center;animation:shootFall var(--duration, 2s) linear infinite;animation-delay:var(--delay, 0s);opacity:0}.shooting-star:before{content:"";position:absolute;left:-3px;top:50%;transform:translateY(-50%);width:5px;height:5px;background:#fff;border-radius:50%;box-shadow:0 0 6px 2px #ffffffe6,0 0 10px 3px #fff6}@keyframes shootFall{0%{transform:rotate(-45deg) translate(0);opacity:0}5%{opacity:1}80%{opacity:.5}to{transform:rotate(-45deg) translate(-120vw);opacity:0}}.content-layer{position:relative;z-index:10;width:100%;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom));padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}.glass-card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:24px;padding:32px;box-shadow:0 8px 32px var(--glass-shadow),inset 0 1px #ffffff1a}.glass-input{width:100%;background:#ffffff0d;border:1px solid var(--glass-border);border-radius:16px;padding:16px 20px;font-size:16px;color:var(--text-primary);outline:none;transition:border-color var(--transition-fast),background var(--transition-fast);font-family:inherit}.glass-input::placeholder{color:var(--text-muted)}.glass-input:focus{border-color:#ffffff4d;background:#ffffff14}.glass-button{width:100%;background:#ffffff1f;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:16px 24px;font-size:14px;font-weight:500;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.glass-button:hover:not(:disabled){background:#ffffff2e;border-color:#ffffff4d;transform:translateY(-1px)}.glass-button:active:not(:disabled){transform:translateY(0)}.glass-button:disabled{opacity:.4;cursor:not-allowed}.glass-button.primary{background:#fff3}.code-input-container{display:flex;gap:8px;justify-content:center}.code-input{width:44px;height:56px;background:#ffffff0d;border:1px solid var(--glass-border);border-radius:14px;font-size:22px;font-weight:600;text-align:center;color:var(--text-primary);outline:none;transition:all var(--transition-fast);font-family:inherit}.code-input:focus{border-color:#fff6;background:#ffffff1a;transform:scale(1.05)}.country-selector{display:flex;align-items:center;gap:12px;padding:14px 20px;background:#ffffff0d;border:1px solid var(--glass-border);border-radius:16px;cursor:pointer;transition:all var(--transition-fast)}.country-selector:hover{background:#ffffff14}.country-flag{font-size:20px}.country-info{flex:1;font-size:14px}.country-arrow{opacity:.6}.cert-logo{font-size:32px;font-weight:700;letter-spacing:-.02em;margin-bottom:8px}.cert-logo-small{font-size:20px;font-weight:600;letter-spacing:-.01em}.brand-logo{height:28px;width:auto;object-fit:contain}.brand-logo-small{height:20px;width:auto;object-fit:contain}.brand-logo-large{height:36px;width:auto;object-fit:contain}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.back-button{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.back-button:hover{background:#ffffff1a;color:var(--text-primary)}.passkey-info-box{display:flex;gap:12px;padding:16px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:14px;text-align:left}.passkey-info-icon{flex-shrink:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#4ade801a;border-radius:8px;color:var(--success-color)}.passkey-info-text{flex:1;min-width:0}.passkey-info-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.passkey-info-desc{font-size:11px;line-height:1.5;color:var(--text-muted)}.passkey-create-info{display:flex;flex-direction:column;gap:12px;padding:20px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:16px;max-width:300px}.passkey-create-info-item{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text-secondary)}.passkey-create-info-item svg{flex-shrink:0;color:var(--success-color)}.cert-app-section{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:40px;text-align:center}.cert-app-desc{max-width:260px}.cert-app-desc-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:6px}.cert-app-desc-text{font-size:12px;line-height:1.5;color:var(--text-muted)}.cert-app-link{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:24px;color:var(--text-secondary);font-size:13px;font-weight:500;text-decoration:none;transition:all var(--transition-fast)}.cert-app-link:hover{background:#ffffff1a;color:var(--text-primary);border-color:#fff3}.status-text{font-size:14px;color:var(--text-secondary)}.status-text.loading{display:flex;align-items:center;gap:8px}.loading-dots{display:flex;gap:4px}.loading-dot{width:6px;height:6px;background:var(--text-secondary);border-radius:50%;animation:pulse 1.4s ease-in-out infinite}.loading-dot:nth-child(2){animation-delay:.2s}.loading-dot:nth-child(3){animation-delay:.4s}@keyframes pulse{0%,80%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--text-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.checkmark-circle{width:80px;height:80px;border-radius:50%;background:var(--success-color);display:flex;align-items:center;justify-content:center;animation:scaleIn .4s cubic-bezier(.175,.885,.32,1.275)}.checkmark{width:36px;height:36px;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;fill:none}.checkmark-path{stroke-dasharray:48;stroke-dashoffset:48;animation:drawCheck .4s ease-out .2s forwards}@keyframes scaleIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes drawCheck{to{stroke-dashoffset:0}}.fade-enter{opacity:0;transform:translateY(10px)}.fade-enter-active{opacity:1;transform:translateY(0);transition:opacity var(--transition-normal),transform var(--transition-normal)}.fade-exit{opacity:1;transform:translateY(0)}.fade-exit-active{opacity:0;transform:translateY(-10px);transition:opacity var(--transition-normal),transform var(--transition-normal)}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}.shake{animation:shake .5s ease-in-out}.completion-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;text-align:center}.completion-title{font-size:24px;font-weight:600}.completion-subtitle{font-size:15px;color:var(--text-secondary)}.completion-info{margin-top:16px;padding:20px 32px;background:#ffffff0d;border-radius:16px}.store-name{font-size:16px;font-weight:500}.usage-time{font-size:13px;color:var(--text-muted);margin-top:4px}.passkey-icon{width:64px;height:64px;stroke:var(--text-primary);stroke-width:1.5;fill:none}.text-center{text-align:center}.text-sm{font-size:13px}.text-muted{color:var(--text-muted)}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mb-8{margin-bottom:8px}.mb-16{margin-bottom:16px}.gap-8{gap:8px}.gap-16{gap:16px}.w-full{width:100%}.qr-display-container{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;padding:20px}.qr-circle-container{position:relative;margin-bottom:32px}.qr-circle-bg{width:280px;height:280px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 20px 60px #0000004d,0 0 0 1px #ffffff1a}.qr-dots-wrapper{display:flex;align-items:center;justify-content:center}.qr-dots-wrapper svg{width:200px;height:200px}.qr-hidden-state{background:#ffffff1a;color:var(--text-muted);flex-direction:column;gap:12px}.qr-hidden-state svg{stroke:var(--text-muted)}.qr-scan-text{font-size:15px;color:var(--text-secondary);margin-bottom:24px}.qr-mini-timer{width:120px}.qr-mini-timer-bar{width:100%;height:2px;background:#ffffff1a;border-radius:1px;overflow:hidden}.qr-mini-timer-progress{height:100%;background:#fff6;border-radius:1px;transition:width 1s linear}.reset-button{margin-top:48px;padding:10px 20px;background:transparent;border:1px solid rgba(255,255,255,.15);border-radius:20px;color:var(--text-muted);font-size:12px;cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.reset-button:hover{background:#ffffff0d;color:var(--text-secondary)}.auth-select-card{width:100%;max-width:360px;text-align:center}.auth-select-button{width:100%;display:flex;align-items:center;gap:16px;padding:18px 20px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:16px;cursor:pointer;transition:all var(--transition-fast);font-family:inherit;text-align:left}.auth-select-button:hover{background:#ffffff14;border-color:#fff3}.auth-select-button.primary{background:#ffffff14;border-color:#ffffff26}.auth-select-button.primary:hover{background:#ffffff1f;border-color:#ffffff40}.auth-select-icon{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#ffffff0f;border-radius:12px;color:var(--text-primary)}.auth-select-text{flex:1}.auth-select-title{font-size:15px;font-weight:500;color:var(--text-primary);margin-bottom:2px}.auth-select-desc{font-size:12px;color:var(--text-muted)}.auth-select-arrow{flex-shrink:0;color:var(--text-muted)}.auth-divider{display:flex;align-items:center;gap:16px;margin:20px 0;color:var(--text-muted);font-size:12px}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:#ffffff1a}.mb-4{margin-bottom:4px}.mb-12{margin-bottom:12px}.mb-32{margin-bottom:32px}.store-info-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:20px;font-size:12px}.store-name{color:var(--text-secondary);font-weight:500}.store-divider{color:var(--text-muted);opacity:.5}.store-type{color:var(--text-muted)}.qr-card{background:#ffffff0f;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:32px;margin-bottom:32px;position:relative;overflow:hidden}.qr-wrapper{padding:16px;background:#ffffff08;border-radius:16px;margin-bottom:20px}.qr-timer-container{display:flex;flex-direction:column;align-items:center;gap:8px}.qr-timer-bar{width:100%;height:3px;background:#ffffff1a;border-radius:2px;overflow:hidden}.qr-timer-progress{height:100%;background:linear-gradient(90deg,var(--success-color),#22c55e);border-radius:2px;transition:width 1s linear}.qr-timer-text{font-size:12px;color:var(--text-muted);font-variant-numeric:tabular-nums}.qr-hidden{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:232px;color:var(--text-muted)}.qr-instruction{display:flex;align-items:flex-start;gap:16px;padding:20px 24px;background:#ffffff0a;border-radius:16px;text-align:left;max-width:300px}.qr-instruction-icon{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#ffffff14;border-radius:12px}@keyframes qrRefresh{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.qr-refreshing{animation:qrRefresh .3s ease-out}@media(max-width:400px){.glass-card{padding:24px;border-radius:20px}.code-input{width:40px;height:52px;font-size:20px}.code-input-container{gap:6px}.qr-card{padding:24px;border-radius:24px}.qr-wrapper{padding:12px}.qr-instruction{padding:16px 20px}.qr-circle-bg{width:240px;height:240px}.qr-dots-wrapper svg{width:170px;height:170px}}.timer{font-size:13px;color:var(--text-muted);font-variant-numeric:tabular-nums}.timer.expired{color:var(--error-color)}.sms-resend-container{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:32px}.sms-timer-badge{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:20px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--text-secondary)}.sms-timer-badge svg{opacity:.7}.sms-timer-badge.expired{color:var(--error-color);border-color:#f8717133;background:#f8717114}.sms-resend-button{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:transparent;border:1px solid rgba(255,255,255,.15);border-radius:24px;color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.sms-resend-button:hover:not(:disabled){background:#ffffff0f;border-color:#ffffff40;color:var(--text-primary)}.sms-resend-button:disabled{opacity:.4;cursor:not-allowed}.sms-resend-button svg{flex-shrink:0}.sms-resend-button .loading-dots{margin-left:4px}.text-link{color:var(--text-secondary);text-decoration:none;font-size:13px;cursor:pointer;transition:color var(--transition-fast)}.text-link:hover{color:var(--text-primary)}.overlay{position:fixed;inset:0;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:100;display:flex;align-items:center;justify-content:center;animation:fadeIn var(--transition-normal)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.country-drawer{position:fixed;bottom:0;left:0;right:0;max-height:70vh;background:#1e1928f2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:24px 24px 0 0;z-index:101;animation:slideUp var(--transition-normal) cubic-bezier(.16,1,.3,1);overflow:hidden}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.drawer-header{padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.1)}.drawer-title{font-size:16px;font-weight:600}.drawer-content{max-height:calc(70vh - 60px);overflow-y:auto;padding:8px 0}.drawer-item{display:flex;align-items:center;gap:16px;padding:14px 24px;cursor:pointer;transition:background var(--transition-fast)}.drawer-item:hover{background:#ffffff0d}.drawer-item.selected{background:#ffffff1a}.drawer-item-flag{font-size:24px}.drawer-item-info{flex:1}.drawer-item-name{font-size:14px}.drawer-item-code{font-size:12px;color:var(--text-muted)}.form-label{font-size:12px;color:var(--text-muted);margin-bottom:10px;font-weight:500}.highlight{color:var(--text-primary);font-weight:500}
