*,: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-group--with-prefix .sr-field-label-floating{left:36px}.sr-field-label-floating--active{top:4px;font-size:12px;color:#FFD700;font-weight:600;left:0!important}.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:#ffffff;flex-direction:column;overflow:hidden}.sr-otp-navbar,.sr-otp-screen{display:flex;position:relative}.sr-otp-navbar{align-items:center;justify-content:space-between;padding:max(14px,env(safe-area-inset-top,14px)) 16px 14px;background:#1a2233;flex-shrink:0;z-index:2}.sr-otp-navbar-title{font-size:17px;font-weight:700;color:#ffffff;font-family:Inter,sans-serif;letter-spacing:.1px}.sr-otp-back-btn{width:36px;height:36px;background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#ffffff;padding:0}.sr-otp-content{flex:1 1;overflow-y:auto;padding:28px 24px 16px;display:flex;flex-direction:column;align-items:center}.sr-otp-title{font-size:20px;font-weight:800;color:#1a2233;margin-bottom:14px;line-height:1.3;font-family:Inter,sans-serif;text-align:center}.sr-otp-hint-row{gap:8px;margin-bottom:28px}.sr-otp-hint-icon,.sr-otp-hint-row{display:flex;align-items:center;justify-content:center}.sr-otp-hint-icon{width:30px;height:30px;border-radius:50%;background:#0d9d8f;font-size:15px;flex-shrink:0;line-height:1;text-align:center;padding-top:1px}.sr-otp-hint-text{font-size:13px;font-weight:500;color:#0d9d8f;font-family:Inter,sans-serif;line-height:1.4}.sr-otp-hint-text--urgent{color:#c0392b}.sr-otp-hint-text strong{font-weight:700;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.sr-otp-boxes{display:flex;gap:clamp(4px,2vw,10px);justify-content:center;margin-bottom:16px;width:100%}.sr-otp-box{flex:1 1;min-width:0;height:clamp(48px,13vw,64px);border-radius:12px;border:2px solid transparent;background:#eef0f3;font-size:clamp(18px,5vw,24px);font-weight:700;color:#1a2233;text-align:center;outline:none;caret-color:#1a2233;transition:border-color .15s,background .15s;font-family:Inter,sans-serif}.sr-otp-box:focus{border-color:#0d9d8f;background:#f5fffe}.sr-otp-box.sr-otp-box--filled{border-color:#1a2233;background:#eef0f3}.sr-otp-box.sr-otp-box--error{border-color:#c0392b;background:#fff5f5}.sr-otp-error{font-size:13px;color:#c0392b;margin-bottom:8px;font-family:Inter,sans-serif;font-weight:500;text-align:center;width:100%}.sr-otp-btns{width:100%;padding:12px 24px max(24px,env(safe-area-inset-bottom,24px));display:flex;flex-direction:column;gap:10px;flex-shrink:0;background:#ffffff}.sr-otp-next-btn{width:100%;height:54px;border-radius:10px;border:none;cursor:not-allowed;font-size:16px;font-weight:600;font-family:Inter,sans-serif;background:#d6d9df;color:#9aa0ac;transition:background .18s,color .18s}.sr-otp-next-btn--ready{background:#1a2233;color:#ffffff;cursor:pointer}.sr-otp-next-btn--ready:active{transform:scale(.98)}.sr-otp-resend-btn{width:100%;height:54px;border-radius:10px;border:1.5px solid #1a2233;background:#ffffff;cursor:pointer;font-size:16px;font-weight:600;font-family:Inter,sans-serif;color:#1a2233;transition:background .15s}.sr-otp-resend-btn:hover{background:#f5f6f8}.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}