/* Retter-Portal v1.2.70 – isolated header layout loaded after app.css */
html body .topbar,
html body .topbar *{
  box-sizing:border-box;
}
html body .topbar{
  position:sticky!important;
  top:0!important;
  z-index:1200!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  border-radius:0!important;
  background:rgba(7,13,24,.94)!important;
  border:0!important;
  border-bottom:1px solid rgba(148,163,184,.14)!important;
  box-shadow:0 10px 30px rgba(2,6,23,.18)!important;
  backdrop-filter:blur(22px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.3)!important;
  transform:none!important;
}
body[data-theme="light"] .topbar{
  background:rgba(255,255,255,.95)!important;
  border-bottom-color:rgba(100,116,139,.18)!important;
  box-shadow:0 10px 30px rgba(15,23,42,.08)!important;
}

/* hard reset against legacy mobile header rules */
html body .topbar :is(.topbar-desktop-shell,.topbar-mobile-shell,.topbar-mobile-primary,.topbar-mobile-secondary,.topbar-mobile-context,.topbar-title,.topbar-context,.topbar-actions,.topbar-user-cluster,.topbar-account-info,.topbar-mobile-brand,.topbar-mobile-account,.department-context-switch,.department-context-static,.theme-switch,.topbar-logout,.topbar-mobile-logout){
  position:static!important;
  inset:auto!important;
  float:none!important;
  clear:none!important;
  transform:none!important;
  translate:none!important;
  rotate:none!important;
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  max-height:none!important;
}
html body .topbar :is(.topbar-product,.topbar-eyebrow,.topbar-mobile-product,.topbar-mobile-version,.topbar-mobile-name,.user-chip,.topbar-role-badge,.department-context-switch>span,.department-context-static>span,.department-context-static>strong){
  writing-mode:horizontal-tb!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  white-space:nowrap!important;
}

