:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark;--orange:#ff7b32;--orange-2:#ff9a43;--text:#fff;--muted:rgba(255,255,255,.66);--line:rgba(255,255,255,.13);--panel:rgba(10,11,12,.88);--danger:#ff746c}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#040506}body{min-height:100svh;color:var(--text);-webkit-font-smoothing:antialiased;background:#040506}button,input{font:inherit}.wp-signin-v7{overflow-x:hidden}.signin-shell{position:relative;isolation:isolate;width:min(100%,520px);min-height:100svh;margin:0 auto;padding:calc(12px + env(safe-area-inset-top)) 20px calc(22px + env(safe-area-inset-bottom));overflow:hidden;background:linear-gradient(180deg,rgba(4,5,6,.42) 0%,rgba(4,5,6,.82) 38%,#040506 78%),url('/assets/welcome/wenapay-signin-sa-provinces-1024x1536.webp?v=20260913-clean-signin-1') 50% 24%/cover no-repeat;box-shadow:0 0 0 1px rgba(255,255,255,.04),0 30px 100px rgba(0,0,0,.72)}.signin-shell:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 84% 8%,rgba(255,123,50,.17),transparent 29%),linear-gradient(180deg,transparent 0 18%,rgba(4,5,6,.12) 40%,#040506 91%);pointer-events:none}.signin-topbar{height:58px;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;position:relative;z-index:2}.back-link{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,123,50,.34);border-radius:50%;background:rgba(8,9,10,.52);color:#fff;text-decoration:none;font-size:34px;line-height:1;backdrop-filter:blur(14px)}.brand{justify-self:center;display:flex;align-items:center;height:42px}.brand img{display:block;width:76px;max-height:54px;object-fit:contain;filter:drop-shadow(0 7px 18px rgba(255,123,50,.22))}.signin-stage{min-height:calc(100svh - 104px - env(safe-area-inset-top) - env(safe-area-inset-bottom));display:grid;align-items:center;padding:12px 0}.auth-card{position:relative;overflow:hidden;padding:26px 24px 24px;border:1px solid rgba(255,123,50,.24);border-radius:28px;background:linear-gradient(160deg,rgba(20,20,20,.91),rgba(7,8,9,.96));box-shadow:0 24px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.07);backdrop-filter:blur(22px)}.auth-card:before{content:"";position:absolute;right:-90px;bottom:-110px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,111,25,.23),transparent 68%);pointer-events:none}.auth-card>section{position:relative;z-index:1}.eyebrow{margin:0 0 9px;color:var(--orange);font-size:11px;font-weight:850;letter-spacing:.16em;text-align:center}.auth-card h1{margin:0;text-align:center;font-size:clamp(34px,9vw,44px);line-height:1;letter-spacing:-.045em}.muted{max-width:350px;margin:12px auto 24px;color:var(--muted);font-size:14px;line-height:1.5;text-align:center}.state-view{min-height:380px;display:grid;place-items:center;align-content:center;gap:14px;color:var(--muted)}.spinner{width:34px;height:34px;border:3px solid rgba(255,255,255,.12);border-top-color:var(--orange);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}form{display:grid;gap:14px}label{display:grid;gap:7px;color:rgba(255,255,255,.9);font-size:13px;font-weight:720}input{width:100%;height:56px;padding:0 17px;border:1px solid rgba(255,255,255,.16);border-radius:16px;background:rgba(26,28,31,.9);color:#fff;outline:none;box-shadow:inset 0 1px rgba(255,255,255,.03);transition:border-color .16s,box-shadow .16s,background .16s}input::placeholder{color:rgba(255,255,255,.34)}input:focus{border-color:rgba(255,123,50,.9);background:#1c1e21;box-shadow:0 0 0 3px rgba(255,123,50,.12),0 0 24px rgba(255,123,50,.08)}.pin-input{font-size:23px;letter-spacing:.32em;text-align:center;font-weight:800}.remember-row{grid-template-columns:auto 1fr;align-items:flex-start;gap:12px;padding:13px 14px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.035);cursor:pointer}.remember-row input{width:20px;height:20px;min-height:0;margin:2px 0 0;accent-color:var(--orange)}.remember-row span{display:grid;gap:3px}.remember-row strong{font-size:13px}.remember-row small{color:rgba(255,255,255,.52);font-size:11px;font-weight:500;line-height:1.4}.primary{width:100%;min-height:58px;border:1px solid rgba(255,185,117,.7);border-radius:18px;background:radial-gradient(circle at 90% 0,rgba(255,206,151,.34) 0 20%,transparent 21%),linear-gradient(110deg,#ff6815,#ff9638);color:#fff;font-weight:800;font-size:18px;cursor:pointer;box-shadow:0 12px 34px rgba(255,98,16,.26),inset 0 1px rgba(255,255,255,.25)}.primary:active{transform:scale(.986)}.primary:disabled{opacity:.58;cursor:wait}.error{margin:0;padding:11px 13px;border:1px solid rgba(255,116,108,.35);border-radius:13px;background:rgba(145,31,25,.2);color:#ffd4d1;font-size:12px;line-height:1.4}.form-links{display:grid;justify-items:center;gap:9px;margin-top:18px;color:rgba(255,255,255,.58);font-size:12px}.form-links a,.text-button{color:var(--orange);font-weight:750;text-decoration:none}.text-button{appearance:none;border:0;background:transparent;padding:0;cursor:pointer}.secondary-actions{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:18px;color:rgba(255,255,255,.4);font-size:12px}.skip-button{display:block;margin:18px auto 0;color:rgba(255,255,255,.63)}.pin-guidance{margin:-3px 0 0;color:rgba(255,255,255,.5);font-size:11px;line-height:1.4}.wp-v7-pin-dots{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin:0 16px}.wp-v7-pin-dots span{aspect-ratio:1;border:1px solid rgba(255,123,50,.42);border-radius:13px;background:rgba(255,123,50,.06);display:grid;place-items:center}.wp-v7-pin-dots span.filled:after{content:"";width:10px;height:10px;border-radius:50%;background:#fff}.wp-v7-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px 20px;padding:14px 24px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:rgba(255,255,255,.025)}.wp-v7-key{aspect-ratio:1;max-height:57px;border:1px solid rgba(255,123,50,.24);border-radius:50%;background:rgba(255,255,255,.035);color:#fff;font-size:23px}.wp-v7-key.delete{font-size:20px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}[hidden]{display:none!important}.account-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:-7px 0 18px}.account-option{min-height:64px;padding:11px 12px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.035);color:#fff;display:grid;align-content:center;gap:3px;text-align:left;cursor:pointer;transition:border-color .16s,background .16s,box-shadow .16s,transform .16s}.account-option strong{font-size:14px;line-height:1.2}.account-option span{font-size:10.5px;line-height:1.3;color:rgba(255,255,255,.52)}.account-option[aria-pressed="true"]{border-color:rgba(255,123,50,.76);background:linear-gradient(145deg,rgba(255,123,50,.18),rgba(255,123,50,.06));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 8px 24px rgba(255,123,50,.09)}.account-option[aria-pressed="true"] span{color:rgba(255,255,255,.72)}.account-option:hover{border-color:rgba(255,123,50,.5);background:rgba(255,123,50,.09)}.account-option:active{transform:scale(.985)}.account-option:focus-visible{outline:3px solid rgba(255,123,50,.24);outline-offset:2px}@media(max-height:760px){.signin-stage{align-items:start;padding-top:8px}.auth-card{padding:21px 20px}.muted{margin-bottom:17px}.signin-topbar{height:50px}.signin-stage{min-height:calc(100svh - 86px)}input{height:52px}form{gap:11px}.primary{min-height:54px}.form-links{margin-top:13px}.wp-v7-keypad{gap:7px 18px;padding:10px 30px}.wp-v7-key{max-height:48px}.wp-v7-pin-dots{margin:0 24px}.account-choice{margin-bottom:13px}.account-option{min-height:58px;padding:9px 10px}}@media(max-width:380px){.signin-shell{padding-left:14px;padding-right:14px}.auth-card{padding-left:18px;padding-right:18px}.brand img{width:70px}.account-choice{gap:8px}.account-option{padding:9px 8px}.account-option strong{font-size:13px}.account-option span{font-size:10px}}@media(min-width:700px){body{background:radial-gradient(circle at 50% 28%,rgba(255,123,50,.09),transparent 38%),#020303}.signin-shell{min-height:100svh}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}
