/* ==========================================================================
   Shared structure for all site styles (always active)
   ========================================================================== */

/* style switcher in the header */
.gc-switch {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  margin: 0 .4rem;
  padding: 0 .2rem;
  color: var(--md-primary-bg-color);
  cursor: pointer;
}
.gc-switch svg { width: 1.1rem; height: 1.1rem; opacity: .85; flex: none; }
.gc-switch select {
  appearance: none;
  -webkit-appearance: none;
  font: inherit;
  font-size: .68rem;
  font-weight: 600;
  color: inherit;
  background: transparent;
  border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
  border-radius: 999px;
  padding: .2rem .65rem;
  cursor: pointer;
}
.gc-switch select:hover,
.gc-switch select:focus-visible { border-color: currentColor; outline: none; }
.gc-switch option { color: #1f2033; background: #fff; }
@media screen and (max-width: 44.9375em) {
  .gc-switch select { max-width: 5.6rem; }
}

/* content that only belongs to the game style / the docs styles */
.gc-only-docs { display: none; }

/* home page: no sidebars, full-width card grid */
.md-container:has(.gc-hero) .md-sidebar { display: none; }
.md-container:has(.gc-hero) .md-content { max-width: none; margin: 0; }
.md-container:has(.gc-hero) .md-content__inner { margin: 0 .8rem 2rem; }
.md-container:has(.gc-hero) .md-content__inner::before { display: none; }

.gc-hero { position: relative; overflow: hidden; }
.gc-hero__inner { position: relative; z-index: 1; }
.gc-worlds, .gc-hero__actions { display: flex; flex-wrap: wrap; }

.gc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr));
  gap: .8rem;
  margin: 1rem 0 0;
}
.md-typeset a.gc-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

.gc-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}