/* Desktop */
html body .topbar .topbar-desktop-shell{
  display:grid!important;
  grid-template-columns:minmax(190px,auto) minmax(320px,560px) minmax(420px,1fr)!important;
  align-items:center!important;
  gap:18px!important;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:74px!important;
  margin:0!important;
  padding:10px 24px!important;
}
html body .topbar .topbar-mobile-shell{display:none!important;}
html body .topbar .topbar-desktop-shell .topbar-title{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  width:auto!important;
  margin:0!important;
}
html body .topbar .topbar-desktop-shell .topbar-logo-pair{
  position:relative!important;
  display:block!important;
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  overflow:hidden!important;
}
html body .topbar .topbar-desktop-shell .topbar-logo-pair .topbar-logo{
  position:absolute!important;
  inset:0!important;
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
html body .topbar .topbar-desktop-shell .topbar-product{display:block!important;min-width:0!important;overflow:visible!important;}
html body .topbar .topbar-desktop-shell .topbar-eyebrow{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  min-width:0!important;
  margin:0!important;
  color:var(--muted)!important;
  font-size:.72rem!important;
  font-weight:950!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
  line-height:1!important;
}
html body .topbar .topbar-desktop-shell .topbar-version{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:25px!important;
  padding:4px 7px!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:var(--surface-2)!important;
  color:var(--text)!important;
  font-size:.66rem!important;
  font-weight:950!important;
  letter-spacing:.02em!important;
}
html body .topbar .topbar-desktop-shell .topbar-context{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  width:100%!important;
  margin:0!important;
}
html body .topbar .topbar-desktop-shell .department-context-switch,
html body .topbar .topbar-desktop-shell .department-context-static{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
  max-width:560px!important;
  min-height:46px!important;
  margin:0!important;
  padding:5px 6px 5px 12px!important;
  border:1px solid var(--line)!important;
  border-radius:16px!important;
  background:var(--surface)!important;
  box-shadow:var(--shadow-sm)!important;
}
html body .topbar .topbar-desktop-shell .department-context-switch>span,
html body .topbar .topbar-desktop-shell .department-context-static>span{
  color:var(--muted)!important;
  font-size:.66rem!important;
  font-weight:950!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}
html body .topbar .topbar-desktop-shell .department-context-switch select{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:36px!important;
  min-height:36px!important;
  margin:0!important;
  padding:0 34px 0 12px!important;
  border:1px solid var(--line-soft)!important;
  border-radius:12px!important;
  background:var(--surface-2)!important;
  color:var(--text)!important;
  font-size:.9rem!important;
  font-weight:950!important;
  line-height:1!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
html body .topbar .topbar-desktop-shell .department-context-static strong{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:var(--text)!important;
  font-size:.9rem!important;
  font-weight:950!important;
}
html body .topbar .topbar-desktop-shell .topbar-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  min-width:0!important;
  width:100%!important;
  margin:0!important;
}
html body .topbar .topbar-desktop-shell .theme-switch{
  display:flex!important;
  align-items:center!important;
  gap:2px!important;
  flex:0 0 auto!important;
  width:auto!important;
  height:40px!important;
  margin:0!important;
  padding:3px!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:var(--surface)!important;
}
html body .topbar .topbar-desktop-shell .theme-switch .theme-dot{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:31px!important;
  min-width:31px!important;
  height:31px!important;
  min-height:31px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  font-size:.72rem!important;
}
html body .topbar .topbar-desktop-shell .theme-switch .theme-dot.auto{width:auto!important;min-width:45px!important;padding:0 8px!important;}
html body .topbar .topbar-desktop-shell .topbar-user-cluster{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  min-width:0!important;
  margin:0!important;
}
html body .topbar .topbar-desktop-shell .topbar-account-info{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  min-width:0!important;
  max-width:300px!important;
  margin:0!important;
  padding:4px 5px!important;
  border:1px solid var(--line-soft)!important;
  border-radius:14px!important;
  background:rgba(148,163,184,.06)!important;
}
html body .topbar .topbar-desktop-shell .topbar-role-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  max-width:100px!important;
  min-height:30px!important;
  margin:0!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  font-size:.61rem!important;
  line-height:1!important;
  flex:0 0 auto!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
html body .topbar .topbar-desktop-shell .user-chip,
html body .topbar .topbar-desktop-shell .user-chip.has-role-badge{
  display:block!important;
  min-width:0!important;
  max-width:170px!important;
  margin:0!important;
  padding:0 7px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--text)!important;
  font-size:.84rem!important;
  font-weight:950!important;
  line-height:1.15!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
html body .topbar .topbar-desktop-shell .topbar-logout{
  display:block!important;
  flex:0 0 auto!important;
  width:auto!important;
  margin:0!important;
}
html body .topbar .topbar-desktop-shell .topbar-logout .btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:82px!important;
  height:40px!important;
  min-height:40px!important;
  margin:0!important;
  padding:0 14px!important;
  border-radius:14px!important;
  font-size:.82rem!important;
  white-space:nowrap!important;
}

/* Tablet */
@media (min-width:761px) and (max-width:1180px){
  html body .topbar .topbar-desktop-shell{
    grid-template-columns:minmax(180px,auto) minmax(0,1fr)!important;
    grid-template-areas:"brand actions" "context context"!important;
    gap:9px 14px!important;
    min-height:0!important;
    padding:9px 14px 11px!important;
  }
  html body .topbar .topbar-desktop-shell .topbar-title{grid-area:brand!important;}
  html body .topbar .topbar-desktop-shell .topbar-context{grid-area:context!important;justify-content:flex-start!important;}
  html body .topbar .topbar-desktop-shell .topbar-actions{grid-area:actions!important;gap:7px!important;}
  html body .topbar .topbar-desktop-shell .department-context-switch,
  html body .topbar .topbar-desktop-shell .department-context-static{max-width:620px!important;}
  html body .topbar .topbar-desktop-shell .topbar-account-info{max-width:245px!important;}
  html body .topbar .topbar-desktop-shell .user-chip,
  html body .topbar .topbar-desktop-shell .user-chip.has-role-badge{max-width:125px!important;}
  html body .topbar .topbar-desktop-shell .topbar-logout .btn{min-width:74px!important;padding-inline:11px!important;}
}

