/* Classic ShreeWin-style splash: solid purple + dynamic website logos top/bottom.
   Characters come from assets/css/start.png (.dice). Baked ShreeWin bg is disabled. */

.start-page[data-v-5eb72be7],
.start-page {
  background-image: none !important;
  background-color: #6f66e1 !important;
  background-size: cover !important;
}

.start-page .vc-splash-inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 1.4rem 0.5rem 1.6rem;
  box-sizing: border-box;
}

.start-page .vc-splash-spacer {
  flex: 1 1 auto;
  width: 100%;
  min-height: 1rem;
  /* Hide any leftover baked character art from start.png / .dice */
  background: none !important;
}

.start-page .vc-splash-logo {
  display: block;
  object-fit: contain;
  background: none !important;
  width: auto;
  height: auto;
  margin: 0 auto !important;
  /* Slightly flatter — not oversized */
  transform: scaleY(0.88);
  transform-origin: center center;
}

.start-page .vc-splash-logo--top {
  max-width: 68% !important;
  max-height: 1.7rem;
  margin-top: 0.7rem !important;
}

.start-page .vc-splash-logo--bottom {
  max-width: 52% !important;
  max-height: 1.15rem;
  margin-top: 0.15rem !important;
  margin-bottom: 0.55rem !important;
}

/* Force-hide character / dice slab if Vue or cache still injects it */
.start-page .dice,
.start-page .vc-splash-dice {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  background: none !important;
}

/* Game home page top navbar logo — slightly smaller (was ~2.99 x 1.12 rem) */
#app .navbar .navbar__content-center .headLogo,
.navbar__content-center .headLogo {
  width: 2.35rem !important;
  height: 0.88rem !important;
  max-width: 2.35rem !important;
  max-height: 0.88rem !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#app .navbar .navbar__content-center .headLogo img,
.navbar__content-center .headLogo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}