
/* RECODET HEAVY MOBILE SHELL REBUILD — FINAL CASCADE */
:root{
  --hm-bg:#060605;--hm-panel:#11100d;--hm-panel-2:#18150f;--hm-gold:#e7bd48;
  --hm-gold-hi:#f6d873;--hm-gold-deep:#a87514;--hm-line:rgba(231,189,72,.24);
  --hm-text:#f6f1e6;--hm-muted:#b7ad98;
}

/* Mobile hub hierarchy */
#viewMain{padding-bottom:36px!important}
#viewMain .hubTop{gap:10px!important;margin-bottom:24px!important}
#viewMain .hubTile{
  min-height:108px!important;padding:16px!important;border-radius:22px!important;
  background:linear-gradient(160deg,rgba(30,25,14,.96),rgba(12,11,9,.98))!important;
  border:1px solid var(--hm-line)!important;box-shadow:0 14px 30px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,242,194,.05)!important;
}
#viewMain .hubModulesHead{margin:0 0 12px!important;padding:0 2px!important}
#viewMain .hubModulesHead .sectionTitle{font-size:22px!important;letter-spacing:-.02em!important}

/* Rebuilt main module controls */
#viewMain .hubModuleGrid{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;align-items:stretch!important;
}
#viewMain .hubModuleTile{
  position:relative!important;isolation:isolate!important;min-width:0!important;min-height:112px!important;
  padding:14px 8px 12px!important;border-radius:22px!important;
  background:linear-gradient(165deg,#1d180f 0%,#100f0c 62%,#090909 100%)!important;
  border:1px solid rgba(231,189,72,.25)!important;color:var(--hm-text)!important;
  box-shadow:0 15px 28px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,240,188,.06)!important;
  overflow:hidden!important;gap:10px!important;
  transition:transform .18s cubic-bezier(.2,.75,.25,1),border-color .18s ease,box-shadow .18s ease!important;
}
#viewMain .hubModuleTile::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(circle at 76% 4%,rgba(246,216,115,.13),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.025),transparent 35%);
}
#viewMain .hubModuleTile:focus-visible,#viewMain .hubModuleTile:hover{
  transform:translateY(-3px)!important;border-color:rgba(246,216,115,.55)!important;
  box-shadow:0 20px 36px rgba(0,0,0,.38),0 0 0 1px rgba(246,216,115,.07) inset!important;
}
#viewMain .hubModuleTile:active{transform:translateY(1px) scale(.975)!important}
#viewMain .hubModuleIcon{
  width:58px!important;height:58px!important;flex:0 0 58px!important;margin:0 auto!important;
  border-radius:18px!important;background:linear-gradient(160deg,#2c2415,#14110c)!important;
  border:1px solid rgba(246,216,115,.20)!important;color:var(--hm-gold-hi)!important;
  box-shadow:0 10px 20px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,239,183,.08)!important;
  display:grid!important;place-items:center!important;padding:0!important;
}
#viewMain .hubModuleIcon svg{width:30px!important;height:30px!important;stroke:currentColor!important}
#viewMain .hubModuleIcon img,#viewMain .hubMainIconImage{display:none!important}
#viewMain .hubModuleTile>span:last-child{
  font-size:11px!important;line-height:1.1!important;font-weight:850!important;letter-spacing:.01em!important;color:var(--hm-text)!important;
}

