/* Palette and panel language from hangar_ui.rs and render_ui.rs. */
.masthead {
  background: var(--panel);
  border-color: var(--line);
}
.wordmark {
  color: var(--title);
  font-size: 18px;
  letter-spacing: 1px;
}
.insignia {
  transform: none;
  color: var(--title);
  border-color: var(--line);
  background: #19292b;
}
nav a {
  color: var(--muted);
}
nav .nav-play {
  color: var(--title);
  border-color: var(--title);
  background: #19292b;
}
.art-panel::after {
  opacity: 0;
}
.cover::before {
  background: none;
}
.cover::after {
  inset: 20px;
  border: 1px solid var(--line);
  background: none;
  opacity: 1;
}
h1 {
  width: min(85%, 950px);
  transform: none;
  background: none;
  color: var(--title);
  filter: none;
  margin: 35px 0 26px;
}
.menu-title {
  display: block;
  width: 100%;
  height: auto;
  image-rendering: pixelated;
}
.eyebrow {
  color: var(--title);
}
.tagline {
  color: var(--acid);
  font-size: clamp(14px, 1.8vw, 25px);
}
.intro {
  color: var(--muted);
  font-size: 14px;
}
.button {
  background: #244238;
  color: var(--acid);
  border-color: var(--acid);
  box-shadow: none;
  font-size: 11px;
}
.button:hover {
  background: #2b4242;
  color: var(--paper);
  transform: none;
}
.signal {
  background: var(--acid);
  box-shadow: none;
}
.orbit-label {
  color: var(--title);
  border-color: var(--line);
  background: #0e1618c0;
  padding: 12px;
}
.spec-strip {
  background: var(--panel);
  color: var(--acid);
  border-block: 1px solid var(--line);
}
.combat::before {
  background: none;
}
h2 {
  font-size: clamp(28px, 3.5vw, 48px);
  transform: none;
  width: 100%;
  letter-spacing: -0.06em;
  line-height: 1.05;
  color: var(--title);
}
h2 em {
  color: var(--acid);
}
.combat-copy {
  padding: 20px;
  background: #0e1618e0;
  border: 1px solid var(--line);
}
.combat-copy p {
  color: var(--muted);
  font-size: 12px;
}
.stamp {
  transform: none;
  border-color: var(--line);
  color: #e8b361;
  font-size: 9px;
}
.heavy-art::before {
  background: none;
}
.stakes-copy {
  background: var(--panel);
  border-left: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.stakes-copy .eyebrow {
  color: var(--title);
}
.stakes h2 {
  font-size: clamp(26px, 3.3vw, 44px);
}
.heavy-art {
  min-height: 600px;
}
.stakes-copy .lead {
  font-size: 17px;
}
.rule h3 {
  color: var(--acid);
}
.manifest {
  background: #142429;
}
.raid-loop {
  color: var(--title);
  letter-spacing: -0.07em;
  font-size: clamp(25px, 4.7vw, 72px);
}
.play {
  background: var(--ink);
}
.play h2 {
  font-size: clamp(28px, 3.5vw, 48px);
}
.alpha-box {
  background: var(--panel);
  border-color: var(--line);
  box-shadow: none;
  align-self: center;
}
.alpha-box::before {
  border-color: var(--line);
}
.alpha-label {
  color: var(--acid);
}
.alpha-name {
  color: var(--title);
  letter-spacing: -0.06em;
}
.alpha-fine {
  font-size: 10px;
}
footer {
  background: var(--panel);
}
@media (max-width: 900px) {
  .combat h2 {
    font-size: 40px;
  }
  .stakes h2 {
    font-size: 30px;
  }
  .play h2 {
    font-size: 40px;
  }
}
@media (max-width: 600px) {
  .wordmark {
    font-size: 13px;
    letter-spacing: 0;
  }
  .cover::after {
    inset: 10px;
  }
  .cover::before {
    background: none;
  }
  .planet {
    opacity: 1;
  }
  .cover h1 {
    width: 100%;
    margin: 24px 0;
  }
  .cover-content {
    padding-bottom: 70px;
  }
  .tagline {
    font-size: 12px;
  }
  .intro {
    font-size: 12px;
  }
  .combat h2 {
    font-size: 32px;
  }
  .combat-copy {
    padding: 15px;
  }
  .stakes-copy {
    border-left: none;
  }
  .stakes h2 {
    font-size: 32px;
  }
  .play h2 {
    font-size: 32px;
  }
  .raid-loop {
    font-size: clamp(17px, 5.6vw, 26px);
  }
}
