/* Vehicle quick view: identity first, full photographs, expandable details. */
#vehicle-dialog {
  width: min(820px, calc(100% - 40px));
  max-width: 820px;
  max-height: 94dvh;
  border: 1px solid #ffffffb3;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 30px 100px #0006;
  scroll-padding-top: 130px;
  /* Temporary page-turn images must never become the scroll anchor. */
  overflow-anchor: none;
}
#vehicle-dialog::backdrop { background: #101613ba; backdrop-filter: blur(7px); }
#vehicle-dialog .dialog-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  align-items: start;
  gap: 16px;
  height: auto;
  min-height: 0;
  padding: 18px 20px 15px;
  background: #fffffff5;
  letter-spacing: 0;
}
#dialog-heading { min-width: 0; }
#vehicle-dialog .detail-heading-row { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
#vehicle-dialog #dialog-title { min-width: 0; margin: 1px 0 0; font-size: 23px; line-height: 1.15; letter-spacing: -.6px; font-weight: 750; overflow-wrap: anywhere; }
#vehicle-dialog .detail-price { flex: none; margin: 0; text-align: right; font-size: 31px; line-height: 1; letter-spacing: -1px; }
#vehicle-dialog .detail-price small { margin-top: 6px; font-size: 10px; line-height: 1.3; }
#vehicle-dialog .detail-price-badge {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: 100%;
  padding: 9px 11px;
  border: 1px solid #efd29254;
  border-radius: 8px;
  background: linear-gradient(135deg, #292d32f2, #13171ded);
  box-shadow: 0 3px 12px #10151b33, inset 0 1px 0 #ffe3a21a;
  backdrop-filter: blur(12px) saturate(1.1);
  -webkit-backdrop-filter: blur(12px) saturate(1.1);
  transition: border-color .25s ease, box-shadow .25s ease;
}
#vehicle-dialog .detail-price-badge::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -45%;
  background: radial-gradient(ellipse at center, #f7d48638, transparent 60%);
  opacity: 0;
  transform: translateX(-35%);
  pointer-events: none;
  transition: opacity .25s ease;
}
#vehicle-dialog .detail-price-badge strong {
  max-width: 100%;
  color: #f4d17d;
  font-size: inherit;
  font-weight: 750;
  line-height: 1;
  text-shadow: 0 1px 2px #0009;
  white-space: normal;
  overflow-wrap: anywhere;
}
#vehicle-dialog .detail-price-badge small { max-width: 100%; color: #f1f3f5; white-space: normal; }
@supports (background-clip: text) or (-webkit-background-clip: text) {
  #vehicle-dialog .detail-price-badge strong {
    background: linear-gradient(105deg, #e5b65b 0%, #ffe5a5 27%, #ffe5a5 39%, #fff9de 48%, #e8b75b 59%, #f7d58a 78%, #e5b65b 100%);
    background-size: 240% 100%;
    background-position: 100% 50%;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    text-shadow: 0 0 12px #f3c65e1c;
  }
}
#vehicle-dialog .detail-price-badge:is(:hover, :focus-visible) {
  border-color: #f5d58f9c;
  box-shadow: 0 3px 15px #10151b40, 0 0 14px #e6b75224, inset 0 1px 0 #ffe3a230;
}
#vehicle-dialog .detail-price-badge:is(:hover, :focus-visible) strong { animation: rail-gold-letter-halo 2.4s ease-in-out infinite; }
#vehicle-dialog .detail-price-badge:is(:hover, :focus-visible)::before { opacity: 1; animation: rail-gold-reflection 2.4s ease-in-out infinite; }
#vehicle-dialog .detail-price-badge:focus-visible { outline: 3px solid #2368b4; outline-offset: 3px; }
#vehicle-dialog .detail-identification { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 15px; margin-top: 10px; color: #61695f; font-size: 12px; font-weight: 400; line-height: 1.4; }
#vehicle-dialog .detail-vin { overflow-wrap: anywhere; }
#vehicle-dialog .detail-vin strong { color: #424a40; font-weight: 500; font-variant-numeric: tabular-nums; }
#vehicle-dialog .detail-trim { padding-left: 15px; border-left: 1px solid #dce1d9; }
#vehicle-dialog #close-dialog { flex: none; width: 44px; height: 44px; background: #eef1ec; }
#vehicle-dialog #close-dialog:hover { background: #e1e7de; }
#vehicle-dialog .detail-photos { background: radial-gradient(ellipse at 50% 45%, #f1f3ef, #dce2dd); }
#vehicle-dialog .detail-photos img { display: block; width: 100%; height: clamp(240px, 40dvh, 380px); max-height: none; aspect-ratio: auto; object-fit: contain; }
#vehicle-dialog .gallery-controls { bottom: 12px; right: 12px; align-items: center; gap: 6px; }
#vehicle-dialog .gallery-controls button { width: 44px; height: 44px; border: 1px solid #ffffff91; border-radius: 50%; background: #ffffffeb; box-shadow: 0 2px 8px #17251b1a; }
#vehicle-dialog .gallery-controls #photo-counter { min-height: 34px; padding: 9px 10px; border-radius: 7px; background: #172019cc; color: #fff; font-size: 11px; line-height: 16px; backdrop-filter: blur(8px); }
#vehicle-dialog .detail-content { padding: 0 20px 18px; }
#vehicle-dialog .detail-status-tags { display: flex; flex-wrap: wrap; gap: 8px; padding: 18px 0; }
#vehicle-dialog .detail-status { display: inline-flex; align-items: center; min-height: 31px; padding: 7px 12px; border: 1px solid #cfd7cd; border-radius: 7px; background: linear-gradient(135deg, #fbfcfa, #e6eae4); box-shadow: inset 0 1px 0 #fff; color: #424e3c; font-size: 11px; font-weight: 600; line-height: 1.35; }
#vehicle-dialog .detail-status.title-salvage { border-color: #ddc694; background: linear-gradient(120deg, #fff1c8, #d3ba80); color: #554019; }
#vehicle-dialog .detail-status.title-clean { border-color: #a8cbe3; background: linear-gradient(120deg, #e8f5ff, #b7d5ea); color: #234d6b; }
#vehicle-dialog .detail-status.title-rebuilt { border-color: #cfc0df; background: linear-gradient(120deg, #f3ebfa, #d6c4e7); color: #624279; }
#vehicle-dialog .detail-panels { display: grid; gap: 9px; }
#vehicle-dialog .condition-box { margin: 0; }
#vehicle-dialog .condition-box > summary { min-height: 59px; padding: 10px 13px; }
#vehicle-dialog .condition-box .detail-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; margin: 0; padding: 16px 14px; border: 0; }
#vehicle-dialog .detail-facts > div { min-width: 0; grid-column: auto; }
#vehicle-dialog .detail-facts dt { margin-bottom: 5px; font-size: 11px; }
#vehicle-dialog .detail-facts dd { font-size: 12px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
/* The nine specification tiles expand inside the existing light disclosure. */
#vehicle-dialog .detail-spec-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 14px;
  border-top: 1px solid #353b40;
  background: radial-gradient(ellipse at top right, #303235, transparent 65%), #191c20;
}
#vehicle-dialog .detail-spec {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  min-width: 0;
  min-height: 88px;
  padding: 14px 12px;
  border: 1px solid #3a3e43;
  border-radius: 9px;
  background: linear-gradient(135deg, #2b2e33, #23262b);
  box-shadow: inset 0 1px 0 #ffffff05;
}
#vehicle-dialog .detail-spec-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 36px;
  height: 36px;
  border: 1px solid #b7913d2b;
  border-radius: 8px;
  background: linear-gradient(135deg, #534729, #3c3528);
  color: #e6bd66;
}
#vehicle-dialog .detail-spec-icon svg { width: 20px; height: 20px; }
#vehicle-dialog .detail-spec-copy { min-width: 0; padding-top: 1px; }
#vehicle-dialog .detail-spec dt { margin: 0 0 6px; color: #b6bac0; font-size: 9px; font-weight: 600; letter-spacing: .8px; line-height: 1.4; text-transform: uppercase; overflow-wrap: anywhere; }
#vehicle-dialog .detail-spec dd { margin: 0; color: #f7f7f5; font-size: 13px; font-weight: 650; line-height: 1.5; overflow-wrap: anywhere; }
#vehicle-dialog .detail-description { padding: 15px 14px 17px; }
#vehicle-dialog .condition-box .detail-description p { margin: 0; padding: 0; color: #505a4e; font-size: 13px; line-height: 1.75; white-space: pre-line; overflow-wrap: anywhere; }
#vehicle-dialog .condition-box .detail-description p + p { margin-top: 12px; }
#vehicle-dialog .detail-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 17px 0 8px; margin-top: 14px; border-top: 1px solid #e6eae3; }
#vehicle-dialog .detail-total { max-width: 360px; margin: 0; line-height: 1.6; font-size: 11px; }
#vehicle-dialog .detail-contact-icons { display: flex; flex: none; gap: 10px; }
#vehicle-dialog .detail-contact { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-width: 54px; padding: 0 2px; font-size: 10px; color: #596451; font-weight: 600; }
#vehicle-dialog .detail-contact svg { width: 46px; height: 46px; padding: 12px; border-radius: 50%; color: #fff; background: #c92722; box-shadow: 0 3px 8px #9c24181a; transition: background .18s, box-shadow .18s; }
#vehicle-dialog .detail-contact.whatsapp svg { background: #1b784b; box-shadow: 0 3px 8px #165d351a; }
#vehicle-dialog .detail-contact:hover svg { background: #a71d18; box-shadow: 0 4px 12px #9c241833; }
#vehicle-dialog .detail-contact.whatsapp:hover svg { background: #135c38; box-shadow: 0 4px 12px #165d3533; }
#vehicle-dialog .detail-source { min-height: 36px; margin-top: 0; font-size: 11px; }
#vehicle-dialog .detail-source + .detail-note { margin-top: 3px; }
#vehicle-dialog :is(button, a):focus-visible { outline: 3px solid #2368b4; outline-offset: 3px; }
@media (max-width: 600px) {
  #vehicle-dialog { width: 100%; max-width: 100%; max-height: 94dvh; margin: auto 0 0; border-radius: 15px 15px 0 0; }
  #vehicle-dialog .dialog-top { padding: 15px 12px 12px; gap: 8px; }
  #vehicle-dialog .detail-heading-row { gap: 9px; }
  #vehicle-dialog #dialog-title { font-size: 18px; line-height: 1.2; letter-spacing: -.35px; }
  #vehicle-dialog .detail-price { font-size: 25px; letter-spacing: -.8px; }
  #vehicle-dialog .detail-price small { max-width: 98px; font-size: 9px; }
  #vehicle-dialog .detail-price-badge { padding: 8px 9px; }
  #vehicle-dialog .detail-identification { gap: 4px 10px; margin-top: 9px; font-size: 11px; }
  #vehicle-dialog .detail-trim { padding-left: 0; border-left: 0; }
  #vehicle-dialog .detail-photos img { height: clamp(190px, 31dvh, 285px); }
  #vehicle-dialog .detail-content { padding: 0 14px calc(18px + env(safe-area-inset-bottom)); }
  #vehicle-dialog .detail-status-tags { gap: 6px; padding: 13px 0; }
  #vehicle-dialog .detail-status { font-size: 10px; padding: 6px 9px; }
  #vehicle-dialog .detail-bottom { flex-wrap: wrap; gap: 12px; padding-top: 13px; }
  #vehicle-dialog .detail-total { flex: 1 1 100%; }
  #vehicle-dialog .detail-contact-icons { margin-left: auto; gap: 13px; }
  #vehicle-dialog .detail-contact svg { width: 48px; height: 48px; }
  #vehicle-dialog .detail-source { min-height: 44px; }
  #vehicle-dialog .detail-spec-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; }
  #vehicle-dialog .detail-spec { flex-direction: column; gap: 10px; min-height: 110px; padding: 12px 10px; }
  #vehicle-dialog .detail-spec-icon { width: 33px; height: 33px; }
  #vehicle-dialog .detail-spec-icon svg { width: 19px; height: 19px; }
  #vehicle-dialog .detail-spec dt { font-size: 9px; letter-spacing: .6px; }
  #vehicle-dialog .detail-spec dd { font-size: 12px; }
  #vehicle-dialog .detail-description { padding: 13px; }
}
@media (max-width: 360px) {
  #vehicle-dialog .detail-heading-row { flex-wrap: wrap; }
  #vehicle-dialog #dialog-title { flex: 1 1 100%; }
  #vehicle-dialog .detail-price-badge { align-items: flex-start; text-align: left; font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  #vehicle-dialog .detail-contact svg { transition: none; }
  #vehicle-dialog .detail-price-badge,
  #vehicle-dialog .detail-price-badge::before { transition: none; }
  #vehicle-dialog .detail-price-badge:is(:hover, :focus-visible) strong,
  #vehicle-dialog .detail-price-badge:is(:hover, :focus-visible)::before { animation: none; }
  #vehicle-dialog .detail-price-badge:is(:hover, :focus-visible) strong { text-shadow: 0 0 7px #f4cc7770; }
}

