.security-page { min-height:100vh; min-height:100dvh; background:var(--bg); color:var(--text); }
.password-gate, .auth-layout { min-height:100vh; min-height:100dvh; display:flex; align-items:center; justify-content:center; padding:32px 20px; gap:40px; }
.password-gate > section, .auth-form-panel { width:100%; max-width:520px; padding:32px; border:1px solid var(--border); border-radius:var(--r-md); background:var(--panel); box-shadow:var(--sh-sm); }
.auth-information { width:100%; max-width:400px; }
.auth-brand { display:grid; gap:12px; margin-bottom:36px; }
.auth-brand small { display:block; color:var(--text-soft); margin-top:6px; }
.security-page h1, .security-page h2 { color:var(--ink); font-size:24px; line-height:1.3; margin:12px 0 16px; }
.security-page p, .security-page .helptext, .auth-form-title span, .auth-intro span, .otp-hint { color:var(--text-soft); font-size:13px; line-height:1.6; }
.security-page .eyebrow, .auth-form-title > p, .auth-intro > p { color:var(--text-soft); font-size:12px; font-weight:600; }
.security-page form { display:grid; gap:16px; margin-top:24px; }
.security-page form > div, .security-page form > p, .security-page label { display:grid; gap:8px; margin:0; }
.security-page label { color:var(--text); font-size:13px; font-weight:500; }
.security-page input { width:100%; min-width:0; height:44px; border:1px solid var(--border-strong); border-radius:var(--r-sm); background:var(--surface); color:var(--ink); padding:10px 12px; font:inherit; }
.security-page input:focus { border-color:var(--accent); }
.security-page .helptext ul { padding-left:18px; margin:4px 0; }
.security-page .errorlist, .auth-error, .login-error { color:var(--danger); font-size:13px; }
.security-page .primary-button, .auth-submit { display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 16px; background:var(--accent-strong); border:1px solid var(--accent-strong); color:var(--accent-ink); border-radius:var(--r-sm); font:inherit; font-weight:600; cursor:pointer; }
.security-page .primary-button:hover, .auth-submit:hover { background:var(--accent-hover); border-color:var(--accent-hover); color:var(--accent-ink); }
.security-page .link-button { border:0; background:transparent; color:var(--accent-strong); font:inherit; cursor:pointer; }
.auth-support { text-align:center; }
@media(max-width:800px) { .auth-layout { flex-direction:column; gap:24px; } .auth-information { max-width:520px; } .auth-brand { margin-bottom:20px; } }
@media(max-width:480px) { .password-gate, .auth-layout { padding:20px 12px; } .password-gate > section, .auth-form-panel { padding:24px 18px; } }