/* Bhuchi Arcade V152 — visibility-safe homepage and player corrections. */

html,body,#hub{width:100%;max-width:100%;overflow-x:clip}
#hub *{box-sizing:border-box}

/* Header and discovery controls must remain inside the viewport. */
#hub .hub-header-inner{width:100%;min-width:0;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
#hub .reference-brand{min-width:0;max-width:calc(100% - 64px)}
#hub .reference-brand-mark{flex:0 0 46px;width:46px!important;height:46px!important;min-width:46px;min-height:46px;display:grid!important;place-items:center;line-height:1!important;overflow:visible!important}
#hub .wordmark{min-width:0;line-height:1.05!important;overflow:visible!important}
#hub .controls,#hub .search-wrap,#hub .discovery-actions,#hub .rail,#hub .rail-cats{min-width:0;max-width:100%}
#hub .search-wrap{width:100%}
#hub .rail-cats{align-items:center}

/* Fix the live quick-pick cards: an older direct-child span rule reduced the
   entire content overlay to icon dimensions, pushing text outside the card. */
#hub .feature-bento,#hub .feature-bento>*{min-width:0;max-width:100%}
#hub .live-quick-picks{width:100%;min-width:0;max-width:100%}
#hub .live-quick-pick{position:relative!important;width:100%!important;min-width:0!important;max-width:100%!important;overflow:hidden!important}
#hub .quick-pick-image,#hub .quick-pick-shade{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important}
#hub .quick-pick-image{object-fit:cover!important}
#hub .quick-pick-content{
  position:absolute!important;
  inset:auto 0 0!important;
  z-index:3!important;
  width:100%!important;
  height:auto!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-end!important;
  gap:5px!important;
  transform:none!important;
  overflow:visible!important;
}
#hub .quick-pick-content>*{width:auto!important;height:auto!important;min-width:0!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}
#hub .quick-pick-content small,#hub .quick-pick-content strong,#hub .quick-pick-meta{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#hub .quick-pick-cta{display:inline-flex!important;align-items:center;justify-content:center;align-self:flex-start;width:auto!important;min-width:78px!important;min-height:38px!important;margin-top:6px!important;white-space:nowrap!important;overflow:visible!important}

/* Cards and footer copy may wrap instead of disappearing behind ellipsis. */
#hub .grid,#hub .grid>*{min-width:0;max-width:100%}
#hub .card-title,#hub .card-meta{max-width:100%;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
#hub .reference-footer,#hub .footer-inner,#hub .footer-grid{max-width:100%;min-width:0}

@media(max-width:1000px){
  #hub .live-quick-picks{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #hub .quick-pick-content{padding:14px!important}
}

@media(max-width:640px){
  #hub .hub-header-inner{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));gap:8px!important}
  #hub .reference-brand{max-width:calc(100% - 54px)}
  #hub .reference-brand-mark{flex-basis:40px;width:40px!important;height:40px!important;min-width:40px;min-height:40px;font-size:32px!important}
  #hub .wordmark{font-size:18px!important;white-space:nowrap}
  #hub .hub-main{width:100%;padding-left:12px!important;padding-right:12px!important}
  #hub .controls{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;width:100%}
  #hub .discovery-actions{width:100%;display:flex!important;overflow:visible!important}
  #hub .surprise-chip{width:100%;justify-content:center}
  #hub .rail{width:100%;position:static!important;padding:0!important;margin:0!important}
  #hub .rail-cats{display:flex!important;flex-wrap:wrap!important;gap:8px!important;overflow:visible!important;width:100%;padding:0!important}
  #hub .cat-pill{flex:1 1 calc(33.333% - 8px);min-width:max-content;justify-content:center}
  #hub .feature-bento{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%}
  #hub .live-quick-picks{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:none!important;width:100%!important;height:auto!important;margin:0!important;padding:0!important;overflow:visible!important}
  #hub .live-quick-pick{width:100%!important;max-width:100%!important;min-height:168px!important;height:168px!important;flex:none!important}
  #hub .quick-pick-content{padding:13px!important;gap:4px!important}
  #hub .quick-pick-content strong{font-size:18px!important}
  #hub .quick-pick-content small{display:block!important;font-size:10px!important}
  #hub .quick-pick-meta{display:block!important;font-size:12px!important}
  #hub .quick-pick-cta{display:inline-flex!important;min-height:34px!important;padding:7px 12px!important;font-size:12px!important}
  #hub .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  #hub .game-card-wrap{min-width:0!important;width:100%!important}
  #hub .card-title{font-size:15px!important;line-height:1.25!important}
  #hub .card-meta{font-size:12px!important;line-height:1.3!important}
  #hub .footer-grid{grid-template-columns:1fr!important}
}

@media(max-width:359px){
  #hub .wordmark{font-size:16px!important}
  #hub .reference-brand-meta{display:none!important}
  #hub .cat-pill{flex-basis:calc(50% - 6px);font-size:12px!important}
  #hub .grid{gap:9px!important}
  #hub .card-title{font-size:14px!important}
  #hub .card-meta{font-size:11px!important}
}

/* Keep all core player controls reachable on compact screens. */
@media(max-width:640px){
  #player .player-bar{width:100%;max-width:100%;display:flex;align-items:center;gap:5px;padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right))}
  #player .player-title{flex:1 1 auto;min-width:0}
  #player .player-title span:last-child{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #player .player-score{flex:0 1 auto;min-width:0;max-width:28vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #player .player-bar .icon-btn{display:grid!important;place-items:center!important;flex:0 0 42px!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important}
  #tutorial .sheet,#pause .sheet,#result .sheet{width:calc(100% - 16px)!important;max-width:560px;max-height:calc(100dvh - 16px)!important}
  #tutorial .sheet-foot .foot-actions{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%}
  #tutorial .sheet-foot .btn{min-width:0!important;width:100%!important}
}