/* Shared artwork; Android's existing composition remains unchanged. */
.home-rewards-foreground { display: contents; }
.home-rewards-crates { display: none; }
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .main-menu-web__reward-briefing {
  container-type: size;
  background: url('/assets/rewards-hangar-background-v1.png') center / cover no-repeat;
  background-clip: padding-box;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web .home-rewards-foreground {
  display: block;
  position: absolute;
  /* A modest plaque increase, with the crate region kept proportional. */
  width: min(96cqw, 205cqh);
  aspect-ratio: 2.85;
  left: 50%;
  top: 62%;
  transform: translate(-50%, -50%);
  container-type: size;
  pointer-events: none;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .home-rewards-crates {
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  /* Nine-slice stretches only the blank plaque faces, not the crates.
     Source: 2172x724; top 460px and bottom 110px scale with width. */
  border-style: solid;
  border-color: transparent;
  border-width: 21.1786cqw 0 5.0645cqw;
  border-image: url('/assets/rewards-crates-overlay-v1.png') 460 0 110 fill / 1 / 0 stretch;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .home-rewards-foreground .main-menu-web__reward-tiers {
  position: absolute;
  left: 1.5%;
  top: 59%;
  width: 97%;
  height: 22%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  padding: 0;
  margin: 0;
  container-type: normal;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web .web-home-center .home-rewards-foreground :is(.main-menu-web__reward-tier, .main-menu-web__podium) {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  margin: 0;
  gap: 2px;
  background: none;
  border: 0;
  box-shadow: none;
  clip-path: none;
  container-type: normal;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web .web-home-center .home-rewards-foreground .main-menu-web__chest { display: none; }
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web .web-home-center .home-rewards-foreground .main-menu-web__podium strong {
  position: static;
  font-size: clamp(16px, 3.4cqw, 34px);
  line-height: 1;
  margin: 0;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web .web-home-center .home-rewards-foreground .main-menu-web__podium span {
  font-size: clamp(12px, 2.7cqw, 27px);
  line-height: 1;
  margin: 0;
  white-space: nowrap;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web .web-home-center .main-menu-web__reward-header h2 {
  font-size: min(3.5cqw, 7cqh);
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .main-menu-web__reward-header {
  left: 3%;
  top: 3%;
  width: 94%;
  height: 11%;
  min-height: 24px;
  padding: 3px 3%;
  box-sizing: border-box;
  border: 0;
  background: #06131be8;
  box-shadow: inset 1px 0 0 var(--bc-line), inset -1px 0 0 var(--bc-line);
}
/* Match the existing footer's narrow amber/black hazard rails. */
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .main-menu-web__reward-header::before,
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .main-menu-web__reward-header::after {
  content: '';
  position: absolute;
  inset: auto 0;
  height: 3px;
  background: repeating-linear-gradient(135deg, var(--bc-command) 0 5px, #050708 5px 10px);
  pointer-events: none;
}
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .main-menu-web__reward-header::before { top: 0; }
html:is([data-ui-device='psg1'], [data-ui-platform='web']) .main-menu-web[data-reward-tab] .web-home-center .main-menu-web__reward-header::after { bottom: 0; }