.quote-a { background: #231923; border-color: #674056; }
.quote-a h4 { color: #f9bfd6; }
.quote .error {
  color: #ffedf4;
  background: #7f2e54;
  border-bottom: 2px solid #ffa7cb;
  border-radius: .23rem;
  padding-inline: .22em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  font-weight: 700;
}
.examples + .method { margin-bottom: 3rem; }

.translation-link { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-block: 0 3rem; padding: 1.35rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--panel); scroll-margin-top: 2rem; }
.full-comparison { padding-block: 2.8rem 3rem; }
.full-comparison h1 { font-size: clamp(1.85rem, 4.8vw, 3.5rem); }
.full-comparison .intro { margin-block: .65rem 1.3rem; }
.translation-controls { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap; padding: .75rem .9rem; margin-bottom: .85rem; background: var(--panel); border: 1px solid var(--line); border-radius: .8rem; }
.translation-controls output { color: var(--muted); font-size: .8rem; }
.translation-pagination { display: flex; gap: .45rem; align-items: center; flex-wrap: wrap; }
.translation-pagination button { border: 1px solid var(--line); border-radius: .55rem; background: var(--panel-light); color: var(--ink); padding: .3rem .75rem; font-size: .78rem; }
.translation-pagination button:disabled { opacity: .55; cursor: default; }
.translation-rows { display: grid; gap: .65rem; list-style: none; margin: 0; padding: 0; scroll-margin-top: 6rem; }
.translation-row { padding: .6rem 0 .75rem; }
.translation-entry { display: block; padding: 0 1rem .4rem; }
.translation-label { color: var(--muted); font-size: .72rem; font-weight: 650; letter-spacing: normal; margin-bottom: .5rem; padding-bottom: .4rem; border-bottom: 1px solid #ffffff14; }
.translation-row .quote-a { background: #14111b; border-color: #32293d; }
.translation-row .quote-h .translation-label { color: var(--accent); }
@media (max-width: 480px) {
  .header nav { flex-wrap: wrap; justify-content: flex-end; gap: .2rem .65rem; }
  .translation-controls .search { width: 100%; }
  .translation-controls .search input { width: 100%; }
  .translation-rows { scroll-margin-top: 8rem; }
}

.hero-copy > .primary-link { margin-top: 1.45rem; }
.examples .quote { background: #1d1727; border-color: #45364f; }
.examples .quote h4 { color: var(--accent); }
.examples .quote .error { color: var(--ink); background: #514064; border-bottom-color: #b6a0d4; }
.examples .quotes { padding-block-end: .75rem; }