/* STORPLAY V101 - single shared layout, homepage only */
.sp101-shell{--sp101-width:1120px;--sp101-cols:4;--sp101-mobile-cols:2;--sp101-gap:16px;--sp101-image-height:150px;--sp101-section-gap:24px;--sp101-radius:16px;width:min(calc(100% - 28px),var(--sp101-width))!important;max-width:var(--sp101-width)!important;margin:0 auto!important;box-sizing:border-box!important;min-width:0!important;display:flow-root}
.sp101-shell,.sp101-shell *{box-sizing:border-box}
.sp101-shell .sp13-home,.sp101-shell .container,.sp101-shell .sp19-banner,.sp101-shell .sp19-slider,.sp101-shell .sp19-discover,.sp101-shell .sp13-content,.sp101-shell .sp70-install,.sp101-shell .sp71-install-lower,.sp101-shell .sp25-footer{width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0!important;margin-right:0!important;left:auto!important;right:auto!important;transform:none!important}
.sp101-shell .sp13-home{padding-left:0!important;padding-right:0!important}
.sp101-shell .sp13-content,.sp101-shell .sp19-discover{padding-left:0!important;padding-right:0!important}
.sp101-shell .sp13-grid{display:grid!important;grid-template-columns:repeat(var(--sp101-cols),minmax(0,1fr))!important;gap:var(--sp101-gap)!important;align-items:start!important}
.sp101-shell .sp13-card{width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;border-radius:var(--sp101-radius)!important;overflow:hidden!important}
.sp101-shell .sp13-logo-wrap{height:var(--sp101-image-height)!important;min-height:0!important;max-height:var(--sp101-image-height)!important;aspect-ratio:auto!important;overflow:hidden!important}
.sp101-shell .sp13-logo-wrap img{width:100%!important;height:100%!important;max-height:100%!important;object-fit:contain!important}
.sp101-shell .sp13-section{margin-top:var(--sp101-section-gap)!important;margin-bottom:var(--sp101-section-gap)!important}
.sp101-shell .sp25-footer{margin-top:var(--sp101-section-gap)!important;margin-bottom:100px!important}
#stickyPlayer.sp-player-global{width:min(calc(100% - 28px),var(--sp101-width,1120px))!important;max-width:var(--sp101-width,1120px)!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;box-sizing:border-box!important}
@media(max-width:700px){.sp101-shell .sp13-grid{grid-template-columns:repeat(var(--sp101-mobile-cols),minmax(0,1fr))!important}.sp101-shell .sp13-logo-wrap{height:min(var(--sp101-image-height),140px)!important}.sp101-shell .sp25-footer{margin-bottom:105px!important}#stickyPlayer.sp-player-global{left:50%!important;right:auto!important;width:calc(100% - 28px)!important;transform:translateX(-50%)!important}}

/* V102: real footer inside the same parent shell, not relocated by JS */
.sp101-shell{width:min(calc(100% - 32px),var(--sp101-width))!important;margin-inline:auto!important;padding-inline:0!important}
.sp101-shell>.sp25-footer{width:100%!important;max-width:100%!important;margin:var(--sp101-section-gap) 0 110px!important;padding-inline:0!important}
.sp101-shell>.sp25-footer .sp25-top,.sp101-shell>.sp25-footer .sp25-bottom{max-width:100%!important;box-sizing:border-box!important}
.sp101-shell .sp71-install-lower{min-height:0!important;padding-bottom:0!important;margin-bottom:0!important}
#stickyPlayer.sp-player-global{width:min(calc(100% - 32px),var(--sp101-width,1120px))!important}
@media(max-width:700px){.sp101-shell{width:calc(100% - 32px)!important}.sp101-shell>.sp25-footer{margin-bottom:115px!important}#stickyPlayer.sp-player-global{width:calc(100% - 32px)!important}}

/* V103: una sola anchura exterior y copyright integrado al footer */
.sp101-shell{
  width:min(var(--sp101-width,1120px),calc(100% - 2 * var(--sp103-side,16px)))!important;
  max-width:var(--sp101-width,1120px)!important;
  margin-inline:auto!important;
  padding-inline:0!important;
}
.sp101-shell .sp71-install-lower{
  height:auto!important;min-height:0!important;
  padding:0!important;margin:0!important;
  background:transparent!important;
}
.sp101-shell .sp70-install{margin:0!important;width:100%!important;max-width:100%!important}
.sp101-shell>.sp25-footer{
  width:100%!important;max-width:100%!important;
  margin:var(--sp103-footer-gap,16px) 0 115px!important;
  padding:0!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:var(--sp25-bg,#061630)!important;
}
.sp101-shell>.sp25-footer .sp25-top{
  width:100%!important;max-width:none!important;margin:0!important;
  box-sizing:border-box!important;
}
.sp101-shell>.sp25-footer .sp25-bottom{
  width:100%!important;max-width:none!important;margin:0!important;
  box-sizing:border-box!important;
  background:var(--sp25-bg,#061630)!important;
  color:#d4e8f4!important;
  border-top:1px solid rgba(255,255,255,.14)!important;
  padding:14px 16px!important;
  text-align:center!important;
}
#stickyPlayer.sp-player-global{
  width:min(var(--sp101-width,1120px),calc(100% - 2 * var(--sp103-side,16px)))!important;
  max-width:var(--sp101-width,1120px)!important;
  left:50%!important;right:auto!important;transform:translateX(-50%)!important;
}
@media(max-width:700px){
 .sp101-shell{width:calc(100% - 2 * var(--sp103-side,16px))!important}
 .sp101-shell>.sp25-footer{margin-bottom:120px!important}
 #stickyPlayer.sp-player-global{width:calc(100% - 2 * var(--sp103-side,16px)))!important}
}

/* V104: desktop uses exact admin width; side_margin is MOBILE ONLY. */
@media (min-width:701px){
  .sp101-shell{width:min(100%,var(--sp101-width,1120px))!important;max-width:var(--sp101-width,1120px)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
  #stickyPlayer.sp-player-global{width:min(100%,var(--sp104-layout-width,1120px))!important;max-width:var(--sp104-layout-width,1120px)!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important}
}
@media (max-width:700px){
  .sp101-shell{width:calc(100% - 2 * var(--sp103-side,16px))!important;max-width:none!important;margin-inline:auto!important}
  #stickyPlayer.sp-player-global{width:calc(100% - 2 * var(--sp104-mobile-margin,16px))!important;max-width:none!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important}
}

/* V105: PC and mobile margins are independently administrable.
   At widths >= 701px, both shell and floating player share the exact same outer width. */
@media (min-width:701px){
 .sp101-shell{width:min(var(--sp101-width,1120px),calc(100% - 2 * var(--sp105-pc-margin,24px)))!important;max-width:var(--sp101-width,1120px)!important;margin-inline:auto!important;padding-inline:0!important;box-sizing:border-box!important}
 #stickyPlayer.sp-player-global{width:min(var(--sp104-layout-width,1120px),calc(100% - 2 * var(--sp105-pc-margin,24px)))!important;max-width:var(--sp104-layout-width,1120px)!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;box-sizing:border-box!important}
}
@media (max-width:700px){
 .sp101-shell{width:calc(100% - 2 * var(--sp103-side,16px))!important;max-width:none!important;margin-inline:auto!important}
 #stickyPlayer.sp-player-global{width:calc(100% - 2 * var(--sp104-mobile-margin,16px))!important;max-width:none!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important}
}

/* V106 - Los márgenes administrables sí cambian el ancho visible incluso en PC ancho.
   Ancho efectivo = ancho configurado menos los dos márgenes internos. */
@media (min-width:701px){
  body .sp101-shell{
    width:min(calc(100% - 2 * var(--sp105-pc-margin,24px)),calc(var(--sp101-width,1120px) - 2 * var(--sp105-pc-margin,24px)))!important;
    max-width:none!important;
    margin-left:auto!important;margin-right:auto!important;
  }
  body #stickyPlayer.sp-player-global{
    width:min(calc(100% - 2 * var(--sp105-pc-margin,24px)),calc(var(--sp104-layout-width,1120px) - 2 * var(--sp105-pc-margin,24px)))!important;
    max-width:none!important;
    left:50%!important;right:auto!important;transform:translateX(-50%)!important;
  }
}
@media (max-width:700px){
  body .sp101-shell{width:calc(100% - 2 * var(--sp103-side,16px))!important;margin-inline:auto!important;}
  body #stickyPlayer.sp-player-global{width:calc(100% - 2 * var(--sp104-mobile-margin,16px))!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;}
}
