/* RacingVIN Design System — Technical Registry. Semantic colors are not tenant slots. */
:root {
  --rv-canvas: #f4f3ec;
  --rv-surface: #ffffff;
  --rv-ink: #17201e;
  --rv-registry: #141916;
  --rv-brand-black: #0b0e0c;
  --rv-acid: #c6ff00;
  --rv-lime: #c4eb52;
  --rv-chartreuse-test: #d6eb40;
  --rv-data: #285f89;
  --rv-data-bg: #e4eef6;
  --rv-graphite: #505954;
  --rv-muted: #626d64;
  --rv-line: #d7dbd2;
  --rv-steel: #d8dcd7;
  --rv-steel-paper: #e8ebe6;
  --rv-steel-line: #b8c1bc;
  --rv-technical-ink: #58665f;
  --rv-technical-mark: #8c9590;
  --rv-navigation: #cbd0ca;
  --rv-navigation-surface: #e9ece7;
  --rv-navigation-ink: #242d29;
  --rv-navigation-muted: #505b55;
  --rv-navigation-line: #747f79;
  --rv-grid-minor: rgb(65 76 73 / 4%);
  --rv-grid-major: rgb(65 76 73 / 7%);
  --rv-grid-field:
    linear-gradient(var(--rv-grid-major) 1px, transparent 1px),
    linear-gradient(90deg, var(--rv-grid-major) 1px, transparent 1px),
    linear-gradient(var(--rv-grid-minor) 1px, transparent 1px),
    linear-gradient(90deg, var(--rv-grid-minor) 1px, transparent 1px);
  --rv-grid-scale: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
  --rv-verified: #245a3e;
  --rv-verified-bg: #e2efe6;
  --rv-source: #46583b;
  --rv-source-bg: #e7edde;
  --rv-owner: #625369;
  --rv-owner-bg: #eee9f0;
  --rv-pending: #785715;
  --rv-pending-bg: #fff0c9;
  --rv-disputed: #8a352b;
  --rv-disputed-bg: #fbe6e0;
  --rv-unknown: #586157;
  --rv-unknown-bg: #eceee9;
  --rv-on-registry: #e8efdf;
  --rv-registry-muted: #bac7ad;
  --rv-focus: #58665f;
  --rv-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --rv-font-display: var(--rv-font-body);
  --rv-font-metadata: ui-monospace, SFMono-Regular, monospace;
  --rv-content-width: 1280px;
  --rv-radius: 2px;
  --rv-notch: 9px;
  --rv-cut-corners: polygon(
    0 0,
    calc(100% - var(--rv-notch)) 0,
    100% var(--rv-notch),
    100% 100%,
    var(--rv-notch) 100%,
    0 calc(100% - var(--rv-notch))
  );
  --rv-motion-fast: 180ms;
  --rv-motion-ease: cubic-bezier(0.2, 0.75, 0.2, 1);
  --rv-search-height: 48px;
  --rv-space-1: 4px;
  --rv-space-2: 8px;
  --rv-space-3: 12px;
  --rv-space-4: 16px;
  --rv-space-5: 24px;
  --rv-space-6: 32px;
  --rv-space-7: 48px;
  --rv-org-accent: var(--rv-muted);
  --rv-org-secondary: var(--rv-line);
}
.product {
  --ink: var(--rv-ink);
  --muted: var(--rv-muted);
  --line: var(--rv-line);
  --paper: var(--rv-canvas);
  --lime: var(--rv-lime);
  --accent: var(--rv-lime);
  background: var(--rv-canvas);
  font-family: var(--rv-font-body);
}
.product :is(h1, h2, h3) {
  font-family: var(--rv-font-display);
}
.rv-wordmark {
  display: inline-block;
  font-family: var(--rv-font-display);
  font-weight: 800;
  letter-spacing: -0.045em;
  white-space: nowrap;
}
.rv-wordmark > sup {
  margin-left: 0.12em;
  font-size: 0.45em;
  font-weight: 600;
  line-height: 0;
  letter-spacing: 0;
  vertical-align: super;
}
.product
  :is(.eyebrow, .timeline-date, .public-identity, .rv-metadata, .local-label) {
  font-family: var(--rv-font-metadata);
}
.product :is(button, a, input, select, textarea):focus-visible {
  outline: 3px solid var(--rv-focus);
  outline-offset: 3px;
}
.product .standing {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: var(--rv-radius);
  padding: 3px 6px;
  font: 11px/1.5 var(--rv-font-metadata);
  background: var(--rv-unknown-bg);
  color: var(--rv-unknown);
}
.evidence-symbol {
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.product .standing.verified {
  color: var(--rv-verified);
  background: var(--rv-verified-bg);
}
.product .standing.source {
  color: var(--rv-source);
  background: var(--rv-source-bg);
}
.product .standing.owner {
  color: var(--rv-owner);
  background: var(--rv-owner-bg);
}
.product .standing.candidate {
  color: var(--rv-pending);
  background: var(--rv-pending-bg);
}
.product .standing.disputed {
  color: var(--rv-disputed);
  background: var(--rv-disputed-bg);
}
.record-label {
  display: inline-block;
  font: 11px/1.5 var(--rv-font-metadata);
  color: var(--rv-muted);
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
  padding: 4px 8px;
}
.record-hero .record-label {
  color: var(--rv-on-registry);
  border-color: var(--rv-registry-muted);
  margin-bottom: 20px;
}
.product .rv-button {
  cursor: pointer;
  border-radius: var(--rv-radius);
  font: 600 12px/1.5 var(--rv-font-body);
}
.product :is(.rv-button-primary, .primary-button, .registry-search button) {
  background: var(--rv-registry);
  color: var(--rv-on-registry);
  border: 1px solid transparent;
  padding: 12px 18px;
}
.product .rv-button-dark {
  background: var(--rv-registry);
  color: var(--rv-on-registry);
  border: 1px solid transparent;
  padding: 12px 18px;
}
.product .rv-button-outline {
  background: var(--rv-surface);
  color: var(--rv-ink);
  border: 1px solid var(--rv-line);
  padding: 8px 12px;
  text-decoration: none;
}
.product .rv-button-text {
  background: transparent;
  color: inherit;
}
.product .rv-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.rv-registry-card {
  background: var(--rv-registry);
  color: var(--rv-on-registry);
  padding: var(--rv-space-5);
  border-radius: var(--rv-radius);
}
.rv-evidence-card {
  background: var(--rv-surface);
  border: 1px solid var(--rv-line);
  padding: var(--rv-space-5);
  border-radius: var(--rv-radius);
}
.rv-attention-card {
  background: var(--rv-pending-bg);
  color: var(--rv-pending);
  padding: var(--rv-space-5);
  border-radius: var(--rv-radius);
}
.product .overview-grid,
.rv-record-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--rv-space-5);
}
.product .overview-grid > :first-child,
.rv-record-grid > :first-child {
  grid-column: span 8;
  min-width: 0;
}
.product .overview-grid > :last-child,
.rv-record-grid > :last-child {
  grid-column: span 4;
  min-width: 0;
}
.rv-record-grid > aside {
  align-self: start;
}
.photo-provenance p {
  font-size: 11px;
  color: var(--rv-muted);
}
.product .document-source.rv-evidence-card {
  text-decoration: none;
  color: var(--rv-ink);
  margin: 16px 0;
}
.product .document-source .evidence-button {
  margin-top: 12px;
}
.rv-specimen {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 24px;
  margin: 24px 0 48px;
}
.rv-specimen > article {
  min-width: 0;
}
.rv-swatch {
  height: 50px;
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
}
.rv-examples {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 24px 0;
}
@media (max-width: 1050px) {
  .product .overview-grid > :first-child,
  .product .overview-grid > :last-child,
  .rv-record-grid > :first-child,
  .rv-record-grid > :last-child {
    grid-column: 1 / -1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .product * {
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
.swatch-canvas {
  background: var(--rv-canvas);
}
.swatch-surface {
  background: var(--rv-surface);
}
.swatch-ink {
  background: var(--rv-ink);
}
.swatch-registry {
  background: var(--rv-registry);
}
.swatch-acid {
  background: var(--rv-acid);
}
.swatch-muted {
  background: var(--rv-muted);
}
.swatch-line {
  background: var(--rv-line);
}
.swatch-verified {
  background: var(--rv-verified);
}
.swatch-source {
  background: var(--rv-source);
}
.swatch-pending {
  background: var(--rv-pending);
}
.swatch-disputed {
  background: var(--rv-disputed);
}
.swatch-unknown {
  background: var(--rv-unknown);
}
.swatch-steel {
  background: var(--rv-steel);
}
.swatch-steel-paper {
  background: var(--rv-steel-paper);
}
.swatch-navigation {
  background: var(--rv-navigation);
}
.swatch-navigation-surface {
  background: var(--rv-navigation-surface);
}
.swatch-technical-ink {
  background: var(--rv-technical-ink);
}

.product .hero-fact {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--rv-on-registry);
}
.product .hero-fact .standing {
  margin: 0;
}
/* Low-specificity defaults allow tab and record controls to retain their geometry. */
:where(.rv-button-text) {
  border: 0;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 4px;
}
:is(.strength-row, .hero-fact, [role='tab']) {
  text-decoration: none;
}

/* Visual refinement: shared rules, restrained surfaces, unchanged semantics. */
.product {
  background-image: none;
}
.product-header {
  border-bottom: 1px solid #32392f;
  min-height: 100px;
  padding-inline: max(32px, calc((100vw - 1200px) / 2));
}
.product-header .brand {
  width: 290px;
}
.product-header nav {
  gap: 24px;
  font-size: 12px;
}
.product-header nav :is(a, button) {
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-block: 6px;
}
.product-header nav :is(a, button):hover {
  border-bottom-color: var(--rv-registry-muted);
}
.product #product-main {
  padding-top: 48px;
  padding-bottom: 72px;
}
.product h1 {
  font-weight: 600;
  letter-spacing: -1.6px;
}
.product h2 {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.6px;
}
.product h3 {
  font-size: 17px;
  font-weight: 600;
}
.product .intro {
  font-size: 13px;
  line-height: 1.8;
  max-width: 72ch;
}
.product :is(.standing, .record-label) {
  border-radius: 1px;
  white-space: nowrap;
}
.record-label {
  padding: 3px 6px;
  font-size: 10px;
}
.product :is(button, a, input, select, textarea) {
  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    color 160ms ease,
    text-decoration-color 160ms ease;
}
.product :is(.rv-button-primary, .primary-button, .rv-button-dark) {
  min-height: 42px;
  padding: 10px 16px;
}
.product .rv-button-outline {
  min-height: 34px;
  padding: 6px 10px;
  background: transparent;
}
.product .rv-button-outline:hover {
  border-color: var(--rv-source);
  background: var(--rv-source-bg);
}
.product :is(input:not([type='checkbox']), select) {
  min-height: 42px;
  border-radius: var(--rv-radius);
}
.registry-search {
  min-height: 58px;
  margin-block: 30px 20px;
}
.principles {
  padding-block: 28px;
  margin-bottom: 48px;
}
.vehicle-grid {
  gap: 24px;
  margin-block: 28px 40px;
}
.vehicle-card {
  border: 0;
  border-bottom: 1px solid var(--rv-line);
  border-radius: 0;
  background: #ffffff70;
}
.vehicle-card:hover {
  border-bottom-color: var(--rv-source);
  background: #ffffffb8;
}
.vehicle-card-body {
  padding: 20px 16px 24px;
  gap: 10px;
}
.vehicle-card-body h3 {
  font-size: 18px;
}
.paper-card {
  border: 0;
  border-top: 1px solid var(--rv-line);
  border-radius: 0;
  background: #ffffff80;
  padding: 26px 24px;
  margin-bottom: 28px;
}
.paper-card h2 {
  margin-bottom: 20px;
}
.identity-dossier > div {
  padding-block: 11px;
}
.identity-dossier dt {
  font-size: 11px;
}
.identity-dossier dd {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.7;
}
.strength-row {
  padding-block: 13px;
  gap: 12px;
}
.strength-row:hover {
  background: #46583b06;
}
.record-notice {
  padding-block: 22px;
  gap: 24px;
}
.record-tabs {
  gap: 28px;
  margin: 0 0 32px;
}
.record-tabs button {
  padding: 14px 0;
  border-bottom-width: 2px;
  font-size: 12px;
}
.record-tabs button:hover {
  color: var(--rv-ink);
  border-bottom-color: var(--rv-line);
}
.record-tabs button[aria-selected='true'] {
  border-bottom-color: var(--rv-ink);
  font-weight: 600;
}
.record-timeline {
  max-width: 880px;
  margin: 24px 0 36px 8px;
  padding-left: 28px;
}
.record-timeline li {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--rv-line);
  border-radius: 0;
  padding: 22px 0 24px;
  margin-bottom: 0;
}
.record-timeline li::before {
  width: 5px;
  height: 5px;
  border: 0;
  left: -31px;
  top: 28px;
  background: var(--rv-muted);
}
.record-timeline .timeline-date {
  font-size: 10px;
  letter-spacing: 0.4px;
  margin-bottom: 8px;
}
.record-timeline h3 {
  margin: 0 0 10px;
}
.record-timeline li > p:not(.timeline-date) {
  max-width: 74ch;
}
.record-timeline .evidence-button {
  margin-top: 14px;
}
.table-scroll :is(th, td) {
  padding: 11px 14px 11px 0;
}
.table-scroll th {
  font: 10px/1.6 var(--rv-font-metadata);
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--rv-muted);
}
.table-scroll td {
  line-height: 1.7;
}
.record-gallery {
  gap: 28px 24px;
}
.record-gallery figure {
  border: 0;
  border-bottom: 1px solid var(--rv-line);
  padding: 0 0 12px;
  background: transparent;
}
.record-gallery figcaption {
  margin: 12px 0 0;
  line-height: 1.7;
}
.photo-provenance p {
  font-size: 10px;
  line-height: 1.7;
  margin-block: 6px;
}
.product .document-source.rv-evidence-card {
  border: 0;
  border-top: 1px solid var(--rv-line);
  background: transparent;
  padding: 20px 0;
  margin: 0;
}
.drawer {
  background: #f7f7f2;
  padding: 48px 36px;
  box-shadow: none;
  border-left: 1px solid #aab1a4;
}
.drawer::backdrop {
  background: #10171080;
}
.drawer h2 {
  font-size: 28px;
  line-height: 1.25;
}
.drawer h3 {
  border-top: 1px solid var(--rv-line);
  padding-top: 16px;
  margin: 22px 0 6px;
  font: 10px/1.6 var(--rv-font-metadata);
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--rv-muted);
}
.drawer p {
  margin-block: 8px 14px;
  line-height: 1.8;
}
#evidence-body > h3:first-of-type + p {
  font-size: 15px;
  line-height: 1.75;
}
.drawer[open] {
  animation: record-reveal 160ms ease-out;
}
@keyframes record-reveal {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .product * {
    animation: none !important;
  }
}
@media (max-width: 760px) {
  .product-header {
    padding-inline: 20px;
  }
  .product #product-main {
    padding: 28px 20px 48px;
  }
  .product-header .brand {
    width: 260px;
  }
  .product-header nav {
    gap: 18px;
  }
  .paper-card {
    padding: 22px 18px;
  }
  .record-tabs {
    gap: 24px;
    margin-bottom: 24px;
  }
  .record-timeline {
    padding-left: 20px;
    margin-left: 4px;
  }
  .record-timeline li::before {
    left: -23px;
  }
  .drawer {
    padding: 48px 24px 28px;
  }
}