/* Bottom dock: fixed, full width, no overflow, equal actions */
#bottomBar.bottombar{
  position:fixed!important;z-index:12000!important;
  left:max(7px,env(safe-area-inset-left))!important;right:max(7px,env(safe-area-inset-right))!important;
  bottom:calc(7px + env(safe-area-inset-bottom))!important;transform:none!important;width:auto!important;max-width:none!important;
  display:grid!important;grid-template-columns:repeat(var(--nav-count),minmax(0,1fr))!important;gap:4px!important;
  min-height:76px!important;padding:6px 7px calc(7px + env(safe-area-inset-bottom))!important;
  border-radius:25px!important;background:linear-gradient(180deg,rgba(28,23,14,.98),rgba(7,7,7,.99))!important;
  border:1px solid rgba(231,189,72,.35)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,242,194,.11)!important;
  overflow:hidden!important;backdrop-filter:blur(18px)!important;
}
#bottomBar.bottombar::before,#bottomBar.bottombar::after{display:none!important}
#bottomBar.bottombar button{
  min-width:0!important;width:100%!important;height:62px!important;min-height:62px!important;
  padding:6px 2px 5px!important;border-radius:18px!important;border:1px solid transparent!important;
  background:transparent!important;color:#d4cbbb!important;box-shadow:none!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;
  overflow:hidden!important;transition:transform .16s ease,background .16s ease,color .16s ease,border-color .16s ease!important;
}
#bottomBar.bottombar button:hover,#bottomBar.bottombar button:focus-visible{
  transform:translateY(-2px)!important;color:#fff5df!important;border-color:rgba(231,189,72,.16)!important;background:rgba(231,189,72,.06)!important;
}
#bottomBar.bottombar button:active{transform:translateY(1px) scale(.96)!important}
#bottomBar.bottombar button.active{
  color:#171107!important;background:linear-gradient(180deg,var(--hm-gold-hi),var(--hm-gold) 56%,var(--hm-gold-deep))!important;
  border-color:rgba(255,230,154,.38)!important;box-shadow:inset 0 1px 0 rgba(255,251,226,.68),0 8px 18px rgba(0,0,0,.22)!important;
}
#bottomBar.bottombar button.active::before,#bottomBar.bottombar button.active::after{display:none!important}
#bottomBar .tabIcon{
  width:32px!important;height:32px!important;flex:0 0 32px!important;margin:0 auto!important;padding:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:inherit!important;display:grid!important;place-items:center!important;
}
#bottomBar .tabIcon svg{width:25px!important;height:25px!important;stroke:currentColor!important}
#bottomBar .tabIcon img,#bottomBar .moduleIconImage{display:none!important}
#bottomBar .tabLabel{
  width:100%!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  font-size:9px!important;line-height:1!important;font-weight:850!important;letter-spacing:.01em!important;color:inherit!important;
}
#bottomBar .tabBadge{top:5px!important;right:8px!important}
#viewModule #moduleBody,#content{padding-bottom:calc(108px + env(safe-area-inset-bottom))!important}

/* Tablets / desktop */
@media(min-width:700px){
  #viewMain .hubModuleGrid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}
  #viewMain .hubModuleTile{min-height:126px!important}
  #bottomBar.bottombar{left:calc(82px + 18px)!important;right:18px!important;max-width:980px!important;margin:0 auto!important}
}
@media(max-width:360px){
  #viewMain .hubModuleGrid{gap:7px!important}
  #viewMain .hubModuleTile{min-height:102px!important;border-radius:19px!important;padding:11px 5px 9px!important}
  #viewMain .hubModuleIcon{width:52px!important;height:52px!important;flex-basis:52px!important;border-radius:16px!important}
  #viewMain .hubModuleIcon svg{width:27px!important;height:27px!important}
  #bottomBar.bottombar{left:4px!important;right:4px!important;gap:2px!important;padding-left:4px!important;padding-right:4px!important;border-radius:22px!important}
  #bottomBar.bottombar button{height:59px!important;min-height:59px!important;border-radius:16px!important}
  #bottomBar .tabIcon{width:29px!important;height:29px!important;flex-basis:29px!important}
  #bottomBar .tabIcon svg{width:23px!important;height:23px!important}
  #bottomBar .tabLabel{font-size:8px!important}
}
@media(prefers-reduced-motion:reduce){#viewMain .hubModuleTile,#bottomBar.bottombar button{transition:none!important}}
