.result-page .nav {
  padding: 14px var(--spacing-lg);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  background: var(--bg-secondary);
}

.result-page .result-hero {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.result-page .logo svg {
  width: 24px;
  height: 24px;
  fill: var(--accent);
}

.result-page .pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--border-soft);
  background: var(--bg-primary);
  color: var(--text-muted);
  font-size: 0.78rem;
}

.result-page .navlinks {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.result-page .navlinks a {
  color: var(--text-muted);
}

.result-page .navlinks a:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.result-page .small {
  color: var(--text-muted);
  margin: 0 0 var(--spacing-sm);
  font-size: 1rem;
  line-height: 1.7;
}

.result-page .section-heading,
.result-page .section-subheading {
  margin: 0 0 10px;
}

.result-page .section-subheading {
  margin-bottom: 8px;
}

.result-page .card {
  margin-top: var(--spacing-md);
  overflow-x: clip;
}

.result-page .detail-body {
  margin-top: 10px;
}

.result-page .result-detail {
  margin: 0;
  min-width: 0;
}

.result-page .result-detail + .result-detail {
  margin-top: 8px;
}

.result-page .result-list {
  margin: 8px 0 0;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

.result-page .hr {
  height: 1px;
  margin: var(--spacing-xl) 0;
  background: var(--border-soft);
}

.result-page .kv {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  min-width: 0;
}

.result-page .input-tokenized {
  flex: 1 1 220px;
  min-width: 0;
  background: var(--bg-secondary);
  color: var(--text-primary);
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  padding: 11px;
}

.result-page .context-links {
  margin: 0;
  overflow-wrap: anywhere;
}

.result-page .copy-toast {
  color: var(--accent);
}

.result-page .palette-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 10px;
  min-width: 0;
}

.result-page .palette-chip {
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  background: var(--bg-secondary);
  padding: 8px;
  min-width: 0;
}

.result-page .palette-chip .swatch {
  display: block;
  height: 32px;
  border-radius: 8px;
  border: 1px solid var(--border-soft);
  margin-bottom: 8px;
}

.result-page .affiliate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  min-width: 0;
}

.result-page .affiliate-card {
  background: var(--bg-secondary);
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  padding: 12px;
  min-width: 0;
}

.result-page .affiliate-card p {
  color: var(--text-muted);
}

.result-page .reveal-module.is-pending {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 200ms ease-out, transform 200ms ease-out;
}

.result-page .reveal-module.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 759px) {
  .result-page .btn {
    width: 100%;
  }

  .result-page .kv > * {
    flex: 1 1 100%;
  }

  .result-page .container {
    padding-inline: var(--spacing-md);
  }

  .result-page .card {
    margin-top: var(--spacing-lg);
  }
}

@media (min-width: 760px) {
  .result-page .result-hero {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

@media (prefers-reduced-motion: reduce) {
  .result-page .reveal-module.is-pending {
    transition: none;
  }
}