html:has(body.ybw-cl) { min-height:100%; background:transparent; }
body.ybw-cl { box-sizing:border-box; min-height:100vh; margin:0; padding:48px 24px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; background-color:var(--background-color); color:var(--text-color); font-family:var(--font); font-size:var(--body-size); line-height:var(--line-height); height:auto; }
body.ybw-cl *,body.ybw-cl *::before,body.ybw-cl *::after { box-sizing:border-box; }
body.ybw-cl a { color:var(--link-color); text-underline-offset:3px; }
body.ybw-cl a:hover { color:var(--link-hover); text-decoration:underline; }
body.ybw-cl a:focus-visible,body.ybw-cl button:focus-visible,body.ybw-cl input:focus-visible,body.ybw-cl select:focus-visible { outline:3px solid var(--focus-color); outline-offset:3px; box-shadow:none; }
body.ybw-cl #login { width:min(100%,var(--card-width)); margin:0; padding:var(--card-padding); background:var(--card-color); border:var(--card-border-width) solid var(--card-border); border-radius:var(--card-radius); box-shadow:var(--shadow); }
body.ybw-cl #login h1 a { display:flex; align-items:center; justify-content:center; font-family:var(--font); font-weight:700; font-size:24px; line-height:1.2; text-align:center; text-indent:0; background:none; color:var(--text-color); margin-bottom:24px; text-decoration:none; }
body.ybw-cl #login h1 a:focus { outline:3px solid var(--focus-color); }
body.ybw-cl #loginform,body.ybw-cl #lostpasswordform,body.ybw-cl #registerform,body.ybw-cl #resetpassform,body.ybw-cl #login form { margin:0; padding:0; background:transparent; border:0; box-shadow:none; color:var(--text-color); overflow:visible; }
body.ybw-cl #login label { display:inline-block; margin-bottom:8px; font-size:var(--body-size); line-height:1.4; }
body.ybw-cl #login input.input { width:100%; min-height:var(--input-height); padding:10px 12px; margin-bottom:20px; background:var(--input-color); color:var(--input-text); border:1px solid var(--input-border); border-radius:var(--input-radius); font-size:max(16px,var(--body-size)); font-family:var(--font); }
body.ybw-cl #login .wp-pwd input { padding-right:44px; }
body.ybw-cl #login .wp-hide-pw { width:44px; height:var(--input-height); color:var(--link-color); }
body.ybw-cl #login input[type=checkbox] { background:var(--input-color); border-color:var(--input-border); width:20px; height:20px; border-radius:4px; }
body.ybw-cl #login input[type=checkbox]:checked::before { color:var(--link-color); }
body.ybw-cl #login .forgetmenot { float:none; margin:0 0 20px; display:flex; align-items:center; gap:8px; }
body.ybw-cl #login .forgetmenot label { margin:0; }
body.ybw-cl #login .submit { float:none; margin:0; }
body.ybw-cl #login .button-primary { float:none; height:auto; min-height:48px; padding:10px 20px; background:var(--button-color); color:var(--button-text); border:1px solid var(--button-color); border-radius:var(--button-radius); font-size:var(--body-size); font-family:var(--font); font-weight:600; line-height:1.5; text-shadow:none; box-shadow:none; white-space:normal; }
body.ybw-cl #login .button-primary:hover { background:var(--button-hover); border-color:var(--button-hover); color:var(--button-hover-text); }
body.ybw-cl #login .button-primary:focus { outline:3px solid var(--focus-color); outline-offset:3px; }
body.ybw-cl #login .button-secondary { color:var(--link-color); }
body.ybw-cl #nav,body.ybw-cl #backtoblog { padding:0; margin:20px 0 0; text-align:center; font-size:14px; }
body.ybw-cl #nav a,body.ybw-cl #backtoblog a,body.ybw-cl .privacy-policy-page-link a { color:var(--link-color); display:inline-block; padding:6px 0; }
body.ybw-cl #nav a:hover,body.ybw-cl #backtoblog a:hover { color:var(--link-hover); }
body.ybw-cl #login .message,body.ybw-cl #login #login_error,body.ybw-cl #login .success { background:var(--input-color); color:var(--input-text); border-radius:8px; margin:0 0 20px; font-size:14px; overflow-wrap:anywhere; }
body.ybw-cl #login .message a,body.ybw-cl #login #login_error a { color:var(--link-color); }
body.ybw-cl .ybw-cl-welcome { text-align:var(--welcome-align); }
body.ybw-cl .ybw-cl-eyebrow { margin:0 0 18px; font-size:12px; font-weight:700; letter-spacing:.16em; }
body.ybw-cl .ybw-cl-welcome h2 { margin:0 0 20px; font-family:var(--heading-font); font-size:clamp(28px,4.1vw,var(--heading-size)); font-weight:var(--heading-weight); line-height:1.12; letter-spacing:-.025em; overflow-wrap:anywhere; }
body.ybw-cl .ybw-cl-intro { margin:0; max-width:40ch; font-size:clamp(16px,1.5vw,19px); line-height:1.7; white-space:normal; }
body.ybw-cl.ybw-cl-center #login .ybw-cl-welcome { margin-bottom:28px; }
body.ybw-cl.ybw-cl-center .ybw-cl-welcome h2 { font-size:min(36px,var(--heading-size)); }
body.ybw-cl .ybw-cl-card-intro { margin-bottom:24px; }
body.ybw-cl .ybw-cl-card-intro h2 { margin:0 0 8px; font-family:var(--heading-font); font-size:22px; line-height:1.3; font-weight:var(--heading-weight); }
body.ybw-cl .ybw-cl-card-intro p { margin:0; color:var(--muted-color); }
body.ybw-cl .ybw-cl-panel { background-color:var(--panel-color); color:var(--panel-text); }
body.ybw-cl .ybw-cl-panel-inner { max-width:540px; width:100%; }
body.ybw-cl .ybw-cl-panel a { color:var(--panel-text); }
body.ybw-cl .ybw-cl-panel a:hover { color:var(--panel-accent); }
body.ybw-cl .ybw-cl-panel a:focus-visible { outline-color:var(--panel-accent); }
body.ybw-cl .ybw-cl-panel .ybw-cl-eyebrow { color:var(--panel-accent); }
body.ybw-cl .ybw-cl-contact { margin-top:36px; }
body.ybw-cl .ybw-cl-contact h3 { margin:0 0 12px; font-size:16px; }
body.ybw-cl .ybw-cl-contact p { margin:8px 0; overflow-wrap:anywhere; }
body.ybw-cl .ybw-cl-socials { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:24px; }
body.ybw-cl .ybw-cl-socials a { display:inline-block; padding:8px 0; font-size:14px; text-decoration:underline; }
body.ybw-cl .ybw-cl-footer { width:min(100%,var(--card-width)); text-align:center; color:var(--footer-color); font-size:14px; overflow-wrap:anywhere; }
body.ybw-cl .ybw-cl-footer .ybw-cl-contact { margin-top:0; }
body.ybw-cl .ybw-cl-footer .ybw-cl-socials { justify-content:center; }
body.ybw-cl .ybw-cl-copyright { margin-top:20px; }
body.ybw-cl .ybw-cl-copyright p { margin:8px 0; }
body.ybw-cl .ybw-cl-notice { border:1px solid var(--input-border); border-left:4px solid var(--link-color); padding:14px 16px; margin-bottom:24px; border-radius:8px; background:var(--input-color); color:var(--input-text); text-align:start; overflow-wrap:anywhere; }
body.ybw-cl .ybw-cl-notice-success { border-left-color:#168253; }
body.ybw-cl .ybw-cl-notice-warning { border-left-color:#a56700; }
body.ybw-cl .ybw-cl-notice h3 { margin:0 0 8px; font-size:15px; }
body.ybw-cl .ybw-cl-notice p { margin:8px 0; }
body.ybw-cl .ybw-cl-notice p:last-child { margin-bottom:0; }
body.ybw-cl.ybw-cl-split { padding-inline-start:calc(var(--panel-width) + 32px); padding-inline-end:32px; }
body.ybw-cl.ybw-cl-split .ybw-cl-panel { position:absolute; inset-block-start:0; inset-inline-start:0; width:var(--panel-width); min-height:100vh; padding:clamp(32px,5vw,80px); display:flex; align-items:center; justify-content:center; }
body.ybw-cl.interim-login { padding:20px; min-height:100%; }
body.ybw-cl.interim-login .ybw-cl-panel,body.ybw-cl.interim-login .ybw-cl-footer { display:none; }
body.ybw-cl.interim-login #login { width:min(100%,var(--card-width)); }
body.ybw-cl .language-switcher { width:min(100%,var(--card-width)); padding:0; margin:0; color:var(--text-color); }
body.ybw-cl .language-switcher form { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; }
body.ybw-cl .language-switcher select { max-width:100%; min-height:40px; }
@media(min-width:861px) { body.ybw-cl.ybw-cl-split { position:relative; } body.ybw-cl.ybw-cl-split .ybw-cl-panel { height:100%; } }
@media(max-width:860px) {
    body.ybw-cl.ybw-cl-split { padding:0 20px 32px; justify-content:flex-start; }
    body.ybw-cl.ybw-cl-split .ybw-cl-panel { position:relative; width:calc(100% + 40px); min-height:0; padding:36px 24px; margin-bottom:8px; }
    body.ybw-cl.ybw-cl-split .ybw-cl-panel-inner { max-width:var(--card-width); }
    body.ybw-cl .ybw-cl-welcome h2 { font-size:min(36px,var(--heading-size)); }
    body.ybw-cl .ybw-cl-contact { margin-top:24px; }
    body.ybw-cl.interim-login { padding:20px; }
}
@media(max-width:480px) { body.ybw-cl { padding:24px 16px; } body.ybw-cl #login { padding:min(24px,var(--card-padding)); } body.ybw-cl #login h1 a { max-width:100%; } }
@media(prefers-reduced-motion:reduce) { body.ybw-cl * { animation:none; transition:none; } }
