/* One header, shared verbatim by every Witt application and its login page.
   Desktop dimensions follow the supplied DISPO header. App CSS cannot leak in. */
.app-head#wittHeader.witt-header{all:unset;box-sizing:border-box;display:grid;grid-template-columns:437px 325px;justify-content:space-between;align-items:center;gap:20px;width:100%;padding:14px 20px;background:var(--witt-header,#1d428a);color:#fff;font:400 13px/normal 'Open Sans','Segoe UI',Arial,sans-serif}
#wittHeader.witt-header *{all:unset;box-sizing:border-box;font:inherit}
#wittHeader.witt-header .brand{display:flex;align-items:center;gap:12px;width:437px;min-width:0}
#wittHeader.witt-header .company-logo{display:block;flex:none;width:135px;height:auto;object-fit:contain}
#wittHeader.witt-header .brand-title{display:flex;flex-direction:column;width:290px;min-width:0}
#wittHeader.witt-header .brand p{display:block;width:290px;height:14px;margin:3px 0 0;font:400 12px/14px 'Open Sans','Segoe UI',Arial,sans-serif;color:#d0dffa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#wittHeader.witt-header .head-right{display:grid;grid-template-rows:9px 14px 33px;row-gap:0;align-items:start;justify-items:end;width:325px;height:73px;padding:0;position:static;max-width:none}
#wittHeader.witt-header .head-meta{display:block;width:100%;height:9px;font:400 9px/9px 'Open Sans','Segoe UI',Arial,sans-serif;text-align:right;color:#d4e0f1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}
#wittHeader.witt-header #headerVersion{display:inline-block;width:42px;text-align:right;vertical-align:top}
#wittHeader.witt-header .save-state{display:block;width:100%;height:14px;min-width:0;max-width:none;margin-top:7px;font:400 12px/14px 'Open Sans','Segoe UI',Arial,sans-serif;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#wittHeader.witt-header .witt-header-buttons{display:flex;gap:10px;height:33px;margin-top:17px}
#wittHeader.witt-header .head-right button{display:block;box-sizing:border-box;width:142.0625px;height:33px;margin:0;padding:8px 12px;border:1px solid #ffffff40;border-radius:7px;background:#ffffff18;color:#fff;font:600 13px/15px 'Open Sans','Segoe UI',Arial,sans-serif;text-align:center;white-space:nowrap;cursor:pointer}
#wittHeader.witt-header .head-right button:last-child{width:126.171875px}
#wittHeader.witt-header .head-right button:hover{background:#ffffff28}
#wittHeader.witt-header .head-right button:focus-visible{outline:2px solid #fff;outline-offset:3px}
#wittHeader.witt-header .head-right button:disabled{opacity:.55;cursor:default}
/* The supplied DISPO bitmap is unchanged. CSS shows its original @Witt portion;
   every program name is rendered with the same font and the same fixed anchor. */
#wittHeader.witt-header .program-wordmark,.login-brand .program-wordmark{--witt-mark-scale:1;display:block;position:relative;flex:none;width:calc(290px * var(--witt-mark-scale));height:calc(76.859375px * var(--witt-mark-scale));margin:0;padding:0;color:#fff;white-space:nowrap}
#wittHeader.witt-header .program-name,.login-brand .program-name{display:block;position:absolute;left:calc(11px * var(--witt-mark-scale));top:calc(24.5px * var(--witt-mark-scale));width:calc(77px * var(--witt-mark-scale));height:calc(32px * var(--witt-mark-scale));font:700 calc(24px * var(--witt-mark-scale))/calc(32px * var(--witt-mark-scale)) 'Open Sans','Segoe UI',Arial,sans-serif;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#wittHeader.witt-header .witt-mark-crop,.login-brand .witt-mark-crop{display:block;position:absolute;left:calc(88px * var(--witt-mark-scale));top:0;width:calc(202px * var(--witt-mark-scale));height:100%;overflow:hidden;margin:0;padding:0}
#wittHeader.witt-header .witt-program-logo,.login-brand .witt-program-logo{display:block;position:absolute;left:calc(-88px * var(--witt-mark-scale));top:0;width:calc(290px * var(--witt-mark-scale));max-width:none;height:auto;margin:0;padding:0;background:transparent;object-fit:contain;filter:none}
/* A fixed login heading prevents different captions/subtitles changing geometry. */
.login-card>.login-brand{box-sizing:border-box;display:flex;align-items:center;gap:22px;height:122px;padding:22px 26px;background:#1d428a;color:#fff;font:400 13px/normal 'Open Sans','Segoe UI',Arial,sans-serif}
.login-brand>.company-logo{display:block;flex:none;width:205px;max-width:none;height:auto;margin:0;background:transparent}
.login-brand>.brand-title{display:flex;flex-direction:column;flex:none;width:239px;gap:4px;margin:0}
.login-brand .program-wordmark{--witt-mark-scale:0.8241379310344828}
.login-brand .brand-subtitle{display:block;width:239px;height:26px;margin:0;font:400 11px/13px 'Open Sans','Segoe UI',Arial,sans-serif;color:#d5e2f4;overflow:hidden}
@media(max-width:1100px) and (min-width:768px){
 .app-head#wittHeader.witt-header{grid-template-columns:437px 278.234375px;gap:22px;padding:12px}
 #wittHeader.witt-header .head-right{width:278.234375px;height:69px;grid-template-rows:9px 14px 29px}
 #wittHeader.witt-header .witt-header-buttons{height:29px}
 #wittHeader.witt-header .head-right button{width:130.0625px;height:29px;padding:6px}
 #wittHeader.witt-header .head-right button:last-child{width:114.171875px}
}
@media(max-width:767px){
 .app-head#wittHeader.witt-header{grid-template-columns:minmax(0,1fr);gap:12px;padding:10px 12px}
 #wittHeader.witt-header .brand{width:100%;justify-content:flex-start}
 #wittHeader.witt-header .head-right{width:100%;justify-self:stretch}
}
@media(max-width:650px){
 #wittHeader.witt-header .company-logo{width:105px}
 #wittHeader.witt-header .brand-title{width:232px}
 #wittHeader.witt-header .program-wordmark{--witt-mark-scale:.8}
 #wittHeader.witt-header .brand p{display:none}
 #wittHeader.witt-header .head-right{height:57px;grid-template-rows:14px 33px}
 #wittHeader.witt-header .head-meta{display:none}
 #wittHeader.witt-header .save-state{margin-top:0}
 #wittHeader.witt-header .witt-header-buttons{margin-top:10px}
 .login-card>.login-brand{align-items:flex-start;flex-direction:column;gap:12px;height:182px;padding:22px 26px}
 .login-brand>.company-logo{width:190px;max-width:100%}
 .login-brand>.brand-title{width:239px;max-width:100%;gap:0}
 .login-brand .program-wordmark{--witt-mark-scale:.8}
 .login-brand .brand-subtitle{display:none}
}
@media(max-width:370px){
 #wittHeader.witt-header .company-logo{width:90px}
 #wittHeader.witt-header .brand-title{width:217.5px}
 #wittHeader.witt-header .program-wordmark{--witt-mark-scale:.75}
}
@media print{.app-head#wittHeader.witt-header{display:none}}