.header-login[hidden]{display:none}
.header-login{border:0;cursor:pointer;background:transparent;color:var(--ink)}
.header-login:hover{background:var(--hair)}
.site-login{position:fixed;width:min(440px,calc(100% - 32px));max-height:calc(100% - 32px);padding:36px 32px 28px;border:1px solid var(--hair);border-radius:var(--r-lg);background:var(--surface);color:var(--ink);text-align:center;box-shadow:var(--shadow-lg)}
.site-login::backdrop{background:rgba(15,23,41,.56)}
.site-login [hidden]{display:none!important}
.login-close{position:absolute;top:10px;right:12px;width:40px;height:40px;border:0;border-radius:50%;background:transparent;display:grid;place-items:center;padding:0;color:var(--muted);cursor:pointer}
.login-close:hover{background:var(--hair)}
.login-close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round}
#site-login-title:focus{outline:none}
.login-brand{margin:0 auto 16px;border-radius:12px}
.site-login h2{font-size:clamp(25px,6vw,34px);margin-bottom:8px}
.login-intro,.login-legal{color:var(--muted);font-size:14px}
.site-login [data-view]{margin-top:24px;display:grid;gap:10px}
.site-login .btn{width:100%;border:0;cursor:pointer}
.site-login .btn:disabled{cursor:wait;opacity:.65}
.site-login label{text-align:left;font-size:14px}
.site-login input{width:100%;border:1px solid var(--hair-2);border-radius:12px;padding:11px 12px;font:inherit}
#login-google{min-height:40px;display:grid;justify-items:center}
#login-message{font-size:14px;margin:12px 0;color:var(--ink-2)}
#login-message:empty{margin:0}
#login-code-address,#login-account-email{overflow-wrap:anywhere}
.login-legal{margin-top:22px}
.login-legal a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:530px){
  .header-login{padding:0 8px}
  .header-actions{gap:2px}
  .site-header .main-nav{display:none}
}
@media(max-width:380px){
  .site-login{padding-inline:20px}
  .site-header .header-cta{padding-inline:8px}
}