/* Glass surface only. The existing animated gradient border stays untouched. */
html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar{
  background-color:color-mix(in srgb,var(--cs-surface,#242b35) 32%,transparent)!important;
  background-image:linear-gradient(115deg,rgba(255,255,255,.055),rgba(255,255,255,.008) 42%,rgba(255,255,255,.025))!important;
  -webkit-backdrop-filter:blur(10px) saturate(140%)!important;
  backdrop-filter:blur(10px) saturate(140%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(255,255,255,.025),0 5px 18px rgba(0,0,0,.12)!important;
}
html[data-cs-theme=clear]:root:root:root:root:root:root:root:root body.app-active .topbar{
  background-color:rgba(250,253,255,.38)!important;
  background-image:linear-gradient(115deg,rgba(255,255,255,.12),rgba(255,255,255,.015) 46%,rgba(225,236,250,.055))!important;
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(255,255,255,.5),0 5px 18px rgba(29,59,93,.07)!important;
}
html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar .breadcrumb span{color:var(--cs-secondary,#bdc7d6)!important;opacity:1!important}
html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar :is(.breadcrumb b,.profile-trigger b,.profile-trigger small){color:var(--cs-ink,#eef2f8)!important;opacity:1!important}
html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar .profile-trigger>span:not(.user-avatar){background:transparent!important}
html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar :is(.profile-trigger,.icon-button,.cs-theme-toggle,.topbar-search,input){background:color-mix(in srgb,var(--cs-control,#191f27) 90%,transparent)!important;color:var(--cs-ink,#eef2f8)!important;border-color:var(--cs-line,#46515f)!important;transition:box-shadow .15s ease!important}
@supports not (backdrop-filter:blur(1px)){
  html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar{background-color:var(--cs-surface,#242b35)!important}
}
@media(prefers-reduced-transparency:reduce){
  html[data-cs-theme]:root:root:root:root:root:root:root:root body.app-active .topbar{background-color:var(--cs-surface,#242b35)!important;background-image:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
html[data-cs-theme] body.app-active .profile-menu{transform-origin:top right;animation:cs-profile-menu-enter 130ms ease-out!important}
html[data-cs-theme] body.app-active .profile-menu.cs-profile-menu-leaving{pointer-events:none;animation:cs-profile-menu-leave 120ms ease-in forwards!important}
@keyframes cs-profile-menu-enter{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@keyframes cs-profile-menu-leave{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){html[data-cs-theme] body.app-active .profile-menu{animation:none!important;transform:none!important}}
