/* The application action remains available independently of the collapsed navigation. */
header>.wrap{gap:18px}
header .header-apply{flex-shrink:0;white-space:nowrap}
.mobile-menu-toggle{display:none}
header .mobile-navigation[hidden]{display:none!important}
header .mobile-navigation{position:absolute;top:100%;left:0;right:0;display:flex;flex-direction:column;align-items:stretch;gap:0;margin:0;padding:12px 24px 20px;background:#101820;border-bottom:1px solid #69717a;box-shadow:0 8px 16px #0002}
header .mobile-navigation a{display:block;padding:14px 12px;min-height:48px;font:400 16px/1.4 var(--font-family);color:#fff;text-decoration:none;border-bottom:1px solid #69717a}
html[data-theme="paint"] header .mobile-navigation{background:#c0c0c0;border-bottom:2px solid #535353}
html[data-theme="paint"] header .mobile-navigation a{color:#101820;font-family:Arial,sans-serif;border-bottom-color:#888}
@media(max-width:1100px){
 header>.wrap,html[data-theme="paint"] header>.wrap{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;gap:8px 12px;padding:10px 16px}
 header>.wrap>nav{display:none}
 header>.wrap>.logo{grid-column:1;grid-row:1;justify-self:start;min-width:0;max-width:100%}
 header .header-apply{grid-column:2;grid-row:1;margin:0;font-size:14px;padding:11px 14px;min-height:44px;background:#ffe833;color:#101820}
 html[data-theme="paint"] header .header-apply{padding:10px 12px;font-size:14px;min-height:44px}
 header .mobile-menu-toggle{grid-column:3;grid-row:1;display:grid;place-items:center;min-width:44px;min-height:44px;color:#fff;background:#1a212e;border:1px solid #69717a;border-radius:8px;cursor:pointer}
 html[data-theme="paint"] header .mobile-menu-toggle{color:#101820;background:#c0c0c0;border:2px solid;border-color:#fff #555 #555 #fff;border-radius:0}
 header>.wrap>.design-switch{display:flex;grid-column:1/-1;grid-row:2;justify-self:end;margin:0}
 header .mobile-menu-toggle:focus-visible{outline:3px solid #ffe833;outline-offset:3px}
 html[data-theme="paint"] header .mobile-menu-toggle:focus-visible{outline-color:#101820}
 header .logo img{width:180px}
}
@media(max-width:620px){
 header>.wrap,html[data-theme="paint"] header>.wrap{padding:8px 12px;gap:8px}
 header .logo img{width:130px}
 html[data-theme="paint"] header .retro-brand{width:124px}
 html[data-theme="paint"] header .retro-brand-label{font-size:7px}
 html[data-theme="paint"] header .retro-brand-face{padding:5px;gap:5px}
 html[data-theme="paint"] header .retro-brand-name{font-size:10px}
 header .mobile-navigation{padding:8px 12px 16px}
}
@media(max-width:360px){
 header>.wrap,html[data-theme="paint"] header>.wrap{padding:8px;gap:6px}
 header .logo img{width:100px}
 html[data-theme="paint"] header .retro-brand{width:102px}
 html[data-theme="paint"] header .retro-brand-label{font-size:6px}
 html[data-theme="paint"] header .retro-brand-name{font-size:8px}
 html[data-theme="paint"] header .retro-brand-face{gap:4px;padding:4px}
 header .header-apply,html[data-theme="paint"] header .header-apply{font-size:13px;padding:10px}
}

/* The sticky header already provides the persistent application action. */
.mobile-apply,.mobile-apply:not([hidden]){display:none!important}
@media(max-width:620px){.site,html[data-theme="paint"] .site{padding-bottom:40px}}
header .mobile-navigation{max-height:calc(100dvh - 90px);overflow-y:auto}