.login-reskin-page,
.login-reskin-page .global-wrap { background:#0d0d0f; color:#f5f5f5; font-family:"Inter",Arial,sans-serif; }
.login-reskin-page .login-shell { width:100%; max-width:1040px; padding:64px 40px 80px; }
.login-reskin-page .login-hero { margin-bottom:48px; text-align:center; }
.login-reskin-page .login-hero p { margin:0 0 16px; color:#a7a7aa; font-size:11px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; }
.login-reskin-page .login-hero h1 { margin:0; color:#f5f5f5; font-family:"Instrument Serif",Georgia,serif; font-size:64px; font-weight:400; line-height:1.1; }
.login-reskin-page .login-layout { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:32px; align-items:start; }
.login-reskin-page .login-panel { min-width:0; padding:32px; border:1px solid #ffffff1a; border-radius:16px; background:#161618; box-shadow:0 24px 60px -24px #000b; }
.login-reskin-page .login-panel h2 { margin:0 0 28px; color:#f5f5f5; font-family:"Instrument Serif",Georgia,serif; font-size:32px; font-weight:400; line-height:1.2; text-align:center; }
.login-reskin-page :is(#login_form, #register_form) .form-group { margin:0 0 24px; }
.login-reskin-page :is(#login_form, #register_form) .form-group:last-child { margin-bottom:0; }
.login-reskin-page :is(#login_form, #register_form) label { display:block; margin:0 0 8px; color:#a7a7aa; font-size:11px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; }
.login-reskin-page :is(#login_form, #register_form) .form-control { height:48px; padding:12px 16px; border:1px solid #3b3b40; border-radius:8px; background:#0d0d0f; color:#f5f5f5; font:14px/1.5 "Inter",Arial,sans-serif; box-shadow:none; }
.login-reskin-page :is(#login_form, #register_form) .form-control:not(:placeholder-shown) { background:oklch(0.24 0.004 280); }
.login-reskin-page :is(#login_form, #register_form) .form-control:focus { border-color:#a7a7aa; box-shadow:0 0 0 2px #ffffff14; }
/* Keep the inset fill when focus styles run on a browser-autofilled field. */
.login-reskin-page :is(#login_form, #register_form) .form-control:-webkit-autofill { box-shadow:0 0 0 1000px oklch(0.24 0.004 280) inset; -webkit-text-fill-color:#f5f5f5; caret-color:#f5f5f5; }
.login-reskin-page :is(#login_form, #register_form) .form-control:-webkit-autofill:focus { box-shadow:0 0 0 1000px oklch(0.24 0.004 280) inset,0 0 0 2px #ffffff14; }
.login-reskin-page :is(#login_form, #register_form) .input-icon { display:none; }
.login-reskin-page :is(#login_form, #register_form) .has-error .form-control { border-color:#c87878; }
.login-reskin-page :is(#login_form, #register_form) .help-block { margin:8px 0 0; color:#f2aaaa; font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.login-reskin-page :is(#login_form, #register_form) .checkbox { margin:0; padding:0; }
.login-reskin-page :is(#login_form, #register_form) .checkbox label { display:flex; padding:0; margin:0; gap:12px; align-items:center; font-size:13px; line-height:1.6; letter-spacing:0; text-transform:none; }
.login-reskin-page :is(#login_form, #register_form) .i-check { flex:0 0 auto; top:0; left:0; float:none; margin:0; width:22px; height:22px; border:1px solid #66666b; border-radius:5px; background:#0d0d0f; line-height:20px; }
.login-reskin-page :is(#login_form, #register_form) .i-check.hover { border-color:#f5f5f5; }
.login-reskin-page :is(#login_form, #register_form) .i-check.checked { border-color:#f5f5f5; background:#f5f5f5; }
.login-reskin-page :is(#login_form, #register_form) .i-check.checked::before { color:#0d0d0f; }
.login-reskin-page :is(#login_form, #register_form) .i-check:focus-within { outline:2px solid #f5f5f5; outline-offset:3px; }
.login-reskin-page :is(#login_form, #register_form) input[type="submit"],
.login-reskin-page .social_login .btn { display:flex; width:100%; min-height:48px; padding:12px 24px; border:1px solid #f5f5f5; border-radius:999px; align-items:center; justify-content:center; gap:10px; background:#f5f5f5; color:#0d0d0f; font:600 14px/1.5 "Inter",Arial,sans-serif; white-space:normal; }
.login-reskin-page :is(#login_form, #register_form) input[type="submit"]:hover,
.login-reskin-page :is(#login_form, #register_form) input[type="submit"]:focus { background:#dededc; color:#0d0d0f; border-radius:999px; }
.login-reskin-page :is(#login_form, #register_form) input[type="submit"]:focus-visible,
.login-reskin-page .social_login .btn:focus-visible { outline:2px solid #f5f5f5!important; outline-offset:4px; }
.login-reskin-page :is(#login_form, #register_form) .login-account-links { display:flex; flex-wrap:wrap; gap:12px 20px; align-items:baseline; justify-content:space-between; }
.login-reskin-page :is(#login_form, #register_form) .login-account-links::before,
.login-reskin-page :is(#login_form, #register_form) .login-account-links::after { display:none; }
.login-reskin-page :is(#login_form, #register_form) .login-account-links a { float:none!important; margin:0; color:#a7a7aa; font-size:12px; line-height:1.6; text-decoration:underline; text-underline-offset:3px; }
.login-reskin-page :is(#login_form, #register_form) .login-account-links a:hover { color:#f5f5f5; }
.login-reskin-page .social_login { margin:0; padding:0; }
.login-reskin-page .social_login .social-btn { margin:0; padding:0; }
.login-reskin-page .social_login .btn { border-color:#ffffff26; background:#0d0d0f; color:#f5f5f5; }
.login-reskin-page .social_login .btn:hover,
.login-reskin-page .social_login .btn:focus { border-color:#a7a7aa; border-radius:999px; background:#232326; color:#f5f5f5; }
.login-reskin-page .social_login .btn .fa { margin:0; width:18px; font-size:18px; text-align:center; }
.login-reskin-page .social_login .login-separator { display:flex; margin:24px 0; align-items:center; gap:16px; color:#a7a7aa; }
.login-reskin-page .login-separator::before,
.login-reskin-page .login-separator::after { content:""; height:1px; flex:1; background:#ffffff1a; }
.login-reskin-page .login-separator .sep { color:#a7a7aa; font-size:12px; }
.login-reskin-page .login-separator .sep::before,
.login-reskin-page .login-separator .sep::after { display:none; }
@media (max-width:767px) {
    .login-reskin-page .login-shell { padding:48px 24px 64px; }
    .login-reskin-page .login-layout { grid-template-columns:minmax(0,1fr); gap:24px; }
    .login-reskin-page .login-hero h1 { font-size:52px; }
}
@media (max-width:600px) {
    .login-reskin-page .login-shell { padding:36px 16px 48px; }
    .login-reskin-page .login-hero { margin-bottom:32px; }
    .login-reskin-page .login-hero h1 { font-size:42px; }
    .login-reskin-page .login-panel { padding:24px 20px; }
}