.contest-dialog {
  position: fixed;
  width: min(900px, calc(100vw - 24px));
  max-height: min(840px, calc(100dvh - 24px));
  padding: 0;
  border: 1px solid #43d8f7;
  border-radius: 18px;
  background: linear-gradient(145deg, #092b3e, #04131f);
  color: #effcff;
  box-shadow: 0 30px 100px #000e;
  overflow: auto;
}
.contest-dialog::backdrop {
  background: #010812d9;
  backdrop-filter: blur(8px);
}
.contest-dialog > form {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 26px;
}
.contest-dialog > form > small {
  color: #59ddff;
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0.12em;
}
.contest-dialog h2 {
  margin: 0;
  color: #f2fbff;
  font-size: clamp(1.35rem, 3vw, 1.9rem);
}
.contest-dialog h3 {
  margin: 0 0 4px;
  color: #d9f6ff;
  font-size: 1rem;
}
.contest-dialog .contest-tabs {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 12px;
}
.contest-dialog .contest-tabs > section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  align-content: start;
  padding: 16px;
  border: 1px solid #265d73;
  border-radius: 13px;
  background: #061b29;
}
.contest-dialog .contest-tabs > section h3 {
  grid-column: 1/-1;
}
.contest-dialog .contest-tabs > section:last-child {
  grid-template-columns: 1fr;
}
.contest-dialog label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #91afbb;
  font-size: 0.72rem;
  font-weight: 900;
}
.contest-dialog input,
.contest-dialog select,
.contest-dialog button {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 0 11px;
  border: 1px solid #2c6a82;
  border-radius: 9px;
  background: #03141f;
  color: #effcff;
  font: inherit;
}
.contest-dialog input {
  font-size: 16px;
}
.contest-dialog button {
  width: auto;
  background: #0b354a;
  font-weight: 900;
  cursor: pointer;
}
.contest-dialog [data-create],
.contest-dialog [data-join] {
  align-self: end;
  background: linear-gradient(135deg, #128fb8, #1db47d);
  border-color: #32c7d7;
  color: #fff;
}
.contest-dialog output {
  display: block;
  min-height: 20px;
  color: #65e8aa;
}
.contest-dialog .contest-close {
  position: absolute;
  z-index: 2;
  right: 9px;
  top: 8px;
  width: 40px;
  border: 0;
  background: transparent;
  color: #9eeaff;
  font-size: 1.6rem;
}
.contest-config-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.station-row input,
.station-row select {
  width: 100%;
}
@media (max-width: 720px) {
  .contest-dialog {
    width: calc(100vw - 12px);
    max-height: calc(100dvh - 12px);
  }
  .contest-dialog > form {
    padding: 20px 14px;
  }
  .contest-dialog .contest-tabs,
  .contest-config-grid {
    grid-template-columns: 1fr;
  }
  .contest-dialog .contest-tabs > section {
    grid-template-columns: 1fr;
  }
  .contest-dialog .contest-tabs > section h3 {
    grid-column: auto;
  }
}