/* Interaction states and target geometry; evidence colors are unchanged. */
.product .rv-button-utility {
  border: 1px solid var(--rv-line);
  background: transparent;
  color: var(--rv-ink);
  min-height: 36px;
  padding: 6px 10px;
}
.product .rv-button-destructive {
  border: 1px solid var(--rv-disputed);
  color: var(--rv-disputed);
  background: transparent;
  padding: 10px 16px;
}
.product button:active:not(:disabled) {
  filter: brightness(0.94);
}
.product button:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.product button[aria-busy='true'] {
  cursor: progress;
}
.product .evidence-status-control {
  border: 0;
  background: none;
  padding: 3px 0;
  min-height: 32px;
  text-align: left;
}
.product .evidence-status-control:hover .standing {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.product .evidence-button {
  min-height: 36px;
  text-align: left;
  padding: 8px 0;
  border: 0;
}
.evidence-navigation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid var(--rv-line);
}
.evidence-navigation button {
  min-height: 40px;
}
.evidence-navigation span {
  font: 11px var(--rv-font-metadata);
  color: var(--rv-muted);
}
.photo-load-error {
  font-size: 12px;
  padding: 16px;
}
#claim-form[aria-busy='true'] {
  cursor: progress;
}
@media (pointer: coarse) {
  .product :is(button, .text-action, .diagram-nodes a) {
    min-height: 44px;
  }
  .product .text-action {
    display: inline-flex;
    align-items: center;
  }
  .product .claim-form label:has(input[type='checkbox']) {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
  }
}
@media (max-width: 760px) {
  .record-panel {
    display: flex;
    flex-direction: column;
  }
  .record-panel > .compact-strength {
    order: 2;
    margin-top: 28px;
  }
  .drawer {
    inset: auto 0 0;
    width: 100%;
    height: auto;
    max-height: 90dvh;
    border-left: 0;
    border-top: 1px solid var(--rv-line);
  }
}

