/* Student Commons 5.10.0 — reengineered authenticated identity/avatar component. */
:root{
  --nsc510-avatar-size:50px;
  --nsc510-avatar-size-mobile:46px;
  --nsc510-avatar-menu-size:44px;
  --nsc510-avatar-green:#075a3a;
  --nsc510-avatar-gap:#ffffff;
  --nsc510-avatar-ring:conic-gradient(from 20deg,#ff3b30,#ff9500,#ffcc00,#34c759,#00c7be,#0a84ff,#5e5ce6,#af52de,#ff2d55,#ff3b30);
}

html body.nsc5-document.nsc510-member-document .nsc510-account-button{
  appearance:none!important;
  -webkit-appearance:none!important;
  position:relative!important;
  width:var(--nsc510-avatar-size)!important;
  min-width:var(--nsc510-avatar-size)!important;
  height:var(--nsc510-avatar-size)!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:999px!important;
  overflow:visible!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  cursor:pointer!important;
}

/* The gradient lives only on this dedicated outer avatar shell. It never
   becomes the picture/fallback background. */
html body.nsc5-document.nsc510-member-document .nsc510-avatar{
  box-sizing:border-box!important;
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:100%!important;
  padding:3px!important;
  border:0!important;
  border-radius:999px!important;
  background:var(--nsc510-avatar-ring)!important;
  background-image:var(--nsc510-avatar-ring)!important;
  overflow:hidden!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  isolation:isolate!important;
}

html body.nsc5-document.nsc510-member-document .nsc510-avatar-gap{
  box-sizing:border-box!important;
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:100%!important;
  padding:2px!important;
  border-radius:999px!important;
  background:var(--nsc510-avatar-gap)!important;
  overflow:hidden!important;
}

html body.nsc5-document.nsc510-member-document .nsc510-avatar-media{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:100%!important;
  border-radius:999px!important;
  overflow:hidden!important;
  background:var(--nsc510-avatar-green)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

html body.nsc5-document.nsc510-member-document .nsc510-avatar-fallback{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  background:var(--nsc510-avatar-green)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  font:900 1rem/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  text-transform:uppercase!important;
}

html body.nsc5-document.nsc510-member-document .nsc510-avatar-image{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  object-fit:cover!important;
  object-position:center!important;
  background:transparent!important;
  opacity:0!important;
  visibility:hidden!important;
  filter:none!important;
  transform:none!important;
  transition:opacity .12s ease!important;
}
html body.nsc5-document.nsc510-member-document .nsc510-avatar[data-avatar-state="photo"] .nsc510-avatar-image{
  opacity:1!important;
  visibility:visible!important;
}
html body.nsc5-document.nsc510-member-document .nsc510-avatar[data-avatar-state="photo"] .nsc510-avatar-fallback{
  opacity:0!important;
  visibility:hidden!important;
}
html body.nsc5-document.nsc510-member-document .nsc510-avatar[data-avatar-state="fallback"] .nsc510-avatar-image,
html body.nsc5-document.nsc510-member-document .nsc510-avatar[data-avatar-state="pending"] .nsc510-avatar-image{
  opacity:0!important;
  visibility:hidden!important;
}

html body.nsc5-document.nsc510-member-document .nsc510-account-button:hover .nsc510-avatar,
html body.nsc5-document.nsc510-member-document .nsc510-account-button:focus-visible .nsc510-avatar{
  filter:saturate(1.08) brightness(1.02)!important;
}
html body.nsc5-document.nsc510-member-document .nsc510-account-button:focus-visible{
  outline:3px solid #1769aa!important;
  outline-offset:3px!important;
}

html body.nsc5-document.nsc510-member-document .nsc510-menu-avatar{
  display:block!important;
  flex:0 0 var(--nsc510-avatar-menu-size)!important;
  width:var(--nsc510-avatar-menu-size)!important;
  height:var(--nsc510-avatar-menu-size)!important;
  border-radius:999px!important;
  overflow:visible!important;
  background:transparent!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
html body.nsc5-document.nsc510-member-document .nsc510-menu-avatar .nsc510-avatar-fallback{
  font-size:.86rem!important;
}

/* Explicitly mark the component as Portal-scanner-owned-by-Community. The
   attribute is the primary protection; pointer styling here makes it clear
   the whole shell remains the account control, not an auto-replaced initial. */
html body.nsc5-document.nsc510-member-document [data-nsp-avatar-skip].nsc510-account-button,
html body.nsc5-document.nsc510-member-document [data-nsp-avatar-skip].nsc510-avatar{
  background-color:transparent!important;
}

@media(max-width:720px){
  html body.nsc5-document.nsc510-member-document .nsc510-account-button{
    width:var(--nsc510-avatar-size-mobile)!important;
    min-width:var(--nsc510-avatar-size-mobile)!important;
    height:var(--nsc510-avatar-size-mobile)!important;
  }
  html body.nsc5-document.nsc510-member-document .nsc510-avatar-fallback{font-size:.92rem!important}
}

@media(prefers-reduced-motion:reduce){
  html body.nsc5-document.nsc510-member-document .nsc510-avatar-image{transition:none!important}
}

@media(forced-colors:active){
  html body.nsc5-document.nsc510-member-document .nsc510-avatar{background:Highlight!important}
  html body.nsc5-document.nsc510-member-document .nsc510-avatar-gap{background:Canvas!important}
  html body.nsc5-document.nsc510-member-document .nsc510-avatar-media,
  html body.nsc5-document.nsc510-member-document .nsc510-avatar-fallback{
    background:Highlight!important;
    color:HighlightText!important;
    -webkit-text-fill-color:HighlightText!important;
  }
}