/* One stable layout baseline for the live form and its editor. */
html#kino-auth-v122 .auth-body{--kino-auth-background:var(--kino-corridor,url('/auth/background-corridor-v122-1920.webp'));isolation:isolate;overflow-x:hidden;background:#001018 var(--kino-auth-background) center/cover fixed no-repeat}
html#kino-auth-v122 .auth-stage{--auth-space:clamp(12px,3vh,32px);position:relative;z-index:1;box-sizing:border-box;display:grid!important;place-items:center!important;height:auto!important;min-height:100svh!important;padding:max(var(--auth-space),env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(var(--auth-space),env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))!important;overflow:visible!important}
html#kino-auth-v122 .auth-stage>.auth-panel{box-sizing:border-box;position:relative;isolation:isolate;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:stretch!important;width:min(620px,100%)!important;height:auto!important;min-width:0!important;min-height:0!important;max-height:none!important;padding:clamp(20px,4vh,40px)!important;margin:0!important;gap:18px!important;overflow:visible!important;clip-path:none!important;border:1px solid #08778b;background:#00131bf2;transform:none!important;box-shadow:0 10px 50px #0005}
html#kino-auth-v122 .auth-panel::before{inset:12px!important;pointer-events:none}
html#kino-auth-v122 .auth-panel::after{pointer-events:none}
html#kino-auth-v122 .qa-background{position:fixed;inset:0;pointer-events:none;z-index:0;background-repeat:no-repeat;background-size:cover;background-position:center}
html#kino-auth-v122 .qa-panel-fill{position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit}
html#kino-auth-v122 .auth-panel .auth-brand{position:static!important;display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:center!important;min-height:0!important;max-width:100%;width:100%;flex:none;margin:0!important;gap:10px!important;transform:none!important}
html#kino-auth-v122 .auth-panel .auth-brand img{display:block;width:clamp(160px,32vh,280px)!important;max-width:90%!important;height:auto!important;margin:0!important;flex:none;transform:none!important;object-fit:contain}
html#kino-auth-v122 .auth-panel .auth-brand p{position:static!important;font:400 9px/1.5 Arial,sans-serif!important;letter-spacing:.5em!important;margin:0!important;transform:none!important}
html#kino-auth-v122 .auth-panel #login-view{display:contents!important}
html#kino-auth-v122 .auth-panel #auth-title{position:static!important;display:block;font:500 clamp(20px,3.5vh,30px)/1.3 KinoLoginDisplay,Consolas,monospace!important;text-align:center;letter-spacing:.025em!important;margin:0!important;transform:none!important}
html#kino-auth-v122 .auth-panel #auth-title::before,html#kino-auth-v122 .auth-panel #auth-title::after{display:none!important}
html#kino-auth-v122 .auth-panel #login-form{position:static!important;display:flex!important;flex-direction:column!important;align-self:stretch!important;justify-content:center!important;align-items:stretch!important;min-height:0!important;height:auto!important;width:100%!important;max-width:420px!important;margin:0 auto!important;padding:0!important;gap:10px!important}
html#kino-auth-v122 .auth-panel #access-hint{min-height:18px!important;font-size:clamp(11px,1.8vh,14px)!important;line-height:1.4!important;text-align:center!important;letter-spacing:.08em!important;margin:0!important}
html#kino-auth-v122 .auth-panel .code-entry{position:relative!important;display:block!important;width:100%!important;max-width:none!important;height:clamp(42px,7vh,60px)!important;min-height:0!important;margin:0!important;transform:none!important}
html#kino-auth-v122 .auth-panel .code-cells{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:clamp(5px,1vw,10px)!important;width:100%;height:100%}
html#kino-auth-v122 .auth-panel .code-cells>span{min-width:0;width:100%;height:100%;aspect-ratio:auto!important;font-size:28px}
html#kino-auth-v122 .auth-panel #keypad{position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:repeat(4,minmax(0,1fr))!important;align-self:stretch!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0!important;padding:0!important;gap:8px!important;border:0!important;transform:none!important}
html#kino-auth-v122 .auth-panel #keypad button{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:clamp(44px,8vh,68px)!important;min-height:0!important;aspect-ratio:auto!important;padding:4px!important;gap:2px;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)!important;border-radius:0!important}
html#kino-auth-v122 .auth-panel #keypad button b{font-size:clamp(24px,4vh,32px)!important;line-height:1!important}
html#kino-auth-v122 .auth-panel #keypad small{font-size:8px!important;line-height:1.2}
html#kino-auth-v122 .auth-panel #keypad button[data-key=mode] b{font-size:23px!important}
html#kino-auth-v122 .auth-panel #keypad button:focus-visible{outline:2px solid #baffff!important;outline-offset:-4px!important;background:#075064!important}
html#kino-auth-v122 .auth-panel #forgot-access{position:static!important;min-height:24px!important;margin:0!important;font-size:13px!important}
html#kino-auth-v122 .auth-panel #new-account{position:static!important;align-self:center!important;display:block;min-height:44px!important;height:auto!important;width:auto!important;max-width:100%;margin:0 auto!important;padding:10px 6px!important;font-size:14px!important;line-height:1.4;transform:none!important}
html#kino-auth-v122 .auth-panel #auth-message{min-height:0!important;margin:0!important}
html#kino-auth-v122 .auth-panel #auth-message:empty{display:none!important}
html#kino-auth-v122[data-auth-keypad=false] .auth-panel #keypad{display:none!important}
html#kino-auth-v122[data-auth-keypad=false] .auth-panel[data-step=login]{gap:28px!important;padding:42px!important;min-height:440px!important}
html#kino-auth-v122 .auth-panel[data-step=register] .auth-brand,html#kino-auth-v122 .auth-panel[data-step=code] .auth-brand{display:none!important}
html#kino-auth-v122 .auth-stage>.auth-panel[data-step=register]{justify-content:flex-start!important;width:min(960px,100%)!important;height:min(840px,calc(100svh - var(--auth-space)*2))!important;min-height:260px!important;overflow:hidden!important;gap:14px!important}
html#kino-auth-v122 .auth-panel .profile-preview{position:static!important;align-self:stretch!important;display:flex;min-height:48px!important;margin:0!important;gap:12px;flex:none}
html#kino-auth-v122 .profile-preview .close-step{position:static!important;margin-left:auto;flex:none}
html#kino-auth-v122 .auth-panel #register-view{display:flex;flex:1 1 0!important;min-height:0!important;overflow:hidden!important}
html#kino-auth-v122 .auth-panel #register-form{display:grid!important;grid-template-rows:auto 44px minmax(0,1fr) 44px!important;gap:10px!important;width:100%;height:100%;min-height:0}
html#kino-auth-v122 .auth-panel .name-input{height:44px!important;margin:0!important}
html#kino-auth-v122 .auth-panel .avatar-field{display:flex!important;flex-direction:column!important;min-height:0!important;overflow:hidden!important;margin:0!important}
html#kino-auth-v122 .auth-panel .avatar-field legend{float:left;flex:none;width:100%;margin:0 0 10px!important}
html#kino-auth-v122 .auth-panel #register-form .avatar-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;flex:1 1 0!important;align-content:start!important;grid-auto-rows:max-content!important;min-height:0!important;max-height:none!important;max-width:none!important;height:auto!important;width:100%;overflow:auto!important;gap:10px!important;margin:0!important;padding:4px 12px 6px 4px!important;scrollbar-gutter:stable;overscroll-behavior:contain}
html#kino-auth-v122 .auth-panel .avatar-choice{width:100%;max-height:none!important}
html#kino-auth-v122 .auth-panel #register-form>.primary{height:44px!important;min-height:44px!important;margin:0!important}
html#kino-auth-v122 .auth-panel [hidden]{display:none!important}
html#kino-auth-v122 .auth-panel[data-step=code]{width:min(560px,100%)!important;min-height:0!important}
html#kino-auth-v122 .auth-panel #code-view{text-align:center}
html#kino-auth-v122 .auth-panel #issued-title{font-size:clamp(19px,4vw,28px);margin:0 0 16px}
html#kino-auth-v122 .auth-panel #code-view .subtitle{margin:0;font-size:14px;line-height:1.5}
html#kino-auth-v122 .auth-panel .issued-code{margin:24px 0;padding:24px 12px 12px}
html#kino-auth-v122 .auth-panel .issued-code output{font-size:clamp(26px,6vw,42px)}
@media(min-width:700px) and (orientation:landscape){
 html#kino-auth-v122[data-auth-keypad=true] .auth-stage>.auth-panel[data-step=login]{width:min(1040px,100%)!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)!important;grid-template-rows:1fr auto 1fr!important;column-gap:clamp(24px,5vw,72px)!important;row-gap:20px!important;min-height:min(620px,calc(100svh - var(--auth-space)*2))!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] .auth-brand{grid-area:1/1!important;align-self:end!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] #auth-title{grid-area:2/1!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] #new-account{grid-area:3/1!important;align-self:start!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] #login-form{grid-area:1/2/4/3!important}
}
@media(orientation:portrait) and (pointer:coarse){html#kino-auth-v122 .auth-body{--kino-auth-background:url('/auth/background-mobile-v14.webp');background-image:var(--kino-auth-background)}}
@media(max-width:600px){
 html#kino-auth-v122 .auth-stage>.auth-panel{padding:22px 18px!important;gap:16px!important}
 html#kino-auth-v122 .auth-panel[data-step=login]{width:min(480px,100%)!important}
 html#kino-auth-v122 .auth-panel #register-form .avatar-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}
}
@media(max-height:620px){
 html#kino-auth-v122 .auth-stage{--auth-space:10px;padding-top:max(10px,env(safe-area-inset-top))!important;padding-bottom:max(10px,env(safe-area-inset-bottom))!important}
 html#kino-auth-v122 .auth-stage>.auth-panel{padding:16px!important;gap:10px!important}
 html#kino-auth-v122 .auth-panel .auth-brand{gap:6px!important}
 html#kino-auth-v122 .auth-panel .auth-brand img{width:180px!important}
 html#kino-auth-v122 .auth-panel #keypad{gap:6px!important}
 html#kino-auth-v122 .auth-panel #keypad button{height:44px!important}
 html#kino-auth-v122 .auth-panel #new-account{min-height:36px!important;padding:6px!important;font-size:12px!important}
 html#kino-auth-v122 .auth-panel #auth-title{font-size:20px!important}
}
@media(orientation:landscape) and (max-height:550px){
 html#kino-auth-v122[data-auth-keypad=true] .auth-stage>.auth-panel[data-step=login]{display:grid!important;grid-template-columns:minmax(110px,.75fr) minmax(0,1.25fr)!important;grid-template-rows:1fr auto 1fr!important;column-gap:20px!important;row-gap:8px!important;width:min(1000px,100%)!important;min-height:0!important;padding:12px 18px!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] .auth-brand{grid-area:1/1!important;align-self:end!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] #auth-title{grid-area:2/1!important;font-size:16px!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] #new-account{grid-area:3/1!important;align-self:start!important}
 html#kino-auth-v122[data-auth-keypad=true] .auth-panel[data-step=login] #login-form{grid-area:1/2/4/3!important;gap:6px!important}
 html#kino-auth-v122 .auth-panel .auth-brand img{width:180px!important;max-width:96%!important}
 html#kino-auth-v122 .auth-panel .code-entry{height:34px!important}
 html#kino-auth-v122 .auth-panel #keypad{gap:4px!important}
 html#kino-auth-v122 .auth-panel #keypad button{height:clamp(30px,9vh,44px)!important;padding:2px!important}
 html#kino-auth-v122 .auth-panel #keypad button b{font-size:22px!important}
 html#kino-auth-v122 .auth-panel #keypad small{font-size:6px!important}
 html#kino-auth-v122 .auth-panel #access-hint{font-size:10px!important;min-height:14px!important}
 html#kino-auth-v122 .auth-panel #forgot-access{min-height:18px!important;font-size:11px!important}
 html#kino-auth-v122[data-auth-keypad=false] .auth-panel[data-step=login]{min-height:0!important;padding:18px!important;gap:14px!important}
 html#kino-auth-v122 .auth-stage>.auth-panel[data-step=register]{padding:10px 16px!important;gap:6px!important;min-height:240px!important}
 html#kino-auth-v122 .auth-panel .profile-preview{min-height:34px!important}
 html#kino-auth-v122 .auth-panel .profile-preview>.kino-avatar-frame{width:34px!important;height:34px!important;min-width:34px!important;flex-basis:34px!important}
 html#kino-auth-v122 .auth-panel #register-form{grid-template-rows:auto 34px minmax(40px,1fr) 34px!important;gap:6px!important}
 html#kino-auth-v122 .auth-panel .name-input,html#kino-auth-v122 .auth-panel #register-form>.primary{height:34px!important;min-height:34px!important}
 html#kino-auth-v122 .auth-panel #register-form .avatar-grid{grid-template-columns:repeat(8,minmax(0,1fr))!important}
}

html#kino-auth-v122 .auth-panel :is(#login-view,#register-view,#code-view,#profile-preview,#forgot-access,.auth-brand)[hidden]{display:none!important}