/* The frame stays fixed while only an outgoing photograph turns like a page. */
#vehicle-dialog .detail-book-gallery { position: relative; overflow: hidden; }
#vehicle-dialog .detail-book-stage { padding: 21px 29px 17px 22px; }
#vehicle-dialog .detail-book-stack { position: relative; height: clamp(240px, 40dvh, 370px); perspective: 1200px; isolation: isolate; }
#vehicle-dialog .detail-book-photo-panel,
#vehicle-dialog .detail-video-panel { position: absolute; inset: 0; width: 100%; height: 100%; }
#vehicle-dialog .detail-book-photo-panel[hidden],
#vehicle-dialog .detail-video-panel[hidden] { display: none; }
#vehicle-dialog .detail-video-panel { z-index: 3; overflow: hidden; border: 1px solid #ffffffd9; border-radius: 9px; background: #101411; box-shadow: 0 8px 22px #19291f2b; }
#vehicle-dialog .detail-video-panel iframe { display: block; width: 100%; height: 100%; border: 0; }
#vehicle-dialog .detail-video-external { position: absolute; z-index: 1; top: 8px; right: 8px; display: inline-flex; align-items: center; min-height: 44px; max-width: calc(100% - 16px); padding: 9px 12px; border: 1px solid #ffffff40; border-radius: 7px; background: #111913d9; color: #fff4d4; font-size: 10px; line-height: 1.3; box-shadow: 0 2px 8px #0003; }
#vehicle-dialog .detail-video-external:hover { background: #293b2df2; }
#vehicle-dialog .detail-book-sheets { position: absolute; inset: 0; pointer-events: none; }
#vehicle-dialog .detail-book-sheet { position: absolute; inset: 0; overflow: hidden; border: 1px solid #ffffffbd; border-radius: 9px; background: #f0f3efb5; box-shadow: 0 3px 12px #18231c1a; transform-origin: 0 50%; }
#vehicle-dialog .detail-book-sheet[data-depth="1"] { z-index: 2; opacity: .32; transform: translate(5px, -4px); }
#vehicle-dialog .detail-book-stack img { display: block; width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: contain; }
#vehicle-dialog .detail-photo-open { display: block; position: relative; z-index: 3; width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden; border: 1px solid #ffffffd9; border-radius: 9px; background: #e8ede8; box-shadow: 0 8px 22px #19291f2b; cursor: zoom-in; transform-origin: 0 50%; touch-action: manipulation; }
#vehicle-dialog .detail-photo-open img { opacity: 1; filter: none; }
#vehicle-dialog .detail-photo-open:focus-visible { outline-offset: 4px; }
#vehicle-dialog .detail-book-turning { position: absolute; z-index: 4; inset: 0; border: 0; border-radius: 9px; background: transparent; pointer-events: none; backface-visibility: hidden; will-change: transform, opacity; }
#vehicle-dialog .detail-gallery-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 0 21px 15px; }
#vehicle-dialog .detail-gallery-hint { display: flex; align-items: center; gap: 7px; color: #5f6c60; font-size: 11px; line-height: 1.4; }
#vehicle-dialog .detail-gallery-hint svg { width: 16px; height: 16px; }
#vehicle-dialog .detail-media-switch { display: inline-flex; flex: none; height: 44px; gap: 2px; padding: 0; border-radius: 8px; background: #d4ddd1; box-shadow: inset 0 0 0 1px #acbba5; }
#vehicle-dialog .detail-media-switch button { display: inline-flex; align-items: center; justify-content: center; min-width: 53px; min-height: 44px; padding: 8px 11px; border: 0; border-radius: 8px; background: transparent; color: #53614b; font-size: 11px; font-weight: 650; line-height: 1.3; }
#vehicle-dialog .detail-media-switch button[aria-selected="true"] { background: #33452d; color: #fff0c8; box-shadow: inset 0 0 0 1px #f0d39752; }
#vehicle-dialog .detail-media-switch button:hover:not([aria-selected="true"]) { background: #c4d1bf; }
#vehicle-dialog .detail-book-gallery[data-detail-media-mode="video"] .gallery-controls { visibility: hidden; pointer-events: none; }
#vehicle-dialog .detail-book-gallery .gallery-controls { position: static; display: flex; flex: none; align-items: center; gap: 7px; }
#vehicle-dialog .detail-book-gallery .gallery-controls[hidden] { display: none; }
#vehicle-dialog .detail-book-gallery .gallery-controls button { display: grid; place-items: center; width: 44px; height: 44px; }
#vehicle-dialog .detail-gallery-status { position: absolute; z-index: 5; left: 32px; right: 39px; bottom: 82px; width: fit-content; max-width: calc(100% - 71px); margin: 0; padding: 7px 10px; border-radius: 6px; background: #fffaf0f2; color: #795c21; font-size: 11px; line-height: 1.5; pointer-events: none; box-shadow: 0 2px 8px #0002; }
#vehicle-dialog .detail-gallery-status:empty { visibility: hidden; }
html[data-theme="dark"] #vehicle-dialog .detail-book-sheet { background: #3b4743a6; border-color: #adb9ad70; box-shadow: 0 3px 12px #0004; }
html[data-theme="dark"] #vehicle-dialog .detail-photo-open { background: #1a211f; border-color: #73836f80; }
html[data-theme="dark"] #vehicle-dialog .detail-gallery-hint { color: #c2cebb; }
html[data-theme="dark"] #vehicle-dialog .detail-gallery-status { color: #ecd08b; background: #252b23f2; }
html[data-theme="dark"] #vehicle-dialog .detail-media-switch { background: #233126; box-shadow: inset 0 0 0 1px #65775d; }
html[data-theme="dark"] #vehicle-dialog .detail-media-switch button { color: #c9d6bf; }
html[data-theme="dark"] #vehicle-dialog .detail-media-switch button[aria-selected="true"] { background: #566b43; color: #fff2c9; }
html[data-theme="dark"] #vehicle-dialog .detail-media-switch button:hover:not([aria-selected="true"]) { background: #35482e; }
html[data-theme="dark"] #vehicle-dialog .detail-video-panel { border-color: #73836f80; }