.swatch-lime {
  background: var(--rv-lime);
}
.swatch-chartreuse-test {
  background: var(--rv-chartreuse-test);
}
.swatch-data {
  background: var(--rv-data);
}
.swatch-graphite {
  background: var(--rv-graphite);
}
.product :is(button, a, input, select, textarea):focus-visible {
  box-shadow: 0 0 0 2px var(--rv-steel);
}
.topic-mark {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: 11px/1.6 var(--rv-font-metadata);
  color: var(--rv-muted);
}
.topic-mark::before {
  content: '';
  width: 5px;
  height: 5px;
  flex-shrink: 0;
  background: var(--topic-color, var(--rv-source));
}
[data-topic='identity'] {
  --topic-color: var(--rv-technical-ink);
}
[data-topic='competition'] {
  --topic-color: var(--rv-data);
}
[data-topic='service'] {
  --topic-color: var(--rv-graphite);
}
[data-topic='ownership'] {
  --topic-color: var(--rv-ink);
}
[data-topic='evidence'] {
  --topic-color: var(--rv-source);
}
[data-topic='damage'] {
  --topic-color: var(--rv-disputed);
}
.record-timeline li[data-topic]::before {
  background: var(--topic-color);
}
.record-timeline li[data-evidence-state='disputed']::before {
  background: var(--rv-disputed);
}
.record-timeline li[data-evidence-state='candidate']::before {
  background: var(--rv-pending);
}
.data-context-label {
  display: inline-block;
  color: var(--rv-data);
  background: var(--rv-data-bg);
  padding: 3px 6px;
  font: 11px/1.5 var(--rv-font-metadata);
}
.palette-guidance {
  margin-block: 2rem;
}
.palette-topic-key {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-block: 18px;
}
