:root{--yellow:#ffd800;--text:#111;--muted:#91aab8;--line:#dfe5e8;--pale:#f5f7fb}*{box-sizing:border-box}body{margin:0;font-family:Poppins,Arial,sans-serif;color:var(--text);min-height:100vh}.auth-shell{display:flex;min-height:100vh}.brand-panel{width:50%;position:relative;display:flex;align-items:center;justify-content:center;background:#fff}.brand-panel:before{content:"";position:absolute;inset:0 auto 0 0;width:80px;background:var(--yellow)}.brand-mark{font-size:72px;letter-spacing:-7px;font-weight:500;color:var(--yellow);line-height:1}.form-panel{width:50%;display:flex;align-items:center;justify-content:center;box-shadow:-4px 0 15px #00000012}.form-content{width:min(400px,calc(100% - 48px))}.heading{margin-bottom:25px}.heading h1{font-size:24px;line-height:1.3;font-weight:500;margin:0 0 7px}.heading p{margin:0;color:var(--muted);font-size:16px}.view{display:none}.view.active{display:block}label{display:block;color:#496477;font-size:14px;margin:0 0 5px}form{display:flex;flex-direction:column;gap:8px}.input-wrap{height:44px;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;margin-bottom:8px}.input-wrap:focus-within{border-color:var(--yellow);box-shadow:0 0 0 3px #ffd80022}.input-icon{color:var(--yellow);font-size:17px;width:47px;text-align:center}.input-wrap input{border:0;outline:0;width:100%;height:100%;font:inherit;color:#526e7e}.input-wrap input::placeholder{color:#a6b9c5}.eye{border:0;background:transparent;color:var(--yellow);cursor:pointer;font-size:16px;margin-right:12px}.forgot{display:block;border:0;background:none;padding:0;color:#efc800;font:500 14px Poppins;cursor:pointer;text-align:right;margin:0 0 10px}.primary,.secondary{height:43px;border-radius:5px;font:600 14px Poppins;cursor:pointer;width:100%;transition:.2s}.primary{border:0;background:var(--yellow);color:#fff}.primary:disabled{background:var(--pale);color:var(--muted);cursor:not-allowed}.primary:not(:disabled):hover{filter:brightness(.97);transform:translateY(-1px)}.divider{height:1px;background:var(--line);margin:16px 0}.secondary{border:1px solid var(--line);background:#fff;color:#edc800}.secondary:hover{background:#fffdf0}.back{border:0;background:none;color:#6f8794;font:500 14px Poppins;padding:0;cursor:pointer;margin-bottom:32px}.pin-heading{text-align:center}.shield{margin:0 auto 16px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#fff8c9;color:#d5b600;font-size:24px}.pin-heading p{font-size:14px;line-height:1.6}.pin-inputs{display:flex;justify-content:center;gap:12px;margin:28px 0 12px}.pin-inputs input{width:58px;height:64px;border:1px solid var(--line);border-radius:8px;text-align:center;font:500 28px Poppins;color:#111;outline:0}.pin-inputs input:focus{border-color:var(--yellow);box-shadow:0 0 0 3px #ffd80022}.pin-help{text-align:center;color:var(--muted);font-size:12px;margin:0 0 20px}.pin-view .forgot{text-align:center;margin:18px auto 0}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);padding:12px 18px;background:#242424;color:#fff;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:700px){.auth-shell{flex-direction:column}.brand-panel,.form-panel{width:100%}.brand-panel{min-height:170px}.brand-panel:before{width:100%;height:12px;inset:0 0 auto}.brand-mark{font-size:58px}.form-panel{box-shadow:none;align-items:flex-start;padding-top:42px}.form-content{width:min(400px,calc(100% - 40px))}}