/* CrosswindBay arcade: brand bar and ARCADE5 code box. */
#brand {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(12px + env(safe-area-inset-bottom));
  text-align: center;
  pointer-events: none;
  z-index: 40;
  font: 700 12px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #F2E6C9;
  letter-spacing: 0.14em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
#brand .name { display: block; margin-bottom: 7px; }
#brand a {
  pointer-events: auto;
  display: inline-block;
  padding: 10px 18px;
  background: #F2E6C9;
  color: #1F2E4A;
  border: 2px solid #121418;
  border-radius: 999px;
  text-decoration: none;
  font-size: 15px;
  letter-spacing: 0.02em;
  text-shadow: none;
  box-shadow: 0 3px 0 #121418;
  touch-action: manipulation;
}
#brand a:active { transform: translateY(2px); box-shadow: 0 1px 0 #121418; }
#brand.hide { display: none; }

.overlay {
  padding-bottom: calc(100px + env(safe-area-inset-bottom));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
#overlay-reward { z-index: 8; }
.card { max-height: 100%; overflow: auto; }

#over-reward {
  box-sizing: border-box;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 100%;
  min-height: 52px;
  margin: 4px 0 16px;
  padding: 10px 12px;
  background: #FFD100;
  color: #121418;
  border: 2px solid #121418;
  border-radius: 10px;
  box-shadow: 0 3px 0 #121418;
  font-weight: 700;
  line-height: 1.2;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 14px;
  text-decoration: none;
  touch-action: manipulation;
  text-align: center;
}
#over-reward b#over-reward-code {
  display: inline-block;
  padding: 0 6px;
  background: #121418;
  color: #FFD100;
  border: 1.5px solid #FFD100;
  outline: 1.5px solid #121418;
  border-radius: 3px;
  font-family: ui-monospace, "Roboto Mono", Menlo, monospace;
  font-size: 1.08em;
  letter-spacing: 0.08em;
}