/* A separate native dialog keeps expanded photos above the vehicle quick view. */
#vehicle-lightbox { position: fixed; inset: 0; display: none; width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; overflow: hidden; border: 0; border-radius: 0; background: #0e1211; color: #f3f5ef; box-shadow: none; }
#vehicle-lightbox[open] { display: flex; flex-direction: column; }
#vehicle-lightbox::backdrop { background: #070a08ed; }
#vehicle-lightbox .lightbox-header { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 20px; min-height: 76px; padding: max(13px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) 13px max(20px, env(safe-area-inset-left)); border-bottom: 1px solid #ffffff12; background: linear-gradient(135deg, #1c251f, #101612); }
#vehicle-lightbox .lightbox-header>div { min-width: 0; }
#vehicle-lightbox #lightbox-subtitle { display: block; margin-bottom: 4px; color: #c7b67d; font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; }
#vehicle-lightbox #lightbox-title { margin: 0; color: #f1f5ed; font-size: 18px; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
#vehicle-lightbox #close-lightbox { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border: 1px solid #ffffff30; border-radius: 50%; background: #ffffff0e; color: white; }
#vehicle-lightbox #close-lightbox:hover { background: #ffffff22; }
#vehicle-lightbox .lightbox-stage { position: relative; display: flex; flex: 1 1 auto; align-items: center; justify-content: center; min-height: 0; padding: 12px 30px; overflow: hidden; perspective: 1400px; }
#vehicle-lightbox #lightbox-photo { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; opacity: 1; filter: none; }
#vehicle-lightbox .lightbox-turning { position: absolute; z-index: 2; top: 12px; left: 30px; width: calc(100% - 60px); height: calc(100% - 24px); object-fit: contain; border: 0; background: transparent; pointer-events: none; backface-visibility: hidden; will-change: transform, opacity; }
#vehicle-lightbox .lightbox-controls { display: flex; flex: none; justify-content: center; align-items: center; gap: 18px; min-height: 74px; padding: 11px 18px max(12px, env(safe-area-inset-bottom)); border-top: 1px solid #ffffff12; }
#vehicle-lightbox .lightbox-controls button { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #c2ceae55; border-radius: 50%; background: #2b382a; color: #f2da9b; }
#vehicle-lightbox .lightbox-controls button:hover { background: #43513d; }
#vehicle-lightbox .lightbox-controls button[hidden] { display: none; }
#vehicle-lightbox #lightbox-counter { min-width: 70px; text-align: center; color: #d8dfcf; font-size: 13px; font-variant-numeric: tabular-nums; }
#vehicle-lightbox #lightbox-status { position: absolute; z-index: 3; bottom: calc(89px + env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); width: max-content; max-width: calc(100% - 32px); margin: 0; padding: 7px 11px; border-radius: 7px; background: #24291ff2; color: #e7cd89; font-size: 12px; line-height: 1.5; text-align: center; pointer-events: none; }
#vehicle-lightbox #lightbox-status:empty { visibility: hidden; }
#vehicle-lightbox button:focus-visible { outline: 3px solid #e4cc8b; outline-offset: 4px; }
@media (max-width: 600px) {
  #vehicle-dialog .detail-book-stage { padding: 16px 19px 14px 12px; }
  #vehicle-dialog .detail-book-stack { height: clamp(185px, 31dvh, 285px); }
  #vehicle-dialog .detail-book-sheet[data-depth="1"] { transform: translate(4px, -3px); }
  #vehicle-dialog .detail-gallery-footer { gap: 8px; padding: 0 12px 12px; }
  #vehicle-dialog .detail-gallery-hint { max-width: 125px; gap: 5px; font-size: 10px; }
  #vehicle-dialog .detail-media-switch button { min-width: 51px; padding-inline: 9px; font-size: 10px; }
  #vehicle-dialog .detail-video-external { top: 5px; right: 5px; padding-inline: 9px; font-size: 9px; }
  #vehicle-dialog .detail-book-gallery .gallery-controls { gap: 5px; }
  #vehicle-dialog .detail-book-gallery .gallery-controls #photo-counter { padding-inline: 7px; font-size: 10px; }
  #vehicle-dialog .detail-gallery-status { left: 20px; right: 27px; bottom: 78px; max-width: calc(100% - 47px); }
  #vehicle-lightbox .lightbox-header { gap: 10px; min-height: 69px; padding-inline: max(12px, env(safe-area-inset-left)); }
  #vehicle-lightbox #lightbox-title { font-size: 15px; }
  #vehicle-lightbox #lightbox-subtitle { font-size: 8px; }
  #vehicle-lightbox .lightbox-stage { padding: 7px 8px; }
  #vehicle-lightbox .lightbox-turning { top: 7px; left: 8px; width: calc(100% - 16px); height: calc(100% - 14px); }
  #vehicle-lightbox .lightbox-controls { gap: 25px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  #vehicle-lightbox .lightbox-header { min-height: 56px; padding-block: 6px; }
  #vehicle-lightbox #lightbox-subtitle { display: none; }
  #vehicle-lightbox .lightbox-controls { min-height: 60px; padding-block: 6px; }
  #vehicle-lightbox .lightbox-stage { padding-block: 4px; }
  #vehicle-lightbox .lightbox-turning { top: 4px; height: calc(100% - 8px); }
  #vehicle-lightbox #lightbox-status { bottom: 67px; }
}