/* Local editorial V2 page glue.
   The visual source of truth stays app/ds/obd.ds.css. This file uses only
   generated design-system tokens and the existing mobile-article-spine
   component vocabulary; it is not a second theme. */

html {
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
}

.editorial-v2 > header {
  display: grid;
  gap: var(--ds-space-2);
}

.editorial-v2-market {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ds-space-2);
  align-items: center;
}

.editorial-v2-market .ds-badge {
  --ds-badge-bg: var(--ds-state-info-bg);
  --ds-badge-ink: var(--ds-accent);
}

.editorial-v2 > header .ds-overline,
.editorial-v2 > header .ds-large-title,
.editorial-v2 .report-section-heading :is(p, h2),
.editorial-v2 .editorial-v2-navigation-heading :is(p, h2),
.editorial-v2 .editorial-v2-sources-heading :is(p, h2) {
  margin: 0;
}

.editorial-v2 > header .ds-overline,
.editorial-v2 .report-section-heading .ds-overline,
.editorial-v2 .editorial-v2-navigation-heading .ds-overline,
.editorial-v2 .editorial-v2-sources-heading .ds-overline {
  color: var(--ds-accent);
}

.editorial-v2 .report-verdict-card__meaning {
  font: var(--ds-type-body);
}

.editorial-v2 .report-verdict-row--urgent .report-verdict-row__icon {
  color: var(--ds-state-fail);
  background: var(--ds-state-fail-bg);
}

.editorial-v2 .report-verdict-row--ok .report-verdict-row__icon {
  color: var(--ds-state-pass);
}

.editorial-v2 .report-verdict-row__action {
  text-wrap: pretty;
}

.editorial-v2 .report-verdict-rationale .ds-subhead {
  color: var(--ds-label-2);
}

.editorial-v2-matcher {
  margin-top: var(--ds-space-3);
}

.editorial-v2-matcher__details {
  margin: 0;
}

.editorial-v2-matcher__summary,
.editorial-v2-records__summary,
.editorial-v2-evidence__summary {
  display: grid;
  gap: var(--ds-space-1);
  min-width: 0;
}

.editorial-v2 .ds-section__chevron {
  color: var(--ds-label-2);
  transform: rotate(90deg);
}

.editorial-v2 .ds-section[open] > summary .ds-section__chevron {
  transform: rotate(-90deg);
}

.editorial-v2-matcher__body {
  display: grid;
  gap: var(--ds-space-3);
}

.editorial-v2-matcher__intro,
.editorial-v2-matcher__privacy {
  margin: 0;
}

.editorial-v2-matcher__fields {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.7fr);
  gap: var(--ds-space-3);
  margin-bottom: var(--ds-space-3);
}

.editorial-v2-field {
  display: grid;
  gap: var(--ds-space-1);
  min-width: 0;
}

.editorial-v2-field--engine {
  grid-column: 1 / -1;
}

.editorial-v2-field[hidden],
.editorial-v2-matcher__result[hidden] {
  display: none;
}

.editorial-v2-field :is(input, select) {
  box-sizing: border-box;
  width: 100%;
  min-height: var(--ds-hit);
  padding: 0 var(--ds-space-3);
  border: 0.5px solid var(--ds-separator);
  border-radius: var(--ds-radius-row);
  color: var(--ds-label-1);
  background: var(--ds-surface-card);
  font: var(--ds-type-body);
}

.editorial-v2-field input::placeholder {
  color: var(--ds-label-3);
}

.editorial-v2-field :is(input, select)[aria-invalid="true"] {
  border-color: var(--ds-state-fail);
}

.editorial-v2-matcher__result {
  margin-top: var(--ds-space-1);
}

.editorial-v2-matcher__lookup {
  justify-self: start;
  padding-inline: 0;
}

.editorial-v2-market-note {
  margin-bottom: var(--ds-space-3);
}

.editorial-v2-market-note .editorial-v2-prose p {
  margin: 0;
}

.editorial-v2-pay-list {
  margin: 0;
}

.editorial-v2-pay-row {
  display: grid;
  grid-template-columns: var(--ds-icon-lg) minmax(0, 1fr);
  gap: var(--ds-space-3);
  align-items: start;
}

.editorial-v2-pay-row__icon {
  display: inline-flex;
  width: var(--ds-icon-lg);
  height: var(--ds-icon-lg);
  align-items: center;
  justify-content: center;
  border-radius: var(--ds-radius-pill);
  color: var(--ds-accent);
  background: var(--ds-state-info-bg);
}

.editorial-v2-pay-row__copy {
  min-width: 0;
}

.editorial-v2-pay-row__copy h3 {
  margin: 0 0 var(--ds-space-1);
}

.editorial-v2-pay-row__copy p {
  margin: 0;
}

.editorial-v2 .editorial-v2-navigation-heading,
.editorial-v2 .report-section-heading,
.editorial-v2 .editorial-v2-sources-heading {
  display: grid;
  gap: var(--ds-space-1);
  margin: var(--ds-space-8) var(--ds-space-4) var(--ds-space-3);
}

.editorial-v2-author {
  margin-top: var(--ds-space-8);
}

.editorial-v2-author__card {
  display: grid;
  gap: var(--ds-space-1);
}

.editorial-v2-author__card :is(p, h2) {
  margin: 0;
}

.editorial-v2-author__card .ds-overline {
  color: var(--ds-accent);
}

.editorial-v2-nav-list,
.editorial-v2-sources {
  margin: 0;
  padding: 0;
  list-style: none;
}

