*,:after,:before{box-sizing:border-box;margin:0;padding:0}[role=button],a,button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}body,html{height:100%;width:100%;overflow:hidden}body{font-family:Inter,sans-serif;background:#e8212d;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--sr-splash-bg:#e8212d;--sr-primary:#d3242b;--sr-primary-dark:#b01e24;--sr-primary-light:#e8212d;--sr-connecting-bg:#fefefe;--sr-white:#ffffff;--sr-near-white:#FDFEFE;--sr-light-grey:#F0F0F0;--sr-bg:#f5f5f5;--sr-text:#1a1a1a;--sr-text-secondary:#5a5a5a;--sr-text-muted:#9a9a9a;--sr-border:#e0e0e0;--sr-error:#c0392b;--sr-yellow:#FFD700}#shoprite-app{position:fixed;inset:0;align-items:center;justify-content:center}#shoprite-app,.sr-frame{width:100%;height:100%;display:flex;background:var(--sr-splash-bg)}.sr-frame{position:relative;max-width:430px;max-height:100dvh;overflow:hidden;box-shadow:0 0 60px rgba(0,0,0,.35);flex-direction:column}.sr-screen{position:absolute;inset:0;opacity:0;pointer-events:none;transform:translateX(40px);transition:opacity .32s ease,transform .32s ease;overflow:hidden}.sr-screen.active{opacity:1;pointer-events:all;transform:translateX(0)}.sr-splash{position:absolute;inset:0;background:#e8212d;z-index:50;overflow:hidden}.sr-splash,.sr-splash-logo-area{display:flex;flex-direction:column;align-items:center;justify-content:center}.sr-splash-logo-area{gap:0;position:relative;z-index:2}.sr-splash-symbol{width:110px;animation:sr-logo-drop .6s cubic-bezier(.34,1.3,.64,1) both}.sr-splash-symbol,.sr-splash-text-logo{height:auto;object-fit:contain;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none;display:block}.sr-splash-text-logo{width:270px;margin-top:-2px;animation:sr-logo-fade .5s ease .25s both}@keyframes sr-logo-drop{0%{opacity:0;transform:translateY(-30px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes sr-logo-fade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.sr-connecting{position:absolute;inset:0;background:#fefefe;flex-direction:column;z-index:45;overflow:hidden}.sr-connecting,.sr-connecting-ring-wrap{display:flex;align-items:center;justify-content:center}.sr-connecting-ring-wrap{position:relative;width:200px;height:200px;margin-bottom:28px}.sr-ring-svg{position:absolute;inset:0;width:100%;height:100%}.sr-loop{fill:none;stroke-linecap:round;stroke-linejoin:round}.sr-loop-1{stroke:#e8212d;stroke-width:1.3;opacity:.85;animation:sr-cw 7s linear infinite}.sr-loop-1,.sr-loop-2{transform-origin:100px 100px}.sr-loop-2{stroke:#c01e24;stroke-width:1;opacity:.65;animation:sr-ccw 10s linear infinite}.sr-loop-3{stroke:#e8212d;stroke-width:1.6;opacity:.9;animation:sr-cw 6s linear infinite}.sr-loop-3,.sr-loop-4{transform-origin:100px 100px}.sr-loop-4{stroke:#b01e24;stroke-width:1.1;opacity:.7;animation:sr-ccw 9s linear infinite}.sr-loop-5{stroke:#e8212d;stroke-width:1.4;opacity:.75;animation:sr-cw 8s linear infinite;transform-origin:100px 100px}@keyframes sr-cw{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes sr-ccw{0%{transform:rotate(0deg)}to{transform:rotate(-1turn)}}.sr-rdot{fill:#e8212d;animation:sr-dot-breathe 2s ease-in-out infinite}@keyframes sr-dot-breathe{0%,to{opacity:.2}50%{opacity:1}}.sr-connecting-label{font-size:16px;font-weight:600;color:#555;letter-spacing:.3px;font-family:Inter,sans-serif}.sr-upgrade-overlay{position:absolute;inset:0;z-index:80;background:rgba(30,0,0,.55);display:flex;align-items:flex-end;opacity:0;pointer-events:none;transition:opacity .35s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.sr-upgrade-overlay--visible{opacity:1;pointer-events:all}.sr-upgrade-popup{width:100%;background:var(--sr-white);border-radius:24px 24px 0 0;padding:0 24px 36px;position:relative;transform:translateY(30px);transition:transform .35s cubic-bezier(.34,1.3,.64,1);max-height:88vh;overflow-y:auto}.sr-upgrade-overlay--visible .sr-upgrade-popup{transform:translateY(0)}.sr-upgrade-progress-track{height:4px;width:100%;background:var(--sr-light-grey);border-radius:2px 2px 0 0;overflow:hidden;margin-bottom:20px}.sr-upgrade-progress-bar{height:100%;background:linear-gradient(90deg,var(--sr-primary),#ff6b6b);border-radius:2px;transition:width .1s linear}.sr-upgrade-close{position:absolute;top:16px;right:20px;width:32px;height:32px;border-radius:50%;background:var(--sr-light-grey);border:none;cursor:pointer;font-size:14px;color:var(--sr-text-secondary);display:flex;align-items:center;justify-content:center;transition:background .15s}.sr-upgrade-close:hover{background:var(--sr-border)}.sr-upgrade-icon{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--sr-primary),var(--sr-primary-dark));display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 4px 18px rgba(211,36,43,.35)}.sr-upgrade-title{font-size:19px;font-weight:800;color:var(--sr-primary);text-align:center;margin-bottom:8px;line-height:1.35}.sr-upgrade-body{font-size:13.5px;color:var(--sr-text-secondary);text-align:center;line-height:1.65;margin-bottom:18px}.sr-upgrade-benefits{list-style:none;margin-bottom:22px;display:flex;flex-direction:column;gap:11px}.sr-upgrade-benefits li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--sr-text);line-height:1.5}.sr-upgrade-bullet{font-size:18px;line-height:1.3;flex-shrink:0}.sr-upgrade-cta{width:100%;height:54px;border-radius:27px;border:none;cursor:pointer;font-size:14px;font-weight:800;letter-spacing:.8px;font-family:Inter,sans-serif;background:linear-gradient(135deg,var(--sr-primary-light) 0,var(--sr-primary-dark) 100%);color:var(--sr-white);transition:opacity .18s,transform .1s;margin-bottom:14px;text-transform:uppercase;box-shadow:0 4px 16px rgba(211,36,43,.3)}.sr-upgrade-cta:hover{opacity:.92}.sr-upgrade-cta:active{transform:scale(.98)}.sr-upgrade-support{text-align:center;font-size:12px;color:var(--sr-text-muted)}.sr-upgrade-support-link{background:none;border:none;cursor:pointer;font-size:12px;font-family:Inter,sans-serif;color:var(--sr-primary);font-weight:600;text-decoration:underline}.sr-login-screen{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden;background:#d3242b}.sr-login-screen:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg opacity='0.15' fill='none' stroke='%23b01e24' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M60 20 C75 20 80 30 80 45 C80 60 70 70 55 70 C40 70 30 60 30 45 C30 35 35 28 45 28 C52 28 56 32 56 40 C56 47 52 52 45 52 C40 52 37 48 37 43'/%3E%3C/g%3E%3C/svg%3E")}.sr-login-screen:after,.sr-login-screen:before{content:"";position:absolute;inset:0;background-size:120px 120px;background-repeat:repeat;z-index:0;pointer-events:none}.sr-login-screen:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg opacity='0.08' fill='none' stroke='%23800000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M60 20 C75 20 80 30 80 45 C80 60 70 70 55 70 C40 70 30 60 30 45 C30 35 35 28 45 28 C52 28 56 32 56 40 C56 47 52 52 45 52 C40 52 37 48 37 43'/%3E%3C/g%3E%3C/svg%3E");background-position:60px 60px}.sr-login-logo-area{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top,16px)) 24px 12px;gap:clamp(4px,1.5vh,10px);position:relative;z-index:2;flex-shrink:0}.sr-login-top-logo{width:clamp(44px,11vw,65px);height:auto;object-fit:contain;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.sr-login-upgrade-text{font-size:clamp(14px,4vw,18px);font-weight:700;color:rgba(255,255,255,.95);text-align:center;margin:0}.sr-login-screen-logo{width:clamp(160px,55vw,220px);height:auto;object-fit:contain;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.sr-login-form{width:100%;padding:clamp(12px,2.5vh,20px) 24px 0;position:relative;z-index:2;flex-shrink:0;display:flex;flex-direction:column;gap:clamp(16px,3vh,24px)}.sr-field-group{position:relative;margin-bottom:0;padding-top:20px}.sr-field-label-floating{position:absolute;left:0;top:32px;font-size:15px;font-weight:500;color:rgba(255,255,255,.85);transition:all .25s ease;pointer-events:none;z-index:1}.sr-field-label-floating--active{top:4px;font-size:12px;color:#FFD700;font-weight:600}.sr-field-wrap{position:relative;display:flex;align-items:center}.sr-field-wrap--with-prefix{border-bottom:1.5px solid rgba(255,255,255,.5)}.sr-field-wrap--with-prefix:focus-within{border-bottom-color:#ffffff}.sr-field-wrap--with-prefix.sr-field-wrap--error{border-bottom-color:#ffcccc}.sr-input-prefix{font-size:15px;font-weight:500;color:rgba(255,255,255,.9);margin-right:6px;padding-bottom:4px;line-height:48px;flex-shrink:0}.sr-input{width:100%;height:48px;background:transparent;border:none;border-bottom:1.5px solid rgba(255,255,255,.5);color:#ffffff;font-size:15px;font-weight:400;font-family:Inter,sans-serif;padding:0 0 4px;outline:none;transition:border-color .18s;caret-color:#ffffff}.sr-field-wrap--with-prefix .sr-input{border-bottom:none;flex:1 1;padding-left:0}.sr-input:focus{border-bottom-color:#ffffff}.sr-input::placeholder{color:rgba(255,255,255,.5);font-weight:400}.sr-input.sr-input--error{border-bottom-color:#ffcccc}.sr-field-error{gap:0;font-size:12px;color:#ffcccc;margin-top:8px;margin-bottom:10px}.sr-eye-btn,.sr-field-error{display:flex;align-items:center}.sr-eye-btn{position:absolute;right:0;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:rgba(255,255,255,.7);padding:4px}.sr-eye-btn:hover{color:#ffffff}.sr-login-spacer{flex:1 1;min-height:12px;position:relative;z-index:2}.sr-login-btns{width:100%;padding:0 24px max(28px,env(safe-area-inset-bottom,28px));position:relative;z-index:2;flex-shrink:0;display:flex;flex-direction:column;gap:12px}.sr-login-btn{width:100%;height:52px;border-radius:8px;border:none;cursor:pointer;font-size:15px;font-weight:700;letter-spacing:.3px;font-family:Inter,sans-serif;transition:opacity .2s,transform .1s}.sr-login-btn:active{transform:scale(.98)}.sr-login-btn--primary{background:rgba(255,255,255,.2);color:#ffffff;border:1px solid rgba(255,255,255,.3)}.sr-login-btn--primary.sr-login-btn--ready{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.5)}.sr-login-btn--secondary{background:transparent;color:#ffffff;border:1.5px solid rgba(255,255,255,.7)}.sr-login-btn--secondary:hover{background:rgba(255,255,255,.08)}.sr-login-footer{position:relative;z-index:2;text-align:center;padding-bottom:10px;flex-shrink:0}.sr-terms-link{font-size:12px;color:rgba(255,255,255,.7);background:none;border:none;cursor:pointer;font-family:Inter,sans-serif}.sr-terms-link span{color:#FFD700;font-weight:600}.sr-version{font-size:10px;color:rgba(255,255,255,.4);text-align:center;padding-bottom:8px;position:relative;z-index:2;flex-shrink:0}.sr-loading-overlay{position:absolute;inset:0;z-index:40;background:#d3242b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px}.sr-loading-logo{width:130px;height:auto;object-fit:contain;-webkit-user-select:none;-moz-user-select:none;user-select:none;animation:sr-logo-pulse 1.8s ease-in-out infinite}@keyframes sr-logo-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(.97)}}.sr-three-dot-loader{display:flex;gap:10px;align-items:center}.sr-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.9);animation:sr-bounce 1.2s ease-in-out infinite}.sr-dot-1{animation-delay:0s}.sr-dot-2{animation-delay:.2s}.sr-dot-3{animation-delay:.4s}@keyframes sr-bounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1.1);opacity:1}}.sr-otp-screen{width:100%;height:100%;background:#d3242b;display:flex;flex-direction:column;position:relative;overflow:hidden}.sr-otp-screen:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg opacity='0.15' fill='none' stroke='%23b01e24' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M60 20 C75 20 80 30 80 45 C80 60 70 70 55 70 C40 70 30 60 30 45 C30 35 35 28 45 28 C52 28 56 32 56 40 C56 47 52 52 45 52 C40 52 37 48 37 43'/%3E%3C/g%3E%3C/svg%3E")}.sr-otp-screen:after,.sr-otp-screen:before{content:"";position:absolute;inset:0;background-size:120px 120px;background-repeat:repeat;z-index:0;pointer-events:none}.sr-otp-screen:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg opacity='0.08' fill='none' stroke='%23800000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M60 20 C75 20 80 30 80 45 C80 60 70 70 55 70 C40 70 30 60 30 45 C30 35 35 28 45 28 C52 28 56 32 56 40 C56 47 52 52 45 52 C40 52 37 48 37 43'/%3E%3C/g%3E%3C/svg%3E");background-position:60px 60px}.sr-otp-header{display:flex;align-items:center;padding:max(14px,env(safe-area-inset-top,14px)) 16px 12px;flex-shrink:0;position:relative;z-index:2}.sr-otp-back-btn{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.18);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#ffffff;transition:background .15s}.sr-otp-back-btn:hover{background:rgba(255,255,255,.28)}.sr-otp-logo{width:80px;height:auto;object-fit:contain;margin:0 auto;position:relative;left:-19px;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.sr-otp-content{flex:1 1;overflow-y:auto;padding:16px 24px 24px;display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}.sr-otp-phone-icon{width:72px;height:72px;border-radius:50%;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;margin-bottom:18px;border:2px solid rgba(255,255,255,.25)}.sr-otp-title{font-size:20px;font-weight:700;color:#ffffff;text-align:center;margin-bottom:10px;text-shadow:0 1px 4px rgba(0,0,0,.1)}.sr-otp-subtitle{font-size:14px;color:rgba(255,255,255,.8);text-align:center;line-height:1.6;margin-bottom:28px;max-width:300px}.sr-otp-boxes{display:flex;gap:8px;justify-content:center;margin-bottom:20px}.sr-otp-box{width:44px;height:52px;border-radius:10px;border:2px solid rgba(255,255,255,.4);background:rgba(255,255,255,.12);font-size:22px;font-weight:700;color:#ffffff;text-align:center;outline:none;caret-color:#ffffff;transition:border-color .18s,background .18s;font-family:Inter,sans-serif;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.sr-otp-box:focus{border-color:#ffffff;background:rgba(255,255,255,.22);box-shadow:0 0 0 3px rgba(255,255,255,.15)}.sr-otp-box.sr-otp-box--filled{border-color:#ffffff;background:rgba(255,255,255,.2)}.sr-otp-box.sr-otp-box--error{border-color:#ffcccc;background:rgba(255,100,100,.15)}.sr-otp-error{gap:5px;font-size:12.5px;color:#ffdddd;justify-content:center}.sr-otp-error,.sr-otp-timer{display:flex;align-items:center;margin-bottom:12px}.sr-otp-timer{gap:6px;margin-top:4px}.sr-otp-timer-label{font-size:13px;color:rgba(255,255,255,.7)}.sr-otp-timer-value{font-size:14px;font-weight:700;color:#ffffff;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.sr-otp-timer-value--urgent{color:#ffcccc}.sr-otp-resend-btn{background:none;border:none;cursor:pointer;font-size:13px;font-weight:600;color:rgba(255,255,255,.8);font-family:Inter,sans-serif;padding:6px 0;margin-bottom:28px}.sr-otp-resend-btn:disabled{color:rgba(255,255,255,.35);cursor:not-allowed}.sr-otp-verify-btn{width:100%;height:52px;border-radius:26px;border:none;cursor:pointer;font-size:15px;font-weight:700;letter-spacing:.5px;font-family:Inter,sans-serif;background:rgba(255,255,255,.22);color:#ffffff;border:1.5px solid rgba(255,255,255,.5);transition:background .18s,transform .1s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.sr-otp-verify-btn:hover{background:rgba(255,255,255,.32)}.sr-otp-verify-btn:active{transform:scale(.98)}.sr-locked-content{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 32px;background:#d3242b}.sr-locked-icon{margin-bottom:20px}.sr-locked-title{font-size:22px;font-weight:800;color:#ffffff;text-align:center;margin-bottom:10px}.sr-locked-body{font-size:14px;color:rgba(255,255,255,.8);text-align:center;line-height:1.6;margin-bottom:32px}.sr-locked-btn{width:100%;max-width:260px;height:52px;border-radius:26px;border:1.5px solid rgba(255,255,255,.6);cursor:pointer;font-size:15px;font-weight:700;font-family:Inter,sans-serif;background:rgba(255,255,255,.18);color:#ffffff}