/* Desktop uses the mobile ocean canvas; component themes stay independent. */
@layer fenris-desktop-ocean {
 @media screen and (min-width:901px){
  html:has(body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))){
   background-color:#000105!important;
  }
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app])){
   isolation:isolate!important;
   background-color:#000105!important;
   background-image:radial-gradient(ellipse at 95% 10%,rgba(6,16,38,.04),transparent 58%),linear-gradient(155deg,#00030a 0%,#000207 54%,#000104 100%)!important;
   background-repeat:no-repeat!important;background-size:100% 100%!important;background-attachment:fixed!important;
  }
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean{
   display:block!important;position:fixed!important;inset:0!important;z-index:-1!important;
   pointer-events:none!important;overflow:hidden!important;contain:strict;
   background:radial-gradient(ellipse at 95% 10%,rgba(6,16,38,.04),transparent 58%),linear-gradient(155deg,#00030a 0%,#000207 54%,#000104 100%)!important;
  }
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean::before,
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean::after{
   content:"";position:absolute;inset:-50%;pointer-events:none;will-change:transform,opacity;
  }
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean::before{
   background:radial-gradient(ellipse at 56% 38%,rgba(12,38,85,.23),rgba(5,17,43,.07) 20%,transparent 42%);
   animation:fenris-desktop-ocean-drift 7s ease-in-out -2s infinite alternate;
  }
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean::after{
   background:radial-gradient(ellipse at 40% 60%,rgba(8,30,72,.19),rgba(3,12,34,.05) 23%,transparent 44%);
   animation:fenris-desktop-ocean-tide 10s ease-in-out -5s infinite alternate;
  }
  body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app])) .fenris-atmosphere{display:none!important}
  /* Only page-level wrappers expose the canvas; cards and navigation keep their surfaces. */
  body:is(.cp-body,.bp-body) :is(.cp-main,.cp-content,.bp-main,.bp-content),
  body:has([data-admin-app]) :is(.ama-app,.ama-app>main),
  body:has([data-brand-app]) .mba-shell,
  body.agency-page :is(.agency-shell,.agency-message-shell){background-color:transparent!important;background-image:none!important}
  @keyframes fenris-desktop-ocean-drift{from{transform:translate3d(-20%,-16%,0) scale(.94);opacity:.55}to{transform:translate3d(20%,16%,0) scale(1.12);opacity:1}}
  @keyframes fenris-desktop-ocean-tide{from{transform:translate3d(20%,14%,0) scale(1.1);opacity:1}to{transform:translate3d(-20%,-16%,0) scale(.95);opacity:.5}}
  @media(prefers-reduced-motion:reduce){
   body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean::before,
   body:is(.cp-body,.bp-body,.agency-page,[data-professional-space],:has([data-admin-app]),:has([data-brand-app]))>.fenris-mobile-ocean::after{animation:none!important;will-change:auto!important}
  }
 }
}

@layer fenris-desktop-ocean {
 @media screen and (min-width:901px){
  body:is(.cp-body,.bp-body,.agency-page) .creator-switcher{
   background-color:#111519!important;
   background-image:linear-gradient(115deg,#151a1f,#0d1115)!important;
  }
 }
}