/* R32.8: shared event-header styling and reliable dashboard scrolling. */
.r20-themebar,
.r328-defense-week-header,
body[data-theme="defense-week"] :is(.r8-topbar, .topbar) {
  min-height: 54px !important;
  border: 1px solid rgba(226, 193, 126, .62) !important;
  border-radius: 16px !important;
  background: linear-gradient(112deg, #0a3452 0%, #12556c 55%, #123d56 100%) !important;
  box-shadow: 0 12px 26px rgba(5, 27, 44, .24), inset 0 1px 0 rgba(255, 255, 255, .10) !important;
  color: #fff !important;
}

.r20-themebar > b {
  border: 1px solid rgba(226, 193, 126, .34) !important;
  border-radius: 999px !important;
  background: rgba(238, 213, 159, .15) !important;
  color: #fff !important;
}

body[data-theme="defense-week"] :is(.r8-topbar, .topbar) {
  border-bottom: 2px solid rgba(226, 193, 126, .72) !important;
}

body[data-theme="defense-week"] :is(.r8-topbar, .topbar) :is(a, h1, h2, h3, p, span, b, small) {
  color: #f5fbff !important;
}

.r328-defense-week-header :is(a, h1, h2, h3, p, span, b, small) {
  color: #f5fbff !important;
}

html.r328-app-scroll,
html.r328-app-scroll body {
  min-height: 100% !important;
  height: auto !important;
  max-height: none !important;
}

html.r328-app-scroll body {
  min-height: 100vh !important;
  touch-action: pan-y pinch-zoom !important;
  -webkit-overflow-scrolling: touch !important;
}

html.r328-app-scroll #appView.app-shell,
html.r328-app-scroll #appView .main-area,
html.r328-app-scroll #appView .page.active-page {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

html.r328-app-scroll #appView.app-shell {
  min-height: 100vh !important;
}

html.r328-app-scroll #appView .main-area {
  min-height: 100vh !important;
  min-width: 0 !important;
}

@media (min-width: 901px) {
  body.r319-root-home .r312-home-side {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  body.r319-root-home .r312-home-side > .hero-copy {
    position: relative !important;
    inset: auto !important;
    z-index: auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 14px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(226, 193, 126, .34) !important;
    border-radius: 18px !important;
    background: linear-gradient(150deg, #123b58, #071f34) !important;
    box-shadow: 0 12px 28px rgba(3, 20, 33, .22), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    text-align: right !important;
    transform: none !important;
  }

  body.r319-root-home .r312-home-side > .hero-copy h1 {
    margin: 0 0 7px !important;
    color: #fff !important;
    font-size: clamp(16px, 1.3vw, 19px) !important;
    line-height: 1.5 !important;
    overflow-wrap: anywhere !important;
  }

  body.r319-root-home .r312-home-side > .hero-copy h2 {
    margin: 0 0 8px !important;
    color: #d5eafa !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
  }

  body.r319-root-home .r312-home-side > .hero-copy p {
    margin: 0 0 11px !important;
    color: #b8cddd !important;
    font-size: 10px !important;
    line-height: 1.8 !important;
  }

  body.r319-root-home .r312-home-side > .hero-copy .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  body.r319-root-home .r312-home-side > .hero-copy .hero-actions > * {
    width: 100% !important;
    min-height: 38px !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 900px) {
  body.r319-root-home .r312-home-side {
    display: block !important;
  }
}