/* Zenkai Idle R7.10.247 — Boss mechanics readability + rotation banner cleanup
   Visual-only layer. No combat, reward, progression or rotation authority lives here. */

/* Give the mechanics region actual usable width. The old authored panel kept its
   native aspect ratio from a ~108px row, which collapsed it to ~200px wide and
   forced 6–7px text. Unlock stays image-authored; mechanics becomes a responsive
   HTML surface so text size is not coupled to the source PNG aspect ratio. */
#huntModal .r236-boss-main{
  grid-template-rows:minmax(170px,1.38fr) minmax(124px,.92fr) minmax(84px,.72fr)!important;
}
#huntModal .r236-boss-panels{
  grid-template-columns:minmax(250px,.82fr) minmax(360px,1.38fr)!important;
  gap:12px!important;
  align-items:stretch!important;
  justify-items:stretch!important;
  overflow:hidden!important;
}
#huntModal .r236-boss-panels>.r236-unlock-panel{
  height:100%!important;
  max-height:none!important;
  width:auto!important;
  max-width:100%!important;
  justify-self:center!important;
  align-self:stretch!important;
}

#huntModal .r247-mechanics-card{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:31px minmax(0,1fr)!important;
  border:1px solid #2c88b6!important;
  background:
    linear-gradient(90deg,rgba(24,119,169,.08) 1px,transparent 1px) 0 0/26px 26px,
    linear-gradient(180deg,#062741 0%,#041b2e 46%,#051625 100%)!important;
  box-shadow:inset 0 0 0 1px rgba(65,196,245,.08),inset 0 0 22px rgba(0,145,220,.07)!important;
}
#huntModal .r247-mechanics-card:before{
  content:""!important;position:absolute!important;inset:0!important;pointer-events:none!important;
  border-left:3px solid #14b9ee!important;border-right:1px solid rgba(45,180,229,.25)!important;
  opacity:.85!important;
}
#huntModal .r247-mechanics-card>header{
  position:relative!important;z-index:2!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
  min-width:0!important;padding:4px 9px 4px 11px!important;border-bottom:1px solid rgba(63,165,210,.34)!important;
  background:linear-gradient(90deg,rgba(5,49,78,.95),rgba(4,29,49,.72))!important;
}
#huntModal .r247-mechanics-card>header div{min-width:0!important;display:flex!important;align-items:baseline!important;gap:7px!important}
#huntModal .r247-mechanics-card>header small{color:#68cef4!important;font-size:7.4px!important;font-weight:900!important;letter-spacing:.65px!important;white-space:nowrap!important}
#huntModal .r247-mechanics-card>header b{color:#effaff!important;font-size:11px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
#huntModal .r247-mechanics-card>header em{flex:0 0 auto!important;color:#7faec4!important;font-size:7px!important;font-weight:800!important;font-style:normal!important;letter-spacing:.35px!important}

#huntModal .r247-mechanics-list{
  position:relative!important;z-index:2!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;
  scrollbar-width:thin!important;scrollbar-color:#298fc2 #061522!important;
}
#huntModal .r247-mechanics-list::-webkit-scrollbar{width:6px!important}
#huntModal .r247-mechanics-list::-webkit-scrollbar-track{background:#061522!important}
#huntModal .r247-mechanics-list::-webkit-scrollbar-thumb{background:#298fc2!important;border-radius:4px!important}
#huntModal .r247-mechanic-row{
  min-width:0!important;min-height:31px!important;display:grid!important;grid-template-columns:30px minmax(0,1fr)!important;gap:7px!important;
  align-items:center!important;padding:4px 9px 4px 7px!important;border-bottom:1px solid rgba(47,117,151,.26)!important;
  background:linear-gradient(90deg,rgba(5,37,60,.30),rgba(3,21,35,.10))!important;
}
#huntModal .r247-mechanic-row:last-child{border-bottom:0!important}
#huntModal .r247-mechanic-row>i{
  width:26px!important;height:26px!important;display:grid!important;place-items:center!important;border:1px solid #236f96!important;
  background:#061d2e!important;color:#78ddff!important;font-size:13px!important;font-weight:900!important;font-style:normal!important;line-height:1!important;
  box-shadow:inset 0 0 9px rgba(31,158,214,.10)!important;
}
#huntModal .r247-mechanic-row>div{min-width:0!important;display:grid!important;grid-template-columns:minmax(95px,.42fr) minmax(0,1fr)!important;grid-template-rows:auto auto!important;column-gap:8px!important;align-items:center!important}
#huntModal .r247-mechanic-row b{
  grid-column:1!important;grid-row:1/3!important;align-self:center!important;color:#f2fbff!important;font-size:9.4px!important;line-height:1.08!important;
  white-space:normal!important;overflow-wrap:anywhere!important;
}
#huntModal .r247-mechanic-row small{
  grid-column:2!important;grid-row:1!important;display:block!important;min-width:0!important;color:#b8cfda!important;font-size:8.2px!important;line-height:1.16!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
