*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{font-family:'Be Vietnam Pro',system-ui,sans-serif;color:#fff;background:linear-gradient(145deg,rgba(15,23,42,.36),rgba(2,6,23,.7)),url('../../img/bg-2.jpg') center/cover fixed;-webkit-font-smoothing:antialiased}.lock-screen{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(24px,env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom));backdrop-filter:blur(16px)}.lock-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#ffffff24;font-size:23px;box-shadow:inset 0 0 0 1px #ffffff26}h1{margin:18px 0 6px;font-size:25px;font-weight:600;letter-spacing:-.03em}.hint{margin:0;font-size:13px;opacity:.75}form{width:min(290px,100%);text-align:center}.dots{height:55px;display:flex;align-items:center;justify-content:center;gap:18px}.dots span{width:12px;height:12px;border:1.5px solid #ffffffe6;border-radius:50%;transition:.15s}.dots span.filled{background:#fff;transform:scale(1.08)}.error{height:22px;margin:-3px 0 5px;color:#ffd5d5;font-size:13px}.keypad{display:grid;grid-template-columns:repeat(3,72px);justify-content:center;gap:12px 18px}.keypad button{width:72px;height:72px;border:0;border-radius:50%;color:#fff;background:#ffffff2e;backdrop-filter:blur(5px);cursor:pointer;transition:.08s;font-family:inherit}.keypad button:active{transform:scale(.93);background:#ffffff57}.keypad strong{display:block;font-size:28px;line-height:30px;font-weight:400}.keypad small{display:block;min-height:10px;font-size:8px;font-weight:600;letter-spacing:2px}.keypad .delete{background:transparent;font-size:25px}@keyframes shake{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}.shake{animation:shake .35s}@media(max-height:650px){.lock-icon,.hint{display:none}h1{margin:0 0 4px}.keypad{gap:8px 18px}.keypad button{width:62px;height:62px}}