.magicpin-container{max-width:400px;margin:0 auto;padding:16px;background:#fff;border-radius:8px;box-shadow:0 2px 8px rgb(0 0 0 / .1);position:relative}.magicpin-header{text-align:center;margin-bottom:10px}.magicpin-title{font-size:20px;font-weight:600;color:#333;margin:0;line-height:1.2}.magicpin-notice{padding:8px 10px;margin-bottom:-10px;border-radius:6px;font-size:13px;line-height:1.3}.magicpin-notice.success{background-color:#d4edda;border:1px solid #c3e6cb;color:#155724}.magicpin-notice.error{background-color:#f8d7da;border:1px solid #f5c6cb;color:#721c24}.magicpin-notice.info{background-color:#d1ecf1;border:1px solid #bee5eb;color:#0c5460}.magicpin-step{display:none}.magicpin-step.active{display:block;animation:magicpinFadeIn 0.3s ease-in-out}@keyframes magicpinFadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.magicpin-step-intro{font-size:14px;color:#555;margin-bottom:12px;text-align:center;line-height:1.3}.magicpin-form-group{margin-bottom:8px}.magicpin-label{display:block;font-size:13px;font-weight:500;color:#333;margin-bottom:6px;line-height:1.2}.magicpin-input{width:100%;padding:12px 14px;font-size:15px;border:1.5px solid #ddd;border-radius:6px;transition:all 0.2s ease;box-sizing:border-box;font-family:inherit;line-height:1.2}.magicpin-input:focus{outline:none;border-color:#d91c22;box-shadow:0 0 0 3px rgb(217 28 34 / .08)}.magicpin-input::placeholder{color:#999}.magicpin-phone-input{font-size:20px;font-weight:700;padding-left:100px!important;letter-spacing:10px;line-height:1.2}.magicpin-otp-input{font-size:28px;font-weight:700;text-align:center;letter-spacing:8px;padding:14px 12px;line-height:1.2}.magicpin-btn{width:100%;padding:0;font-size:15px;font-weight:600;border:none;border-radius:6px;cursor:pointer;transition:all 0.2s ease;font-family:inherit;display:flex;align-items:center;justify-content:center;text-align:center;height:50px;line-height:1}.magicpin-btn-primary{background-color:#d91c22;color:#fff;margin-top:24px}.magicpin-btn-primary:hover{background-color:#b91619;transform:translateY(-1px);box-shadow:0 3px 8px rgb(217 28 34 / .25)}.magicpin-btn-primary:active{transform:translateY(0)}.magicpin-btn-primary:disabled{background-color:#ccc;cursor:not-allowed;transform:none}.magicpin-btn-link{background:none;border:none;color:#d91c22;font-size:13px;cursor:pointer;padding:0;text-decoration:underline;margin-top:6px;display:flex;align-items:center;justify-content:center;height:50px;width:100%;font-weight:600;line-height:1;gap:0}.magicpin-btn-link:hover{color:#b91619}.magicpin-btn-link:disabled{color:#999;cursor:not-allowed;text-decoration:none}.magicpin-btn-back{display:block;margin-top:8px;text-align:center;font-size:13px;height:auto;padding:6px 0}.magicpin-otp-info{text-align:center;margin-bottom:8px}.magicpin-otp-sent-to{font-size:13px;color:#666;margin:0;display:flex;align-items:center;justify-content:space-between;gap:8px;line-height:1.3}.magicpin-display-phone{color:#333;font-weight:600}.magicpin-btn-edit-phone{background:none;border:none;color:#d91c22;font-size:12px;cursor:pointer;text-decoration:underline;padding:0;margin:0;font-style:italic;font-weight:700;height:auto;width:auto;display:inline;line-height:1.3}.magicpin-btn-edit-phone:hover{color:#b91619}.magicpin-timer{text-align:center;font-size:12px;color:#666;margin:6px 0;display:flex;align-items:center;justify-content:center;gap:4px;line-height:1.2}.magicpin-timer-display{font-weight:700;color:#d91c22;font-size:13px}.magicpin-delivery-status{margin:6px 0;padding:6px;background-color:#f8f9fa;border-radius:6px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.magicpin-status-item{display:flex;align-items:center;padding:0;font-size:11px;line-height:1.2}.magicpin-status-icon{margin-right:4px;font-size:13px}.magicpin-status-text{color:#555}.magicpin-status-item.success .magicpin-status-icon{color:#28a745}.magicpin-status-item.success .magicpin-status-text{color:#28a745;font-weight:500}.magicpin-status-item.error .magicpin-status-icon{color:#dc3545}.magicpin-status-item.error .magicpin-status-text{color:#dc3545}.magicpin-remember-me{margin:8px 0}.magicpin-checkbox-label{display:flex;align-items:center;font-size:15px;color:#555;cursor:pointer;user-select:none;line-height:1.2}.magicpin-checkbox{width:16px;height:16px;margin-right:6px;cursor:pointer;accent-color:#d91c22;flex-shrink:0}.magicpin-otp-actions{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:8px}.magicpin-resend-timer{color:#999;font-size:12px;margin-left:0;margin-top:8px}.magicpin-help{margin-top:-85px;padding:5px;background-color:#f8f9fa;border-radius:6px;border:1px solid #e9ecef}.magicpin-help-trigger{font-size:12px;color:#666;cursor:pointer;user-select:none;font-weight:500;line-height:1.2}.magicpin-help-trigger:hover{color:#333}.magicpin-help-content{margin-top:8px}.magicpin-help-list{margin:0;padding-left:16px;font-size:11px;color:#666;line-height:1.4}.magicpin-help-list li{margin-bottom:3px}.magicpin-loading{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgb(255 255 255 / .95);display:flex;align-items:center;justify-content:center;border-radius:8px;z-index:1000}.magicpin-spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #d91c22;border-radius:50%;animation:magicpinSpin 0.8s linear infinite}@keyframes magicpinSpin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.magicpin-already-logged-in{text-align:center;padding:20px 12px}.magicpin-already-logged-in p{font-size:14px;color:#555;margin-bottom:12px;line-height:1.3}.magicpin-logout-link{display:inline-block;padding:10px 20px;background-color:#d91c22;color:#fff;text-decoration:none;border-radius:6px;font-weight:500;transition:all 0.2s ease;line-height:1.2}.magicpin-logout-link:hover{background-color:#b91619;transform:translateY(-1px)}.iti{width:100%;display:block;position:relative}.iti__flag-container{position:absolute;top:0;bottom:0;left:0;padding:0}.iti__selected-flag{padding:0 8px 0 12px;height:100%;display:flex;align-items:center}.iti__flag{margin-right:6px}.iti__arrow{margin-left:4px;border-left:3px solid #fff0;border-right:3px solid #fff0;border-top:4px solid #555}.iti input.magicpin-phone-input{padding-left:100px!important;width:100%!important;box-sizing:border-box!important}.iti__country-list{max-height:200px;overflow-y:auto;margin-top:4px;box-shadow:0 2px 8px rgb(0 0 0 / .15);border-radius:6px}@media (max-width:480px){.magicpin-container{max-width:100%;border-radius:0;box-shadow:none;padding:12px;min-height:auto}.magicpin-title{font-size:18px}.magicpin-phone-input{font-size:18px}.magicpin-otp-input{font-size:24px;letter-spacing:6px}.magicpin-btn-primary{margin-top:20px}.magicpin-step-intro{font-size:13px}.magicpin-help{margin-top:8px;padding:6px}}@media (min-height:600px){.magicpin-container{margin-top:5vh}}.magicpin-input:focus-visible,.magicpin-btn:focus-visible,.magicpin-btn-link:focus-visible{outline:2px solid #d91c22;outline-offset:2px}@media (prefers-contrast:high){.magicpin-container{border:2px solid #000}.magicpin-input{border-width:2px}}@media (prefers-reduced-motion:reduce){.magicpin-step.active,.magicpin-btn,.magicpin-spinner{animation:none;transition:none}}