/* Approved bizhub assist identity; compact header treatment. */
.owner-alias{display:inline-block;font-size:.92em;font-weight:400;line-height:1.6;white-space:nowrap}
.bizhub-lockup{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;direction:ltr}
.bizhub-lockup .bizhub-mark{display:block;flex:0 0 40px;width:40px;height:40px;max-width:none;object-fit:contain;border-radius:10px}
.bizhub-lockup>span{white-space:nowrap}
.brand-row,.app-brand-row{direction:ltr}
.brand-divider{flex-shrink:0}
@media(max-width:800px){
 .brand-row,.app-brand-row{gap:10px}
 .km-logo,.app-km-logo{width:108px}
 .bizhub-lockup{gap:6px}
 .bizhub-lockup .bizhub-mark{width:34px;height:34px;flex-basis:34px;border-radius:8px}
 .app-identity{min-width:0}
 .app-identity+.account-actions{max-width:none;align-self:flex-end;margin-inline-start:auto}
 .shell:has(.app-identity)>header{flex-wrap:wrap;gap:14px}
 .app-identity .app-brand-row{gap:10px}
 .identity .logo,.security-brand>img{width:108px}
 .security-brand,.identity{gap:10px;flex-wrap:wrap}
}
@media(max-width:380px){
 .brand-row,.app-brand-row{gap:8px}
 .km-logo,.app-km-logo{width:94px}
 .bizhub-lockup .bizhub-mark{width:30px;height:30px;flex-basis:30px}
 .brand.bizhub-lockup,.app-wordmark.bizhub-lockup{font-size:11px;letter-spacing:1px}
 .brand.bizhub-lockup strong,.app-wordmark.bizhub-lockup strong{font-size:18px}
}

/* Primary app identity first; manufacturer identity is secondary. */
.brand-row,.app-brand-row{gap:16px}
.bizhub-lockup{order:0}
.bizhub-lockup .bizhub-mark{border-radius:0}
.brand-divider,.identity>.divider{order:1;opacity:.7}
.km-logo,.app-km-logo,.identity>.logo,.security-brand>img{order:2;width:112px;opacity:.82}
.security-brand{gap:16px}
@media(max-width:800px){
 .brand-row,.app-brand-row,.identity,.security-brand{gap:10px}
 .km-logo,.app-km-logo,.identity>.logo,.security-brand>img{width:100px}
 .bizhub-lockup .bizhub-mark{border-radius:0}
}
@media(max-width:380px){
 .brand-row,.app-brand-row,.identity,.security-brand{gap:8px}
 .km-logo,.app-km-logo,.identity>.logo,.security-brand>img{width:90px}
}

