/* Download cards (.dl-btn base lives in site.css) */
.build-card .title i {
  color: #a9d8ff;
}

/* Platform selector */
.platform-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.platform-tab {
  flex: 1 1 auto;
  min-width: 7.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .6rem .9rem;
  border-radius: .9rem;
  border: 1px solid rgba(255, 255, 255, .10);
  background: rgba(255, 255, 255, .04);
  color: var(--retro-muted);
  font-weight: 800;
  transition: .15s ease;
}

.platform-tab:hover {
  border-color: rgba(14, 165, 233, .45);
  background: rgba(14, 165, 233, .10);
  color: var(--retro-text);
}

.platform-tab:focus-visible {
  outline: none;
  border-color: rgba(14, 165, 233, .65);
  box-shadow: 0 0 0 .25rem rgba(14, 165, 233, .18);
}

.platform-tab.active {
  border-color: rgba(14, 165, 233, .55);
  background: rgba(14, 165, 233, .16);
  color: #d8f2ff;
}

.platform-panel[hidden] {
  display: none;
}

.rec-badge {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .25rem .6rem;
  border-radius: 999px;
  border: 1px solid rgba(34, 197, 94, .35);
  background: rgba(34, 197, 94, .16);
  color: #a7f3c0;
  font-weight: 800;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .3px;
}

/* Setup steps inside a platform panel */
.guide-body {
  color: var(--retro-muted);
  font-size: .92rem;
}

.guide-body a {
  color: var(--retro-accent);
  text-decoration: underline;
}

.guide-body a:hover {
  color: #cfeeff;
}

code.cmd {
  display: block;
  margin-top: .5rem;
  padding: .55rem .7rem;
  border-radius: .6rem;
  border: 1px solid rgba(255, 255, 255, .10);
  background: rgba(0, 0, 0, .35);
  color: #cfeeff;
  font-family: var(--mono);
  font-size: .85rem;
  overflow-x: auto;
  white-space: pre;
}

.sidebar-card {
  position: sticky;
  top: 18px;
}

@media (max-width: 991.98px) {
  .sidebar-card {
    position: relative;
    top: auto;
  }
}

.list-links a {
  color: #a9d8ff;
  text-decoration: none;
}

.list-links a:hover {
  text-decoration: underline;
  color: #cfeeff;
}