/* Mobile */
@media (max-width:760px){
  html body .topbar{
    position:relative!important;
    top:auto!important;
    z-index:1200!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    border-radius:0 0 18px 18px!important;
  }
  html body .topbar .topbar-desktop-shell{display:none!important;}
  html body .topbar .topbar-mobile-shell{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-auto-rows:auto!important;
    align-items:stretch!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:10px!important;
    overflow:visible!important;
  }
  html body .topbar .topbar-mobile-shell :is(.topbar-mobile-primary,.topbar-mobile-context,.topbar-mobile-secondary){
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
  }
  html body .topbar .topbar-mobile-primary{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 78px!important;
    grid-template-rows:44px!important;
    align-items:center!important;
    gap:8px!important;
  }
  html body .topbar .topbar-mobile-primary .menu-toggle{
    position:static!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:var(--surface)!important;
    color:var(--text)!important;
    font-size:1rem!important;
    line-height:1!important;
  }
  html body .topbar .topbar-mobile-brand{
    position:static!important;
    display:grid!important;
    grid-template-columns:26px minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:44px!important;
    min-height:44px!important;
    margin:0!important;
    padding:0 8px!important;
    border:1px solid var(--line-soft)!important;
    border-radius:14px!important;
    background:rgba(148,163,184,.06)!important;
    overflow:hidden!important;
  }
  html body .topbar .topbar-mobile-logo-pair{
    position:relative!important;
    display:block!important;
    width:26px!important;
    min-width:26px!important;
    max-width:26px!important;
    height:26px!important;
    min-height:26px!important;
    max-height:26px!important;
    margin:0!important;
    overflow:hidden!important;
  }
  html body .topbar .topbar-mobile-logo-pair .topbar-logo{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:26px!important;
    min-width:26px!important;
    max-width:26px!important;
    height:26px!important;
    min-height:26px!important;
    max-height:26px!important;
    margin:0!important;
    object-fit:contain!important;
  }
  html body .topbar .topbar-mobile-product{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    color:var(--muted)!important;
    font-size:.66rem!important;
    font-weight:950!important;
    letter-spacing:.07em!important;
    text-transform:uppercase!important;
    line-height:1!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body .topbar .topbar-mobile-version{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:0!important;
    max-width:78px!important;
    height:27px!important;
    min-height:27px!important;
    margin:0!important;
    padding:0 7px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--surface-2)!important;
    color:var(--text)!important;
    font-size:.61rem!important;
    font-weight:950!important;
    line-height:1!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body .topbar .topbar-mobile-primary .topbar-mobile-logout{
    position:static!important;
    display:block!important;
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
    height:44px!important;
    margin:0!important;
  }
  html body .topbar .topbar-mobile-primary .topbar-mobile-logout .btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
    margin:0!important;
    padding:0 8px!important;
    border-radius:14px!important;
    font-size:.78rem!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  html body .topbar .topbar-mobile-context{
    position:static!important;
    display:block!important;
  }
  html body .topbar .topbar-mobile-context .department-context-switch,
  html body .topbar .topbar-mobile-context .department-context-static{
    position:static!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:5px 6px 5px 10px!important;
    border:1px solid var(--line-soft)!important;
    border-radius:15px!important;
    background:rgba(148,163,184,.06)!important;
    overflow:hidden!important;
  }
  html body .topbar .topbar-mobile-context .department-context-switch>span,
  html body .topbar .topbar-mobile-context .department-context-static>span{
    display:block!important;
    width:auto!important;
    min-width:max-content!important;
    max-width:none!important;
    margin:0!important;
    color:var(--muted)!important;
    font-size:.63rem!important;
    font-weight:950!important;
    letter-spacing:.1em!important;
    text-transform:uppercase!important;
    line-height:1!important;
  }
  html body .topbar .topbar-mobile-context .department-context-switch select{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:0 34px 0 11px!important;
    border:1px solid var(--line-soft)!important;
    border-radius:12px!important;
    background:var(--surface-2)!important;
    color:var(--text)!important;
    font-size:.89rem!important;
    font-weight:950!important;
    line-height:1!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body .topbar .topbar-mobile-context .department-context-static strong{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    color:var(--text)!important;
    font-size:.89rem!important;
    font-weight:950!important;
    line-height:1!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body .topbar .topbar-mobile-secondary{
    position:static!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
  }
  html body .topbar .topbar-mobile-secondary .theme-switch{
    position:static!important;
    display:flex!important;
    align-items:center!important;
    gap:2px!important;
    width:auto!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:3px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--surface)!important;
  }
  html body .topbar .topbar-mobile-secondary .theme-dot{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:30px!important;
    min-width:30px!important;
    max-width:30px!important;
    height:30px!important;
    min-height:30px!important;
    max-height:30px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    font-size:.7rem!important;
    line-height:1!important;
  }
  html body .topbar .topbar-mobile-secondary .theme-dot.auto{width:43px!important;min-width:43px!important;max-width:43px!important;padding:0!important;}
  html body .topbar .topbar-mobile-account{
    position:static!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:4px 6px!important;
    border:1px solid var(--line-soft)!important;
    border-radius:14px!important;
    background:rgba(148,163,184,.06)!important;
    overflow:hidden!important;
  }
  html body .topbar .topbar-mobile-account .topbar-role-badge{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:0!important;
    max-width:92px!important;
    height:28px!important;
    min-height:28px!important;
    max-height:28px!important;
    margin:0!important;
    padding:0 8px!important;
    border-radius:999px!important;
    font-size:.6rem!important;
    line-height:1!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body .topbar .topbar-mobile-name{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    color:var(--text)!important;
    font-size:.82rem!important;
    font-weight:950!important;
    line-height:1!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

@media (max-width:390px){
  html body .topbar .topbar-mobile-shell{padding:8px!important;gap:7px!important;}
  html body .topbar .topbar-mobile-primary{grid-template-columns:42px minmax(0,1fr) 70px!important;gap:7px!important;grid-template-rows:42px!important;}
  html body .topbar .topbar-mobile-primary .menu-toggle{width:42px!important;min-width:42px!important;max-width:42px!important;height:42px!important;min-height:42px!important;max-height:42px!important;}
  html body .topbar .topbar-mobile-brand{height:42px!important;min-height:42px!important;padding-inline:6px!important;gap:4px!important;grid-template-columns:23px minmax(0,1fr) auto!important;}
  html body .topbar .topbar-mobile-logo-pair,
  html body .topbar .topbar-mobile-logo-pair .topbar-logo{width:23px!important;min-width:23px!important;max-width:23px!important;height:23px!important;min-height:23px!important;max-height:23px!important;}
  html body .topbar .topbar-mobile-product{font-size:.58rem!important;letter-spacing:.045em!important;}
  html body .topbar .topbar-mobile-version{max-width:70px!important;font-size:.56rem!important;padding-inline:5px!important;}
  html body .topbar .topbar-mobile-primary .topbar-mobile-logout,
  html body .topbar .topbar-mobile-primary .topbar-mobile-logout .btn{width:70px!important;min-width:70px!important;max-width:70px!important;height:42px!important;min-height:42px!important;max-height:42px!important;font-size:.73rem!important;}
  html body .topbar .topbar-mobile-secondary{grid-template-columns:1fr!important;gap:7px!important;}
  html body .topbar .topbar-mobile-secondary .theme-switch{justify-self:start!important;}
  html body .topbar .topbar-mobile-account{height:38px!important;min-height:38px!important;max-height:38px!important;}
}