/* Shared photo-first livery cards. Without enhancement, details remain visible. */
body.gu-platform .gu-livery-card {
  --livery-height: 350px;
  position: relative; isolation: isolate; min-width: 0; overflow: hidden;
  border: 1px solid #435165; border-radius: 12px; background: #0d141e;
}
body.gu-platform .gu-livery-cover {
  position: relative; display: block; aspect-ratio: 16/10; overflow: hidden;
  padding: 0; border: 0; border-radius: 0; color: #fff; text-decoration: none;
}
body.gu-platform .gu-livery-photo {
  position: absolute; inset: 0; display: block; width: 100%; height: 100%;
  aspect-ratio: auto; object-fit: cover; background: #121a24;
}
body.gu-platform .gu-livery-cover::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 48%, #080d14d9);
}
body.gu-platform .gu-livery-identity {
  position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 16px;
  display: flex; align-items: center; gap: 10px; padding: 9px 11px;
  min-height: 58px; border: 1px solid #ffffff30; border-radius: 9px;
  background: #0a101bd9; color: #fff; text-align: left;
}
body.gu-platform .gu-livery-identity .gu-livery-mark {
  position: static; flex: 0 0 40px; width: 40px; height: 40px;
  object-fit: contain; aspect-ratio: 1; border-radius: 6px; background: #101823;
}
body.gu-platform .gu-livery-credit { display: grid; gap: 3px; min-width: 0; padding: 0; }
body.gu-platform .gu-livery-credit strong,
body.gu-platform .gu-livery-credit > span {
  margin: 0; padding: 0; color: #f0f3f8; font-size: 12px; line-height: 1.4;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
body.gu-platform .gu-livery-credit strong { font-size: 14px; font-weight: 650; }
body.gu-platform .gu-livery-chevron { display: none; margin-left: auto; padding: 0; color: #d9d2ed; }
body.gu-platform .gu-livery-details { padding: 16px; color: #e4eaf3; }
body.gu-platform .gu-livery-details h3 { margin: 0 0 7px; font: 650 18px/1.25 Inter,sans-serif; letter-spacing: -.3px; text-transform: none; overflow-wrap: anywhere; }
body.gu-platform .gu-livery-details h3 a { display: inline; padding: 0; border: 0; background: none; color: #fff; text-decoration: none; }
body.gu-platform .gu-livery-car { margin: 0 0 12px; color: #c3cedc; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
body.gu-platform .gu-livery-facts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: 11px; color: #bcc9db; }
body.gu-platform .gu-livery-sim { display: inline-flex; align-items: center; gap: 6px; padding: 0; }
body.gu-platform .gu-livery-sim img { display: block; height: 24px; width: auto; max-width: 70px; aspect-ratio: auto; object-fit: contain; background: none; }
body.gu-platform .gu-livery-rating { padding: 0; color: #dce4ee; }
body.gu-platform .gu-livery-links { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 10px 0; }
body.gu-platform .gu-livery-links a { display: inline-flex; align-items: center; min-height: 30px; padding: 0; border: 0; background: none; color: #c1cfe2; font-size: 11px; text-decoration: none; }
body.gu-platform .gu-livery-open {
  display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 42px; padding: 9px 12px; border: 1px solid #8696af;
  border-radius: 7px; background: #263346; color: #fff; font-size: 12px; font-weight: 650; text-decoration: none;
}
body.gu-platform .gu-livery-details a:hover { color: #fff; text-decoration: underline; }
body.gu-platform .gu-livery-card a:focus-visible { outline: 2px solid #c7b2ef; outline-offset: -3px; }
body.gu-platform .gu-livery-card.is-enhanced { height: var(--livery-height); }
body.gu-platform .gu-livery-card.is-enhanced .gu-livery-cover { position: absolute; inset: 0; aspect-ratio: auto; }
body.gu-platform .gu-livery-card.is-enhanced .gu-livery-identity { bottom: auto; top: 16px; transform: translateY(calc(var(--livery-height) - 108px)); }
body.gu-platform .gu-livery-card.is-enhanced .gu-livery-chevron { display: block; }
body.gu-platform .gu-livery-card.is-enhanced .gu-livery-details {
  position: absolute; z-index: 3; top: 90px; bottom: 14px; left: 16px; right: 16px;
  padding: 0; overflow-y: auto; overscroll-behavior: contain;
  visibility: hidden; opacity: 0; transform: translateY(14px); pointer-events: none;
}
body.gu-platform .gu-livery-card.is-enhanced.is-revealed .gu-livery-identity { transform: translateY(0); }
body.gu-platform .gu-livery-card.is-enhanced.is-revealed .gu-livery-cover::after { background: linear-gradient(180deg,#080d1459,#080d14eb 26%,#080d14f5); }
body.gu-platform .gu-livery-card.is-enhanced.is-revealed .gu-livery-details { visibility: visible; opacity: 1; transform: none; pointer-events: auto; }
body.gu-platform .gu-livery-card.is-enhanced.is-revealed .gu-livery-chevron { transform: rotate(180deg); }
body.gu-platform .gu-livery-card.has-interacted :is(.gu-livery-identity,.gu-livery-details,.gu-livery-chevron) { transition: transform 220ms ease, opacity 180ms ease, visibility 180ms; }
body.gu-platform .gu-livery-card.is-revealed { border-color: #b2a3ce; }
body.gu-platform :is(.profile-liveries,.ts-garage) > .gu-livery-card { --livery-height: 360px; }
@media(prefers-reduced-motion:reduce) {
  body.gu-platform .gu-livery-card.has-interacted :is(.gu-livery-identity,.gu-livery-details,.gu-livery-chevron) { transition: none; }
}