/* Trang đăng nhập Viva theo mnml.ai/login. Chỉ dùng token của mnml-dna.css, không màu cứng. */
body.vr-login{background:var(--page-bg,var(--surface-page-light));color:var(--ink);font-family:var(--font-ui);min-height:100vh;display:flex;align-items:center;justify-content:center;margin:0;padding:24px 16px;box-sizing:border-box}
.dark body.vr-login{background:var(--surface-page-dark)}
.vr-login #login{width:408px;max-width:100%;padding:0;margin:0}
.vr-login .vl-card{background:var(--surface-card-light);border:1px solid var(--stroke-2);border-radius:20px;padding:32px 32px 28px;box-sizing:border-box}
.dark .vr-login .vl-card{background:var(--surface-card-dark)}
.vl-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}
.vl-logo{display:inline-flex;height:24px}.vl-word{height:24px;width:auto}
.vl-word-dark{display:none}.dark .vl-word-light{display:none}.dark .vl-word-dark{display:block}
.vl-home{font-size:12px;font-weight:560;color:var(--ink-3);text-decoration:none}.vl-home:hover{color:var(--ink)}
.vl-back{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:560;color:var(--ink-3);text-decoration:none;margin-bottom:16px}.vl-back:hover{color:var(--ink)}
.vr-login .vl-title{text-align:left;font-family:var(--font-aspekta,var(--font-ui));font-size:21px;font-weight:560;letter-spacing:-.02em;line-height:1.2;margin:0 0 8px;color:var(--ink)}
.vl-sub{font-size:14px;color:var(--ink-3);margin:0 0 24px;line-height:1.5}
.vr-login #loginform,.vr-login #lostpasswordform,.vr-login #resetpassform,.vr-login #registerform{background:none;border:0;box-shadow:none;padding:0;margin:0;overflow:visible}
#login form p,#login .user-pass-wrap{margin:0 0 18px}
.vr-login form label{font-size:13px;font-weight:560;color:var(--ink);display:block;margin:0 0 8px;line-height:1.5}
.vl-label-row{display:flex;justify-content:space-between;align-items:baseline}.vl-label-row label{margin-bottom:8px}
.vl-forgot{font-size:12px;font-weight:600;color:var(--accent-text);text-decoration:none}.vl-forgot:hover{text-decoration:underline}
.vr-login form .input,.vr-login form input[type=text],.vr-login form input[type=email],.vr-login form input[type=password]{width:100%;height:46px;margin:0;padding:0 14px;font-size:14px;font-family:var(--font-ui);color:var(--ink);background:var(--fill-1);border:1px solid var(--stroke-1);border-radius:7px;box-shadow:none;box-sizing:border-box;transition:border-color 160ms cubic-bezier(.22,1,.36,1),box-shadow 160ms cubic-bezier(.22,1,.36,1)}
.vr-login form input::placeholder{color:var(--ink-4)}
.vr-login form input:focus{outline:0;border-color:var(--accent);box-shadow:var(--focus-halo);background:var(--fill-1)}
.vr-login .wp-pwd{position:relative}.vr-login .wp-pwd input{padding-right:44px}
.vr-login .wp-hide-pw{position:absolute;right:4px;top:4px;height:38px;width:38px;background:none;border:0;color:var(--ink-4);box-shadow:none}
.vr-login .wp-hide-pw:hover,.vr-login .wp-hide-pw:focus{color:var(--ink-2);background:none;box-shadow:none}
.vr-login #login .forgetmenot{float:none;margin:2px 0 24px;display:flex;align-items:center;gap:10px}
.vr-login .forgetmenot .wp-tooltip{display:none}
.vr-login #login .forgetmenot label{display:inline;font-size:13px;font-weight:400;color:var(--ink-2);margin:0}
.vr-login input[type=checkbox]{width:18px;height:18px;margin:0;border-radius:5px;border:1px solid var(--stroke-2);background:var(--surface-card-light);accent-color:var(--accent)}
.vr-login input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}
.vr-login input[type=checkbox]:checked::before{filter:brightness(0) invert(1);margin:-2px 0 0 -2px}
.vr-login p.submit{margin:0;padding:0;float:none;clear:both}
.vr-login .vl-submit,.vr-login p.submit .button{width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 20px;font-size:15px;font-weight:560;letter-spacing:-.01em;font-family:var(--font-ui);color:var(--accent-ink);background:var(--accent);border:0;border-radius:7px;box-shadow:0 6px 16px -8px color-mix(in oklch,var(--accent) 70%,transparent);cursor:pointer;float:none;line-height:1;text-shadow:none;transition:background 160ms cubic-bezier(.22,1,.36,1),transform 120ms cubic-bezier(.22,1,.36,1)}
.vr-login .vl-submit:hover,.vr-login p.submit .button:hover{background:var(--blue-800)}.dark .vr-login .vl-submit:hover{background:var(--blue-500)}
.vr-login .vl-submit:active{transform:scale(.97)}
.vr-login .vl-submit:focus-visible{outline:0;box-shadow:var(--focus-halo)}
.vr-login .message,.vr-login .notice,.vr-login #login_error{margin:0 0 20px;padding:10px 14px;border:0;border-radius:10px;background:var(--fill-1);color:var(--ink-2);font-size:13px;box-shadow:none;border-left:0}
.vr-login #login_error,.vr-login .notice-error{background:color-mix(in oklch,var(--danger-fill) 10%,transparent);color:var(--danger-light)}
.dark .vr-login #login_error{color:var(--danger-dark)}
.vr-login .indicator-hint,.vr-login .description{font-size:12px;color:var(--ink-3)}
.vl-foot{display:flex;justify-content:center;gap:14px;margin-top:20px;font-size:12px;color:var(--ink-3)}
.vl-foot a{color:var(--ink-3);text-decoration:none}.vl-foot a:hover{color:var(--ink)}
.vr-login #nav,.vr-login #backtoblog,.vr-login .privacy-policy-page-link,.vr-login .language-switcher{display:none}
@media (max-width:440px){.vr-login .vl-card{padding:24px 20px 22px;border-radius:18px}body.vr-login{align-items:flex-start;padding-top:32px}}