#huntModal .r247-mechanic-row em{
  grid-column:2!important;grid-row:2!important;display:block!important;min-width:0!important;margin-top:2px!important;color:#789daf!important;font-size:7.15px!important;line-height:1.12!important;
  font-style:normal!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}

/* The banner PNGs are R247 edge-cleaned/cropped assets. These rules prevent any
   inherited background from reintroducing a rectangular plate around them. */
#huntModal .r236-boss-hero:has(.r236-boss-banner){background:transparent!important;box-shadow:none!important}
#huntModal .r236-boss-banner{
  background:transparent!important;border:0!important;box-shadow:none!important;
  object-fit:contain!important;object-position:center!important;
}

@media(max-width:1100px){
  #huntModal .r236-boss-main{grid-template-rows:160px 118px minmax(82px,1fr)!important}
  #huntModal .r236-boss-panels{height:118px!important;grid-template-columns:minmax(230px,.78fr) minmax(330px,1.42fr)!important;gap:9px!important}
  #huntModal .r236-boss-panels>.r236-unlock-panel{height:115px!important}
  #huntModal .r247-mechanics-card{height:115px!important;grid-template-rows:29px minmax(0,1fr)!important}
  #huntModal .r247-mechanic-row{min-height:29px!important;padding-top:2px!important;padding-bottom:2px!important}
  #huntModal .r247-mechanic-row b{font-size:8.8px!important}
  #huntModal .r247-mechanic-row small{font-size:7.7px!important}
  #huntModal .r247-mechanic-row em{font-size:6.8px!important}
}
@media(max-width:860px){
  #huntModal .r236-boss-main{grid-template-rows:132px 116px 82px!important}
  #huntModal .r236-boss-panels{height:116px!important;grid-template-columns:minmax(205px,.72fr) minmax(300px,1.48fr)!important;gap:7px!important;overflow-x:auto!important}
  #huntModal .r236-boss-panels>.r236-unlock-panel{height:113px!important}
  #huntModal .r247-mechanics-card{height:113px!important;min-width:300px!important;grid-template-rows:27px minmax(0,1fr)!important}
  #huntModal .r247-mechanics-card>header b{font-size:9.4px!important}
  #huntModal .r247-mechanic-row{grid-template-columns:27px minmax(0,1fr)!important;gap:5px!important;min-height:28px!important;padding-left:5px!important;padding-right:6px!important}
  #huntModal .r247-mechanic-row>i{width:23px!important;height:23px!important;font-size:11px!important}
  #huntModal .r247-mechanic-row>div{grid-template-columns:minmax(82px,.42fr) minmax(0,1fr)!important;column-gap:5px!important}
  #huntModal .r247-mechanic-row b{font-size:8.1px!important}
  #huntModal .r247-mechanic-row small{font-size:7.1px!important}
  #huntModal .r247-mechanic-row em{font-size:6.35px!important}
}