/* The live form and QA use the same responsive layout and saved adjustments. */
.auth-body{isolation:isolate;overflow-x:hidden}.auth-stage{position:relative;z-index:1}
.auth-panel{isolation:isolate}.qa-background{position:fixed;inset:0;pointer-events:none;z-index:0;background-repeat:no-repeat}.qa-panel-fill{position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit}
.auth-panel[data-step=register] .auth-brand{display:none!important}
@media(orientation:landscape) and (max-height:550px){
 html[data-auth-input=touch] .auth-body .auth-stage:has(>.auth-panel[data-step=register]){height:100dvh!important;min-height:100dvh!important;padding:12px 20px!important;box-sizing:border-box}
 html[data-auth-input=touch] .auth-stage{box-sizing:border-box;min-height:100dvh;height:auto!important;padding:12px 20px!important;align-items:center!important;overflow:visible!important}
 html[data-auth-input=touch] .auth-stage>.auth-panel[data-step=login]{box-sizing:border-box;width:min(920px,calc(100vw - 40px))!important;min-height:0!important;height:auto!important;max-height:calc(100dvh - 24px)!important;overflow:auto!important;display:grid!important;grid-template-columns:minmax(120px,.65fr) minmax(0,1.35fr)!important;grid-template-rows:1fr auto 1fr!important;gap:8px 20px!important;padding:12px 20px!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #login-view{display:contents!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] .auth-brand{grid-area:1/1!important;position:static!important;align-self:end!important;min-height:0!important;margin:0!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] .auth-brand img{width:190px!important;max-width:100%!important;height:auto!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] .auth-brand p{margin-top:8px!important;font-size:9px!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #auth-title{grid-area:2/1!important;position:static!important;font-size:17px!important;margin:4px 0!important;text-align:center}
 html[data-auth-input=touch] .auth-panel[data-step=login] #new-account{grid-area:3/1!important;position:static!important;align-self:start!important;margin:0!important;min-height:36px!important;font-size:12px!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #login-form{grid-area:1/2/4/3!important;position:static!important;display:flex!important;flex-direction:column!important;justify-content:center!important;height:auto!important;min-height:0!important;gap:6px!important;margin:0!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #access-hint{font-size:11px!important;line-height:16px!important;min-height:16px!important;margin:0!important;text-align:center!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] .code-entry{height:38px!important;min-height:38px!important;margin:0!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] .code-cells{height:38px!important}.auth-panel[data-step=login] .code-cells>span{aspect-ratio:auto}
 html[data-auth-input=touch] .auth-panel[data-step=login] #keypad{position:static!important;width:100%!important;gap:5px!important;margin:0!important;padding:0!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #keypad button{height:clamp(34px,9dvh,42px)!important;min-height:34px!important;padding:2px!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #keypad button b{font-size:22px!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #keypad small{font-size:7px!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #forgot-access{font-size:11px!important;min-height:18px!important;margin:0!important}
 html[data-auth-input=touch] .auth-panel[data-step=login] #auth-message{grid-column:1/-1;min-height:0!important;margin:0!important}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register]{display:flex!important;flex-direction:column!important;height:calc(100dvh - 24px)!important;min-height:calc(100dvh - 24px)!important;gap:8px;padding:10px 18px!important;overflow-y:auto!important}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register] .profile-preview{align-self:stretch;min-height:34px!important;margin:0!important}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register] #register-view{min-height:150px!important;flex:1 1 0!important}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register] #register-form{grid-template-rows:auto 36px minmax(54px,1fr) 36px;gap:6px}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register] .name-input{height:36px}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register] #register-form .avatar-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
 :is(.auth-stage,html[data-playback-device=projector] .auth-stage)>.auth-panel[data-step=register] #register-form>.primary{min-height:36px}
}