:root{--purple: #5514B4;--purple-dark: #46109A;--rule: #DFD2F0;--stroke: #9066CE;--bg: #FAF8FD;--ink: #1C1430;--muted: #6B6480;--card: #FFFFFF;--radius: 12px;font-family:Figtree,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}.page{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px calc(24px + env(safe-area-inset-bottom,0px))}.card{width:100%;max-width:440px;background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:0 8px 28px #5514b414;padding:32px 28px}.wordmark{font-weight:700;font-size:15px;letter-spacing:-.01em;color:var(--purple);margin-bottom:24px}.brand{display:flex;align-items:center;gap:10px;margin-bottom:24px}.brand-icon{height:30px;width:auto;border-radius:6px}.brand-name{font-weight:700;font-size:16px;color:var(--purple);letter-spacing:-.01em}.head{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px}.head .lock{flex:none;margin-top:3px}h1{font-size:22px;line-height:1.25;font-weight:700;margin:0;letter-spacing:-.015em}.sub{color:var(--muted);font-size:15px;line-height:1.5;margin:0 0 16px}.trust{background:#f6effc;border:1px solid var(--rule);border-radius:8px;color:var(--purple-dark);font-size:13px;line-height:1.45;padding:10px 12px;margin:0 0 22px}.field{margin-bottom:18px}label{display:block;font-size:14px;font-weight:600;margin-bottom:7px}input{width:100%;height:48px;padding:0 14px;font-size:16px;font-family:inherit;color:var(--ink);background:#fff;border:1.5px solid var(--rule);border-radius:9px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}input::placeholder{color:#a9a3b8}input:focus-visible{border-color:var(--stroke);box-shadow:0 0 0 3px #9066ce40}input:disabled{background:#f5f3f8;color:var(--muted)}.pw-wrap{position:relative}.pw-wrap input{padding-right:46px}.pw-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:7px;cursor:pointer}.pw-toggle:hover{background:#f3eefb}.pw-toggle:focus-visible{outline:2px solid var(--stroke);outline-offset:1px}.submit{width:100%;min-height:48px;margin-top:6px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:inherit;font-size:16px;font-weight:600;color:#fff;background:var(--purple);border:none;border-radius:9px;cursor:pointer;transition:background .15s ease}.submit:hover:not(:disabled){background:var(--purple-dark)}.submit:focus-visible{outline:3px solid rgba(144,102,206,.5);outline-offset:2px}.submit:disabled{background:#c9bee2;cursor:not-allowed}.submit.retry{margin-top:20px;width:auto;padding:0 28px}.foot{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:26px;padding-top:18px;border-top:1px solid var(--rule);color:var(--muted);font-size:12.5px}.state{text-align:center;padding:20px 0 6px}.state svg{margin:0 auto 14px;display:block}.state h2{font-size:19px;font-weight:700;margin:0 0 8px}.state-text{color:var(--muted);font-size:15px;line-height:1.5;margin:0 auto;max-width:340px}.spinner{width:17px;height:17px;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;display:inline-block;animation:spin .7s linear infinite}.spinner.big{width:30px;height:30px;border-color:var(--rule);border-top-color:var(--purple)}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.spinner{animation-duration:1.6s}*{transition:none!important}}@media (max-width: 400px){.card{padding:26px 20px}h1{font-size:20px}}