.editorial-v2-navigation .ds-cell {
  padding: 0;
}

.editorial-v2-nav__link {
  display: grid;
  grid-template-columns: var(--ds-icon-lg) var(--ds-icon-sm) minmax(0, 1fr) var(--ds-icon-sm);
  gap: var(--ds-space-1) var(--ds-space-2);
  align-items: center;
  padding: var(--ds-space-3) var(--ds-space-4);
  color: var(--ds-label-1);
}

.editorial-v2-nav__number {
  --ds-badge-bg: var(--ds-accent);
  --ds-badge-ink: var(--ds-accent-contrast);
  display: inline-flex;
  width: var(--ds-icon-lg);
  height: var(--ds-icon-lg);
  min-height: 0;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.editorial-v2-nav__copy {
  display: grid;
  gap: var(--ds-space-1);
}

.editorial-v2-nav__title {
  display: flex;
  align-items: center;
  gap: var(--ds-space-2);
}

.editorial-v2-nav__summary {
  grid-column: 1 / -1;
}

.editorial-v2-nav__chevron {
  color: var(--ds-label-2);
}

.editorial-v2-prose > :first-child,
.editorial-v2-source-copy > :first-child {
  margin-top: 0;
}

.editorial-v2-prose > :last-child,
.editorial-v2-source-copy > :last-child {
  margin-bottom: 0;
}

.editorial-v2-prose p,
.editorial-v2-source-copy p {
  margin: 0 0 var(--ds-space-3);
}

.editorial-v2-prose h3 {
  margin: 0 0 var(--ds-space-2);
}

.editorial-v2-records {
  margin-top: var(--ds-space-3);
}

.editorial-v2-records__body {
  padding: 0;
}

.editorial-v2-record {
  padding: var(--ds-space-4);
  border-top: 0.5px solid var(--ds-separator);
}

.editorial-v2-record > :first-child {
  margin-top: 0;
}

.editorial-v2-record > :last-child {
  margin-bottom: 0;
}

.editorial-v2-record p {
  margin: 0 0 var(--ds-space-3);
}

.editorial-v2-prose ul {
  margin: 0;
  padding-inline-start: var(--ds-space-5);
}

.editorial-v2-prose ul li + li {
  margin-top: var(--ds-space-2);
}

.editorial-v2-prose ol {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: editorial-step;
}

.editorial-v2-prose ol > li {
  display: grid;
  grid-template-columns: var(--ds-icon-lg) minmax(0, 1fr);
  gap: var(--ds-space-3);
  align-items: start;
  padding: var(--ds-space-3) 0;
  border-bottom: 0.5px solid var(--ds-separator);
  counter-increment: editorial-step;
}

.editorial-v2-prose ol > li:first-child {
  padding-top: 0;
}

.editorial-v2-prose ol > li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.editorial-v2-prose ol > li::before {
  content: counter(editorial-step);
  display: inline-flex;
  width: var(--ds-icon-lg);
  height: var(--ds-icon-lg);
  align-items: center;
  justify-content: center;
  border-radius: var(--ds-radius-pill);
  color: var(--ds-accent);
  background: var(--ds-state-info-bg);
  font: var(--ds-type-footnote);
}

.editorial-v2-list__copy {
  min-width: 0;
}

.editorial-v2-disclaimer {
  color: var(--ds-label-2);
  font: var(--ds-type-footnote);
}

/* Inline glossary terms can land on adjacent wrapped lines. The shared 44px
   pseudo-targets then overlap and one term can steal another term's click.
   V2 makes the term text itself clickable and keeps the visible help control
   at the WCAG 2.2 24px minimum without overlapping the next line. */
.editorial-v2 button.ds-term-help::after {
  width: var(--ds-space-6);
  height: var(--ds-space-6);
}

.editorial-v2-source {
  display: grid;
  grid-template-columns: var(--ds-icon-lg) minmax(0, 1fr);
  gap: var(--ds-space-3);
  align-items: start;
}

.editorial-v2-source__number {
  --ds-badge-bg: var(--ds-state-info-bg);
  --ds-badge-ink: var(--ds-accent);
  display: inline-flex;
  width: var(--ds-icon-lg);
  height: var(--ds-icon-lg);
  min-height: 0;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.editorial-v2-source-copy {
  color: var(--ds-label-2);
  font: var(--ds-type-footnote);
}

.editorial-v2-source-copy a {
  font: inherit;
}

.editorial-v2-local-note {
  margin-top: var(--ds-space-3);
}

.editorial-v2-provenance {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ds-space-1) var(--ds-space-2);
  margin: var(--ds-space-3) var(--ds-space-4) 0;
}

.editorial-v2-evidence {
  margin-top: var(--ds-space-3);
}

.editorial-v2-evidence__body {
  display: grid;
  gap: var(--ds-space-3);
}

.editorial-v2-evidence__body p {
  margin: 0;
}

@media (max-width: 479px) {
  .editorial-v2 > header {
    padding-top: var(--ds-space-2);
  }

  .editorial-v2 .editorial-v2-navigation-heading,
  .editorial-v2 .report-section-heading,
  .editorial-v2 .editorial-v2-sources-heading {
    margin-top: var(--ds-space-5);
  }

  .editorial-v2-nav__link {
    grid-template-columns: var(--ds-icon-lg) minmax(0, 1fr) var(--ds-icon-sm);
  }

  .editorial-v2-nav__icon {
    display: none;
  }

  .editorial-v2-matcher__fields {
    grid-template-columns: 1fr;
  }

  .editorial-v2-field--engine {
    grid-column: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
