/* Built with Gemini — page styles (extracted from the Astro/React source).
   Fonts load from Google Fonts in index.html. */

html, body { margin: 0; background: #000; }
body.bwgm-event { min-height: 100vh; -webkit-font-smoothing: antialiased; }
.bwgm-page, .bwgm-page *, .bwgm-page *::before, .bwgm-page *::after { box-sizing: border-box; }
.bwgm-page img { max-width: 100%; }
.bwgm-page [hidden] { display: none !important; }
/* Minimal reset (the original page sat on Tailwind's base styles) */
.bwgm-page h1, .bwgm-page h2, .bwgm-page h3, .bwgm-page h4, .bwgm-page p, .bwgm-page figure, .bwgm-page blockquote { margin: 0; }
.bwgm-page ol, .bwgm-page ul { margin: 0; padding: 0; list-style: none; }
.bwgm-page img, .bwgm-page svg { display: block; }
.bwgm-page img { height: auto; }

html:has(body.bwgm-event) {
  scroll-behavior: smooth;
  overflow-x: clip;
}

@media (prefers-reduced-motion: reduce) {
  html:has(body.bwgm-event) {
    scroll-behavior: auto;
  }

  .bwgm-page * {
    animation: none !important;
    transition: none !important;
  }
}

@property --bwgm-a {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@keyframes bwgm-spin {
  to {
    --bwgm-a: 360deg;
  }
}

@keyframes bwgm-rotate {
  to {
    transform: rotate(360deg);
  }
}

@keyframes bwgm-marquee {
  to {
    transform: translateX(-50%);
  }
}

@keyframes bwgm-eq {
  0%,
  100% {
    transform: scaleY(0.42);
  }
  50% {
    transform: scaleY(1);
  }
}

@keyframes bwgm-floaty {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-14px);
  }
}

@keyframes bwgm-drift1 {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
  }
  50% {
    transform: translate(6%, 4%) scale(1.12);
  }
}

@keyframes bwgm-drift2 {
  0%,
  100% {
    transform: translate(0, 0) scale(1.05);
  }
  50% {
    transform: translate(-5%, -6%) scale(0.95);
  }
}

@keyframes bwgm-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(138, 123, 230, 0.55);
  }
  100% {
    box-shadow: 0 0 0 18px rgba(138, 123, 230, 0);
  }
}

