
/* FormyDog · Section 04 BOOSTERS — compact dock + clearer action colors */
html body main.app>.game-layout>.boosters{
  order:3!important;
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  grid-template-rows:9px 27px!important;
  grid-auto-rows:27px!important;
  align-items:center!important;
  justify-items:stretch!important;
  gap:3px!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:3px 4px 4px!important;
  box-sizing:border-box!important;
  border:1px solid #4e9bd0!important;
  border-radius:10px!important;
  background:linear-gradient(115deg,#08274c 0%,#0b3a66 52%,#075568 100%)!important;
  box-shadow:inset 0 1px 0 #ffffff24,0 3px 9px #031a3538!important;
}
html body main.app>.game-layout>.boosters::before,
html body main.app>.game-layout>.boosters::after{display:none!important;content:none!important}
html body main.app>.game-layout>.boosters>.side-title{
  grid-column:1/-1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:4px!important;
  min-width:0!important;
  min-height:9px!important;
  height:9px!important;
  margin:0!important;
  padding:0 2px!important;
  border:0!important;
  color:#f2fbff!important;
  font-size:7px!important;
  font-weight:1000!important;
  line-height:9px!important;
  letter-spacing:.12em!important;
}
html body main.app>.game-layout>.boosters>.side-title span::before{
  content:"04 · "!important;
  color:#83e5ff!important;
}
html body main.app>.game-layout>.boosters>.side-title small{
  color:#c4eaff!important;
  font-size:6px!important;
  line-height:8px!important;
  letter-spacing:.06em!important;
}
html body main.app>.game-layout>.boosters .booster,
html body main.app>.game-layout>.boosters .mini-btn{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  justify-self:stretch!important;
  align-self:stretch!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:27px!important;
  min-height:27px!important;
  max-height:27px!important;
  margin:0!important;
  padding:1px!important;
  box-sizing:border-box!important;
  border:1px solid transparent!important;
  border-radius:7px!important;
  box-shadow:inset 0 1px 0 #ffffffb8,0 1px 2px #00152a55!important;
  transition:transform .12s ease,filter .12s ease,box-shadow .12s ease!important;
  overflow:visible!important;
  cursor:pointer!important;
}
html body main.app>.game-layout>.boosters .booster{
  flex-direction:column!important;
  gap:0!important;
}
html body main.app>.game-layout>.boosters .booster img{
  display:block!important;
  flex:0 0 19px!important;
  width:19px!important;
  height:19px!important;
  max-width:100%!important;
  max-height:19px!important;
  margin:0 auto!important;
  object-fit:contain!important;
  filter:drop-shadow(0 1px 1px #00172c33)!important;
}
html body main.app>.game-layout>.boosters .booster>span{display:none!important}
html body main.app>.game-layout>.boosters .booster em{
  position:absolute!important;
  top:-4px!important;
  right:-3px!important;
  z-index:3!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:11px!important;
  width:auto!important;
  height:11px!important;
  margin:0!important;
  padding:0 3px!important;
  border:1px solid #ffffff!important;
  border-radius:99px!important;
  background:#092b4a!important;
  color:#ffffff!important;
  font-size:7px!important;
  line-height:1!important;
  font-style:normal!important;
  font-weight:1000!important;
  box-shadow:0 1px 3px #00152a66!important;
}
html body main.app>.game-layout>.boosters .booster em i{font-size:7px!important;line-height:1!important;font-style:normal!important}
/* Three game powers: blue, coral and violet. */
html body main.app>.game-layout>.boosters [data-booster="rocket"]{
  background:linear-gradient(145deg,#f0fbff,#cbeeff)!important;
  border-color:#69b7e8!important;
}
html body main.app>.game-layout>.boosters [data-booster="bomb"]{
  background:linear-gradient(145deg,#fff5ef,#ffd9c7)!important;
  border-color:#ef9b72!important;
}
html body main.app>.game-layout>.boosters [data-booster="magnet"]{
  background:linear-gradient(145deg,#f7f1ff,#e2d5ff)!important;
  border-color:#ad91ed!important;
}
/* Utility controls: cyan, green, slate and amber. */
html body main.app>.game-layout>.boosters .mini-btn{
  font-size:0!important;
  line-height:0!important;
  background:#eaf6ff!important;
  border-color:#8bc8ec!important;
}
html body main.app>.game-layout>.boosters .mini-btn::before{
  display:block!important;
  position:static!important;
  flex:0 0 auto!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  mask:none!important;
  -webkit-mask:none!important;
  font-family:"Font Awesome 5 Free"!important;
  font-weight:900!important;
  font-style:normal!important;
  font-size:13px!important;
  line-height:1!important;
  text-rendering:auto!important;
  -webkit-font-smoothing:antialiased!important;
  color:#155c96!important;
}
html body main.app>.game-layout>.boosters #soundBtn{
  background:linear-gradient(145deg,#f1fbff,#d4efff)!important;
  border-color:#74bee9!important;
}
html body main.app>.game-layout>.boosters #soundBtn::before{content:"\f028"!important;color:#1169a6!important}
html body main.app>.game-layout>.boosters #storeBtn{
  background:linear-gradient(145deg,#effff5,#d3f5df)!important;
  border-color:#80cda0!important;
}
html body main.app>.game-layout>.boosters #storeBtn::before{content:"\f54e"!important;color:#23784d!important}
html body main.app>.game-layout>.boosters #fdMenuBtn{
  background:linear-gradient(145deg,#f4f7fc,#dce6f2)!important;
  border-color:#9fb4ca!important;
}
html body main.app>.game-layout>.boosters #fdMenuBtn::before{content:"\f0c9"!important;color:#405c78!important}
html body main.app>.game-layout>.boosters #fdNotifyBtn{
  isolation:isolate!important;
  overflow:visible!important;
  background:linear-gradient(145deg,#fffbed,#ffedb8)!important;
  border-color:#e9c65b!important;
  color:#865d08!important;
  z-index:2!important;
}
html body main.app>.game-layout>.boosters #fdNotifyBtn::before{content:"\f0f3"!important;color:#956500!important;position:relative!important;z-index:1!important}
html body main.app>.game-layout>.boosters #fdNotifyBtn #fdCommunityBadge{
  top:-4px!important;
  right:-4px!important;
  min-width:13px!important;
  height:13px!important;
  border:1px solid #fff!important;
  box-shadow:0 1px 3px #452e0d66!important;
}
html body main.app>.game-layout>.boosters .booster:hover,
html body main.app>.game-layout>.boosters .mini-btn:hover{
  filter:brightness(1.04) saturate(1.08)!important;
  transform:translateY(-1px)!important;
}
html body main.app>.game-layout>.boosters .booster:active,
html body main.app>.game-layout>.boosters .mini-btn:active{
  transform:scale(.96)!important;
  filter:brightness(.97)!important;
}
html body main.app>.game-layout>.boosters .booster:disabled,
html body main.app>.game-layout>.boosters .mini-btn:disabled{
  opacity:.48!important;
  filter:grayscale(.25)!important;
  cursor:not-allowed!important;
  transform:none!important;
}
html body main.app>.game-layout>.boosters .booster:focus-visible,
html body main.app>.game-layout>.boosters .mini-btn:focus-visible{
  outline:2px solid #fff!important;
  outline-offset:2px!important;
}
html body main.app>.game-layout>.boosters .fd-mini-icon,
html body main.app>.game-layout>.boosters .fd-mini-label{display:none!important}
@media(max-width:900px){
  html body main.app>.game-layout>.boosters{
    height:auto!important;
    min-height:0!important;
    grid-template-rows:9px 29px!important;
    grid-auto-rows:29px!important;
    gap:3px!important;
    padding:3px 4px 4px!important;
  }
  html body main.app>.game-layout>.boosters>.side-title{display:flex!important}
  html body main.app>.game-layout>.boosters .booster,
  html body main.app>.game-layout>.boosters .mini-btn{
    height:29px!important;min-height:29px!important;max-height:29px!important;
    border-radius:7px!important;
  }
  html body main.app>.game-layout>.boosters .booster img{
    width:20px!important;height:20px!important;max-height:20px!important;flex-basis:20px!important;
  }
}
@media(max-width:380px){
  html body main.app>.game-layout>.boosters{
    grid-template-rows:8px 27px!important;
    grid-auto-rows:27px!important;
    gap:2px!important;
    padding:2px 3px 3px!important;
  }
  html body main.app>.game-layout>.boosters>.side-title{height:8px!important;min-height:8px!important;font-size:6px!important;line-height:8px!important}
  html body main.app>.game-layout>.boosters .booster,
  html body main.app>.game-layout>.boosters .mini-btn{
    height:27px!important;min-height:27px!important;max-height:27px!important;
    border-radius:6px!important;
  }
  html body main.app>.game-layout>.boosters .booster img{
    width:18px!important;height:18px!important;max-height:18px!important;flex-basis:18px!important;
  }
  html body main.app>.game-layout>.boosters .mini-btn::before{font-size:12px!important}
}
@media(prefers-reduced-motion:reduce){
  html body main.app>.game-layout>.boosters .booster,
  html body main.app>.game-layout>.boosters .mini-btn{transition:none!important}
}


/* Refinamiento visual v2: iconos + etiquetas cortas para reconocer cada acción */
html body main.app>.game-layout>.boosters{
  grid-template-rows:10px 32px!important;
  grid-auto-rows:32px!important;
  gap:3px!important;
  padding:4px 5px 5px!important;
  border-color:#397eb1!important;
  background:linear-gradient(110deg,#071f3d 0%,#0c345b 54%,#075168 100%)!important;
  box-shadow:inset 0 1px 0 #ffffff20,0 4px 12px #041a3150!important;
}
html body main.app>.game-layout>.boosters>.side-title{
  height:10px!important;min-height:10px!important;
  font-size:7px!important;line-height:10px!important;
  letter-spacing:.15em!important;
}
html body main.app>.game-layout>.boosters>.side-title span::before{color:#66d8ff!important}
html body main.app>.game-layout>.boosters>.side-title small{color:#d5efff!important;font-size:6px!important}
html body main.app>.game-layout>.boosters .booster,
html body main.app>.game-layout>.boosters .mini-btn{
  height:32px!important;min-height:32px!important;max-height:32px!important;
  padding:1px!important;border-radius:8px!important;
  box-shadow:inset 0 1px 0 #ffffffd9,0 2px 4px #00172c55!important;
}
html body main.app>.game-layout>.boosters .booster{
  justify-content:flex-start!important;
  padding-top:1px!important;
}
html body main.app>.game-layout>.boosters .booster img{
  width:19px!important;height:19px!important;max-height:19px!important;flex-basis:19px!important;
  margin:0 auto!important;
}
html body main.app>.game-layout>.boosters .booster>span{
  position:absolute!important;left:1px!important;right:1px!important;bottom:1px!important;
  display:block!important;width:auto!important;min-width:0!important;
  text-align:center!important;line-height:6px!important;
  white-space:nowrap!important;overflow:hidden!important;
}
html body main.app>.game-layout>.boosters .booster>span b{
  display:block!important;color:#123a5c!important;
  font:1000 5px/6px system-ui,sans-serif!important;
  letter-spacing:.015em!important;
}
html body main.app>.game-layout>.boosters .booster>span small{display:none!important}
html body main.app>.game-layout>.boosters .booster em{
  top:-4px!important;right:-3px!important;
  min-width:12px!important;height:12px!important;
  padding:0 3px!important;font-size:7px!important;
  background:#092845!important;color:#fff!important;
  border:1.5px solid #fff!important;
}
html body main.app>.game-layout>.boosters .booster em i{font-size:7px!important}
html body main.app>.game-layout>.boosters [data-booster="rocket"]{
  background:linear-gradient(155deg,#f4fcff,#c9edff)!important;border-color:#61b9ed!important;
}
html body main.app>.game-layout>.boosters [data-booster="bomb"]{
  background:linear-gradient(155deg,#fff7f2,#ffd4c2)!important;border-color:#ed966d!important;
}
html body main.app>.game-layout>.boosters [data-booster="magnet"]{
  background:linear-gradient(155deg,#faf6ff,#e1d3ff)!important;border-color:#ad8bea!important;
}
html body main.app>.game-layout>.boosters .mini-btn{
  flex-direction:column!important;gap:1px!important;
  justify-content:center!important;
  font-size:0!important;line-height:0!important;
}
html body main.app>.game-layout>.boosters .mini-btn::before{
  font-size:13px!important;line-height:13px!important;
}
html body main.app>.game-layout>.boosters .mini-btn::after{
  display:block!important;position:static!important;
  font:1000 5px/6px system-ui,sans-serif!important;
  letter-spacing:.015em!important;white-space:nowrap!important;
  line-height:6px!important;color:#24455f!important;
}
html body main.app>.game-layout>.boosters #soundBtn{
  background:linear-gradient(155deg,#f3fcff,#d9f2ff)!important;border-color:#74c4ef!important;
}
html body main.app>.game-layout>.boosters #soundBtn::after{content:"AUDIO"!important}
html body main.app>.game-layout>.boosters #storeBtn{
  background:linear-gradient(155deg,#f3fff7,#d8f6e3)!important;border-color:#79c99b!important;
}
html body main.app>.game-layout>.boosters #storeBtn::after{content:"TIENDA"!important;color:#216845!important}
html body main.app>.game-layout>.boosters #fdMenuBtn{
  background:linear-gradient(155deg,#f6f9ff,#e2eaf5)!important;border-color:#a6bdd4!important;
}
html body main.app>.game-layout>.boosters #fdMenuBtn::after{content:"MENÚ"!important;color:#344f6b!important}
html body main.app>.game-layout>.boosters #fdNotifyBtn{
  background:linear-gradient(155deg,#fffdf2,#fff0c5)!important;border-color:#e8c75e!important;
}
html body main.app>.game-layout>.boosters #fdNotifyBtn::after{content:"AVISOS"!important;color:#815a08!important}
html body main.app>.game-layout>.boosters .booster:active,
html body main.app>.game-layout>.boosters .mini-btn:active{transform:scale(.95)!important}
@media(max-width:900px){
  html body main.app>.game-layout>.boosters{
    height:auto!important;min-height:0!important;
    grid-template-rows:10px 32px!important;grid-auto-rows:32px!important;
    gap:3px!important;padding:4px 5px 5px!important;
  }
  html body main.app>.game-layout>.boosters .booster,
  html body main.app>.game-layout>.boosters .mini-btn{
    height:32px!important;min-height:32px!important;max-height:32px!important;
  }
}
@media(max-width:380px){
  html body main.app>.game-layout>.boosters{
    grid-template-rows:9px 30px!important;grid-auto-rows:30px!important;
    gap:2px!important;padding:3px 4px 4px!important;
  }
  html body main.app>.game-layout>.boosters>.side-title{
    height:9px!important;min-height:9px!important;font-size:6px!important;line-height:9px!important;
  }
  html body main.app>.game-layout>.boosters .booster,
  html body main.app>.game-layout>.boosters .mini-btn{
    height:30px!important;min-height:30px!important;max-height:30px!important;border-radius:7px!important;
  }
  html body main.app>.game-layout>.boosters .booster img{width:17px!important;height:17px!important;max-height:17px!important;flex-basis:17px!important}
  html body main.app>.game-layout>.boosters .booster>span b,
  html body main.app>.game-layout>.boosters .mini-btn::after{font-size:4.6px!important;line-height:5px!important}
}