/* One legible dropdown affordance across Safari, desktop and RTL pages. */
select:not([multiple]):not([size]){
 -webkit-appearance:none!important;appearance:none!important;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='20' viewBox='0 0 16 20'%3E%3Cpath d='m4 7 4-4 4 4M4 13l4 4 4-4' fill='none' stroke='%23efd05b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
 background-repeat:no-repeat!important;background-position:right 13px center!important;background-size:16px 20px!important;
 padding-inline-end:42px!important;min-height:44px;
}
[dir=rtl] select:not([multiple]):not([size]){background-position:left 13px center!important}
.language-picker select,.language-toolbar select{direction:ltr}
[dir=rtl] .language-picker select:not([multiple]):not([size]),[dir=rtl] .language-toolbar select:not([multiple]):not([size]){background-position:right 13px center!important;padding-inline-end:42px!important;padding-inline-start:12px!important}
summary::marker{color:#efd05b}
.model-picker-chevron,.manual-toolbar button,.catalog-collapse{color:#efd05b!important}

/* Recognisable access action, even when the system disables motion. */
.request:has(.request-icon){position:relative;isolation:isolate;overflow:hidden;display:inline-flex;gap:14px;min-height:50px;padding:0 16px 0 0;border:1px solid #f8dc7c;border-radius:10px;background:#efd05b;color:#142c48;font-size:14px;font-weight:750;box-shadow:0 3px 0 #8a742e}
.request:has(.request-icon):hover{background:#ffe184;border-color:#ffe8a0}
.request-icon{position:relative;display:grid;place-items:center;align-self:stretch;width:50px;flex:0 0 50px;background:#82d7ce;color:#142c48}
.request-icon:after{content:'';position:absolute;right:-6px;top:calc(50% - 6px);width:12px;height:12px;background:#82d7ce;transform:rotate(45deg)}
.request-arrow{font-size:21px;font-weight:500;line-height:1}
body:has(#welcome:not([hidden])) .request{animation:access-beacon 3.6s .6s ease-in-out infinite}
body:has(#welcome:not([hidden])) .request:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,#fff8 48%,transparent 65%);transform:translateX(-130%);animation:access-shine 3.6s .6s ease-in-out infinite}
body:has(#welcome:not([hidden])) .request-arrow{animation:access-point 3.6s .6s ease-in-out infinite}
@keyframes access-beacon{0%,100%{box-shadow:0 3px 0 #8a742e,0 0 0 0 #efd05b00}35%,55%{box-shadow:0 3px 0 #8a742e,0 0 0 5px #efd05b25,0 0 22px #efd05b30}}
@keyframes access-shine{0%,20%{transform:translateX(-130%)}60%,100%{transform:translateX(130%)}}
@keyframes access-point{0%,22%,65%,100%{transform:none}38%,52%{transform:translateX(4px)}}
@media(prefers-reduced-motion:reduce){body:has(#welcome:not([hidden])) .request,body:has(#welcome:not([hidden])) .request:after,body:has(#welcome:not([hidden])) .request-arrow{animation:none!important}body:has(#welcome:not([hidden])) .request:after{display:none}}

/* Fit the available width; retain natural scrolling for genuinely long pages. */
body>.shell{max-width:100%}
.brand-row,.app-brand-row{flex-wrap:wrap}
.language-toolbar{min-width:0;max-width:100%}
.language-heading{overflow-wrap:anywhere}
.language-toolbar select{max-width:50%}
body:has(#welcome:not([hidden])) .shell{padding-top:clamp(14px,3svh,28px);padding-bottom:14px}
@media(max-width:899px) and (min-height:781px){#welcome .motion-scene{height:clamp(160px,26svh,226px);margin-bottom:16px}}
@media(min-width:900px) and (max-height:800px){
 body:has(#welcome:not([hidden])) .welcome-brand{margin-bottom:20px}
 #welcome{min-height:260px;gap:32px}
 #welcome .motion-scene{height:260px;width:100%;margin:0}
 #welcome .art{width:340px;height:340px;top:-40px;margin-left:-170px}
 body:has(#welcome:not([hidden])) .access{margin-top:22px;padding-top:18px}
 body:has(#welcome:not([hidden])) .dedication{margin-top:18px}
 body:has(#welcome:not([hidden])) .copyright{margin-top:20px}
}
@media(max-width:899px) and (max-height:780px){
 body:has(#welcome:not([hidden])) .shell{padding-top:12px;padding-bottom:10px}
 #welcome .motion-scene{height:clamp(76px,calc(100svh - 550px),200px)}
}
@media(max-width:899px){
 .request-access-page .shell:has(.signin:not([hidden])){width:min(100%,560px);padding:16px 20px 12px}
 .request-access-page .signin .back{margin-bottom:8px}
 .request-access-page .language-picker{top:84px}
 .request-access-page .signin form{padding:14px}
 .request-access-page #access-form input{margin-bottom:12px}
 .request-access-page .signin .intro{margin:6px 0 10px}
 .request-access-page .email-help{margin-top:12px;padding-top:10px}
 .request-access-page .copyright{margin-top:6px!important}
}
/* Sign-in uses compact spacing without reducing input or button touch areas. */
body:has(#signin:not([hidden])) .shell{width:min(100%,520px);padding:14px 22px 12px}
body:has(#signin:not([hidden])) .welcome-brand{margin-bottom:12px}
body:has(#signin:not([hidden])) .signin{max-width:none}
body:has(#signin:not([hidden])) .signin .back{margin-bottom:2px}
body:has(#signin:not([hidden])) .signin h1{font-size:29px}
body:has(#signin:not([hidden])) .signin .intro{margin:6px 0 12px}
body:has(#signin:not([hidden])) .signin form{padding:16px 18px}
body:has(#signin:not([hidden])) .signin label{margin-bottom:6px}
body:has(#signin:not([hidden])) .signin input:not([type=checkbox]){min-height:48px;padding:11px 13px;margin-bottom:12px}
body:has(#signin:not([hidden])) .remember-row{margin:0 0 10px;padding:0;min-height:44px}
body:has(#signin:not([hidden])) .signin .primary{min-height:48px;padding:11px 18px;margin-top:0}
body:has(#signin:not([hidden])) .signin form>.back{margin:4px 0 0!important}
body:has(#signin:not([hidden])) .access{margin-top:16px;padding-top:12px}
body:has(#signin:not([hidden])) .access p{margin-bottom:10px;line-height:1.7;font-size:12px}
body:has(#signin:not([hidden])) .copyright{margin-top:12px;line-height:1.6}
@media(min-width:900px){body:has(#signin:not([hidden])) .access{display:flex;gap:16px;text-align:left}body:has(#signin:not([hidden])) .access p{margin:0;flex:1}}
@media(min-width:600px) and (max-width:899px){
 .request-access-page #access-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'name-label email-label' 'name email' 'privacy privacy' 'message message' 'send send';column-gap:16px}
 #access-form label[for=request-name]{grid-area:name-label}#access-form label[for=request-email]{grid-area:email-label}
 #access-form #request-name{grid-area:name}#access-form #request-email{grid-area:email}
 #access-form [data-i18n=privacy]{grid-area:privacy}#access-form #request-message{grid-area:message}#access-form #submit-request{grid-area:send}
}