@keyframes bwgm-wordin {
  from {
    opacity: 0;
    transform: translateY(18px);
    filter: blur(8px);
  }
  to {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

@keyframes bwgm-caret {
  50% {
    opacity: 0;
  }
}

@keyframes bwgm-rise {
  from {
    opacity: 0;
    transform: translateY(48px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes bwgm-grow {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

@keyframes bwgm-growy {
  from {
    transform: scaleY(0);
  }
  to {
    transform: scaleY(1);
  }
}

@keyframes bwgm-shimmer {
  to {
    background-position: 200% center;
  }
}

.bwgm-page {
  --bg: #000;
  --fg: #fff;
  --muted: rgba(255, 255, 255, 0.72);
  --faint: rgba(255, 255, 255, 0.6);
  --line: rgba(255, 255, 255, 0.1);
  --line2: rgba(255, 255, 255, 0.18);
  --card: #0e1015;
  --card2: #16181e;
  --nav: rgba(20, 21, 26, 0.72);
  --btn: #fff;
  --btnfg: #000;
  --blue: #6f9bf0;
  --purple: #a08eeb;
  --pink: #f65c5f;
  --g1: rgba(56, 121, 230, 0.55);
  --g2: rgba(246, 92, 95, 0.45);
  --g3: rgba(138, 123, 230, 0.45);
  --h1: rgba(0, 40, 96, 0.95);
  --h2: rgba(130, 30, 36, 0.85);
  --word: #fff;
  --wordfg: #0b0d12;
  --wordsub: rgba(11, 13, 18, 0.6);
  --shadow: rgba(0, 0, 0, 0.5);
  position: relative;
  min-height: 100vh;
  overflow-x: clip;
  background: var(--bg);
  color: var(--fg);
  font-family: "Google Sans Flex", "Google Sans", "Product Sans", system-ui, sans-serif;
  font-synthesis: none;
}

.bwgm-page a {
  color: var(--fg);
}

.bwgm-page a:hover {
  color: var(--pink);
}

.bwgm-page button {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-family: inherit;
  color: inherit;
}

.bwgm-problem-dialog {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  background: rgba(0, 0, 0, 0.72);
  font-family: "Google Sans Flex", "Google Sans", "Product Sans", system-ui, sans-serif;
}

.bwgm-problem-dialog__panel {
  position: relative;
  width: min(760px, 100%);
  max-height: min(88vh, 900px);
  overflow: auto;
  box-sizing: border-box;
  padding: 40px 36px 36px;
  border-radius: 28px;
  background: var(--card);
  border: 1px solid var(--line);
  color: var(--fg);
}

.bwgm-problem-dialog__title {
  margin: 0;
  font-size: 40px;
  line-height: 1.1;
  font-weight: 400;
}

.bwgm-problem-dialog__label {
  font-size: 14px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pink);
}

.bwgm-problem-dialog__body {
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
  color: var(--muted);
}

.bwgm-page .eq {
  display: block;
  transform-origin: center;
  border-radius: 999px;
  animation: bwgm-eq 1.6s ease-in-out infinite;
}

.bwgm-page .gb {
  border: 1.5px solid transparent;
  background:
    linear-gradient(var(--card), var(--card)) padding-box,
    conic-gradient(from var(--bwgm-a), #3879e6, #8a7be6, #f65c5f, #8a7be6, #3879e6) border-box;
  animation: bwgm-spin 6s linear infinite;
}

.bwgm-page .gtext {
  background: linear-gradient(90deg, #3879e6, #8a7be6, #f65c5f, #8a7be6, #3879e6);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: bwgm-shimmer 6s linear infinite;
}

.bwgm-page .lift {
  transition:
    transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
    border-color 0.35s,
    box-shadow 0.35s;
}

.bwgm-page .lift:hover {
  transform: translateY(-8px);
  border-color: var(--line2);
  box-shadow: 0 24px 60px -20px var(--g3);
}

.bwgm-page .btn {
  transition:
    transform 0.25s,
    box-shadow 0.25s;
}

.bwgm-page .btn:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow:
    0 10px 40px -6px var(--g1),
    0 10px 40px -10px var(--g2);
}

.bwgm-page button.btn {
  cursor: pointer;
}

.bwgm-page button.btn:disabled {
  cursor: progress;
}

.bwgm-page .navlink {
  transition:
    background 0.25s,
    color 0.25s;
}

.bwgm-page .navlinks {
  display: flex;
}

.bwgm-page .bwgm-nav-cta {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 0;
  box-sizing: border-box;
  min-height: 44px;
  max-width: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 999px;
  background: var(--btn);
  color: var(--btnfg);
  font-size: 14px;
  font-weight: 500;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    max-width 0.25s ease,
    opacity 0.25s ease,
    padding 0.25s ease,
    gap 0.25s ease;
}

.bwgm-page .bwgm-nav-cta.is-visible {
  gap: 10px;
  max-width: 280px;
  padding: 6px 6px 6px 18px;
  overflow: visible;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.bwgm-page .bwgm-nav-cta__icon {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--btnfg);
  color: var(--btn);
}

.bwgm-page .bwgm-menu-btn {
  display: none;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--btn);
  color: var(--btnfg);
  cursor: pointer;
}

.bwgm-page .bwgm-mobile-register {
  display: none;
}

.bwgm-page .bwgm-hero-mobile {
  display: none;
}

.bwgm-page .bwgm-mobile-register.is-hidden {
  visibility: hidden;
}

.bwgm-page .bwgm-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  border: 0;
  background: rgba(0, 0, 0, 0.55);
  cursor: pointer;
}

.bwgm-page .bwgm-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  display: flex;
  width: min(320px, 86vw);
  box-sizing: border-box;
  flex-direction: column;
  padding: 28px 24px;
  background: #0e1015;
  border-left: 1px solid var(--line);
  box-shadow: -24px 0 80px rgba(0, 0, 0, 0.45);
  transform: translateX(0);
  animation: bwgm-drawer-in 0.32s ease;
}

@keyframes bwgm-drawer-in {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

.bwgm-page .bwgm-drawer__close {
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--line);
  color: var(--fg);
  cursor: pointer;
}

.bwgm-page .bwgm-drawer__links {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 28px;
}

.bwgm-page .bwgm-drawer__links a {
  padding: 14px 4px;
  border-bottom: 1px solid var(--line);
  color: var(--fg);
  font-size: 20px;
  text-decoration: none;
}

.bwgm-page .hidescroll {
  scrollbar-width: none;
}

.bwgm-page .hidescroll::-webkit-scrollbar {
  display: none;
}

.bwgm-page details summary {
  list-style: none;
}

.bwgm-page details summary::-webkit-details-marker {
  display: none;
}

.bwgm-page details[open] .chev {
  transform: rotate(45deg);
}

.bwgm-page .chev {
  transition: transform 0.3s;
}

.bwgm-page input::placeholder {
  color: var(--faint);
}

.bwgm-page .bwgm-spinner {
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 999px;
  animation: bwgm-rotate 0.7s linear infinite;
}

@supports (animation-timeline: view()) {
  .bwgm-page .reveal {
    animation: bwgm-rise linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 28%;
  }

  .bwgm-page .bar {
    transform-origin: left;
    animation: bwgm-grow linear both;
    animation-timeline: view();
    animation-range: entry 30% cover 50%;
  }

  .bwgm-page .vline {
    transform-origin: top;
    animation: bwgm-growy linear both;
    animation-timeline: view();
    animation-range: entry 30% exit 60%;
  }
}

@media (max-width: 1020px) {
  .bwgm-page .navlinks {
    display: none;
  }

  .bwgm-page .bwgm-nav-cta {
    display: none;
  }

  .bwgm-page .bwgm-menu-btn {
    display: inline-flex;
  }

  .bwgm-page .bwgm-mobile-register {
    position: fixed;
    right: 24px;
    bottom: 16px;
    left: 24px;
    z-index: 60;
    display: flex;
    justify-content: center;
    pointer-events: none;
  }

  .bwgm-page .bwgm-mobile-register .btn {
    position: relative;
    display: inline-flex;
    width: auto;
    max-width: calc(100% - 16px);
    align-items: center;
    justify-content: flex-start;
    gap: 18px;
    box-sizing: border-box;
    min-height: 56px;
    padding: 10px 10px 10px 22px;
    border-radius: 999px;
    background: #fff;
    color: #000;
    font-size: 20px;
    text-align: left;
    pointer-events: auto;
    cursor: pointer;
  }

  .bwgm-page .bwgm-mobile-register .bwgm-nav-cta__icon {
    position: static;
  }

  .bwgm-page .bwgm-hero-cta {
    display: none !important;
  }

  .bwgm-page .bwgm-hero-mobile {
    /* Mobile hero. Change only these percentages.
       size is the image width. gap-top and gap-bottom are the space above and below that image.
       Space between two images is the bottom gap of the one above plus the top gap of the one below.
       Every value is a percentage of the screen width, so it scales on every phone. */
    --bwgm-hero-presents-size: 28%;
    --bwgm-hero-presents-gap-top: 0%;
    --bwgm-hero-presents-gap-bottom: 4%;
    --bwgm-hero-gemini-size: 100%;
    --bwgm-hero-gemini-gap-top: 4%;
    --bwgm-hero-gemini-gap-bottom: 4%;
    --bwgm-hero-support-size: 68%;
    --bwgm-hero-support-gap-top: 4%;
    --bwgm-hero-support-gap-bottom: 4%;
    --bwgm-hero-powered-size: 40%;
    --bwgm-hero-powered-gap-top: 4%;
    --bwgm-hero-powered-gap-bottom: 0%;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 0;
  }

  .bwgm-page .bwgm-hero-mobile img {
    display: block;
    width: var(--bwgm-hero-size);
    max-width: 100%;
    height: auto;
    margin-top: var(--bwgm-hero-gap-top);
    margin-bottom: var(--bwgm-hero-gap-bottom);
    object-fit: contain;
    object-position: center;
  }

  .bwgm-page .bwgm-hero-mobile__presents {
    --bwgm-hero-size: var(--bwgm-hero-presents-size);
    --bwgm-hero-gap-top: var(--bwgm-hero-presents-gap-top);
    --bwgm-hero-gap-bottom: var(--bwgm-hero-presents-gap-bottom);
  }

  .bwgm-page .bwgm-hero-mobile__gemini {
    --bwgm-hero-size: var(--bwgm-hero-gemini-size);
    --bwgm-hero-gap-top: var(--bwgm-hero-gemini-gap-top);
    --bwgm-hero-gap-bottom: var(--bwgm-hero-gemini-gap-bottom);
  }

  .bwgm-page .bwgm-hero-mobile__support {
    --bwgm-hero-size: var(--bwgm-hero-support-size);
    --bwgm-hero-gap-top: var(--bwgm-hero-support-gap-top);
    --bwgm-hero-gap-bottom: var(--bwgm-hero-support-gap-bottom);
  }

  .bwgm-page .bwgm-hero-mobile__powered {
    --bwgm-hero-size: var(--bwgm-hero-powered-size);
    --bwgm-hero-gap-top: var(--bwgm-hero-powered-gap-top);
    --bwgm-hero-gap-bottom: var(--bwgm-hero-powered-gap-bottom);
  }

  .bwgm-page .bwgm-hero-lockup {
    display: none !important;
  }

  .bwgm-page #top {
    box-sizing: border-box;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 156px 20px 56px !important;
  }

  .bwgm-page .bwgm-hero-inner,
  .bwgm-page .bwgm-hero-title {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100%;
    min-height: 0;
    height: auto !important;
  }

  .bwgm-page {
    padding-bottom: 96px;
  }

  .bwgm-page .bwgm-section-head {
    position: sticky !important;
    top: 105px;
    z-index: 30;
    background: var(--bg);
    padding-top: 16px !important;
    padding-bottom: 22px !important;
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .bwgm-page #problems,
  .bwgm-page #why {
    overflow: visible !important;
  }
}

@media (max-width: 640px) {
  .bwgm-page .logos img {
    height: 16px !important;
  }

  .bwgm-problem-dialog {
    padding: 16px 12px;
  }

  .bwgm-problem-dialog__panel {
    padding: 56px 20px 24px;
    border-radius: 22px;
  }

  .bwgm-problem-dialog__title {
    font-size: 32px;
  }

  .bwgm-page .hidesm {
    display: none !important;
  }

  .bwgm-page section:not(#top) {
    padding-top: 72px !important;
    padding-bottom: 72px !important;
  }

  .bwgm-page section#dates {
    padding-bottom: 20px !important;
  }

  .bwgm-page section#prizes {
    padding-top: 8px !important;
  }

  .bwgm-page #top {
    padding: 152px 16px 56px !important;
  }

  .bwgm-page .bwgm-prize-pool {
    gap: 16px !important;
  }

  .bwgm-page .bwgm-prize-mark {
    width: 88px !important;
    height: 88px !important;
    border-radius: 24px !important;
  }

  .bwgm-page .bwgm-prize-mark svg {
    width: 44px !important;
    height: 44px !important;
  }

  .bwgm-page .bwgm-prize-total {
    font-size: 42px !important;
    white-space: nowrap;
  }

  .bwgm-page .regtxt {
    display: none;
  }

  .bwgm-page .bigbtn {
    padding-left: 20px !important;
    font-size: 16px !important;
    text-align: left;
  }

  .bwgm-page .logos {
    gap: 10px !important;
  }

  .bwgm-page h2 {
    word-break: normal;
    overflow-wrap: anywhere;
  }

  .bwgm-page #about h2,
  .bwgm-page #why h2,
  .bwgm-page #how h2,
  .bwgm-page #problems h2,
  .bwgm-page #dates h2,
  .bwgm-page #prizes h2,
  .bwgm-page #evaluation h2,
  .bwgm-page #faq h2 {
    font-size: 38px !important;
  }

  .bwgm-page #who h2 {
    font-size: 36px !important;
  }

  .bwgm-page #register h2 {
    font-size: 44px !important;
  }

  .bwgm-page .bwgm-footer-title {
    font-size: 32px !important;
  }

  .bwgm-page .bwgm-orb-a {
    left: -54.6px !important;
    width: 171.6px !important;
    height: 171.6px !important;
  }

  .bwgm-page .bwgm-orb-b {
    width: 179.4px !important;
    height: 179.4px !important;
  }

  .bwgm-page .bwgm-hero-cta {
    margin-top: 48px !important;
  }
}
