/* Scoped to the login screen; the document workspace is unchanged. */
#loginView{--pin-key-size:clamp(64px,9.5svh,82px);min-height:100svh;display:grid;place-items:center;padding:max(32px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));color:#f7f8fb;background:radial-gradient(ellipse at 20% 5%,#31423c60,transparent 55%),radial-gradient(ellipse at 90% 100%,#313d5060,transparent 55%),#11171c;font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display',system-ui,sans-serif;box-sizing:border-box}
#loginView .login-card{width:min(360px,100%);padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;display:flex;flex-direction:column;align-items:center;text-align:center}
#loginView .login-mark{display:grid;place-items:center;width:46px;height:46px;border:1px solid #ffffff16;border-radius:16px;background:#ffffff06;margin-bottom:18px}
#loginView .login-mark svg{width:25px;height:25px;stroke:#e5eae4;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
#loginView .login-brand{font-size:9px;font-weight:500;letter-spacing:.26em;color:#8d999c;margin:0 0 14px;padding-left:.26em}
#loginView h1{font-size:25px;font-weight:500;letter-spacing:-.025em;line-height:1.2;margin:0;color:#f7f8fb}
#loginView #loginForm{margin:0;display:flex;flex-direction:column;align-items:center;width:auto}
#loginView .pin-dots{display:flex;justify-content:center;gap:18px;margin:26px 0 42px}
#loginView .pin-dots span{width:11px;height:11px;border-radius:50%;border:1.2px solid #d0d8db;background:none;transition:background .12s,transform .12s}
#loginView .pin-dots .filled{background:#f7f8fb;border-color:#f7f8fb;transform:scale(1.03)}
#loginView .pin-grid{display:grid;grid-template-columns:repeat(3,var(--pin-key-size));gap:16px 26px;width:auto;margin:0 auto}
#loginView .pin-grid button{width:var(--pin-key-size);height:var(--pin-key-size);min-height:0;border:1px solid #ffffff09;border-radius:50%;background:#ffffff12;color:#f7f8fb;font:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;box-shadow:inset 0 1px 0 #ffffff09;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background .12s,transform .12s}
#loginView .pin-grid button:hover{background:#ffffff20}
#loginView .pin-grid button:active{background:#ffffff32;transform:scale(.95)}
#loginView .pin-grid button:focus-visible{outline:2px solid #f7f8fb;outline-offset:5px}
#loginView .pin-number{font-size:34px;font-weight:300;line-height:1;letter-spacing:-.035em;pointer-events:none}
#loginView .pin-letters{font-size:9px;font-weight:500;letter-spacing:.18em;line-height:1;margin-top:5px;padding-left:.18em;pointer-events:none;color:#d5dddf}
#loginView .pin-grid .pin-delete{background:none;border:0;box-shadow:none}
#loginView .pin-delete svg{width:25px;height:22px;stroke:#cbd4d8;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#loginView .form-error{max-width:300px;min-height:16px;height:auto;font-size:11px;line-height:1.4;color:#ffb4ab;margin:18px 0 0}
#loginView button,#loginView input{touch-action:manipulation}
@media(max-height:650px){#loginView{--pin-key-size:60px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom))}#loginView .login-mark{width:34px;height:34px;margin-bottom:10px;border-radius:12px}#loginView .login-mark svg{width:21px;height:21px}#loginView .login-brand{margin-bottom:8px}#loginView h1{font-size:22px}#loginView .pin-dots{margin:20px 0 26px}#loginView .pin-grid{gap:12px 24px}#loginView .form-error{margin-top:12px}}
@media(prefers-reduced-motion:reduce){#loginView *,#loginView *::before,#loginView *::after{transition:none!important;animation:none!important}}