/* Photo controls are separate from navigation and vehicle actions. */
dialog.lightbox{
  width:min(1120px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 32px);
  padding:12px 14px 0;border:1px solid #4d3a3d;border-radius:12px;
  background:#101011;color:#f7f6f4;overflow:auto;overscroll-behavior:contain;
  box-shadow:0 24px 90px #0009
}
dialog.lightbox::backdrop{background:#060607e8;backdrop-filter:blur(5px)}
.lightbox-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.lightbox-head h2{font:600 16px/1.35 "Segoe UI",Arial,sans-serif;letter-spacing:0;margin:0;min-width:0}
.lightbox-control{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:46px;height:46px;padding:0;border:1px solid #ffffff30;border-radius:8px;
  background:#11111366;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent
}
.lightbox-control svg{pointer-events:none;display:block}
.lightbox-close{background:transparent;border-color:#ffffff24}
.lightbox-stage{position:relative;display:grid;place-items:center;min-height:100px;background:#09090a;border-radius:6px;overflow:hidden;touch-action:pan-y pinch-zoom}
dialog.lightbox .lightbox-photo{
  display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 164px);
  object-fit:contain;user-select:none;-webkit-user-drag:none
}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;transform:translateY(-50%);background:#09090bab;backdrop-filter:blur(5px)}
.lightbox-prev{left:12px}.lightbox-next{right:12px}
.lightbox-count{display:block;padding:15px 0 16px;text-align:center;font-size:13px;line-height:1.3;color:#c8c4c5;font-variant-numeric:tabular-nums}
.lightbox-control:focus-visible{outline:2px solid #ffb7b5;outline-offset:3px}
@media(hover:hover){.lightbox-control:hover{background:#541a24b0;border-color:#c86b70}}
@media(prefers-reduced-motion:no-preference){.lightbox-control{transition:background-color .16s ease,border-color .16s ease}}
@media(max-width:650px){
  dialog.lightbox{width:calc(100vw - 20px);max-height:calc(100dvh - 24px);padding:10px 10px 0;border-radius:10px}
  .lightbox-head{gap:10px;margin-bottom:10px}.lightbox-head h2{font-size:14px}
  .lightbox-control{width:44px;height:44px;border-radius:7px}
  dialog.lightbox .lightbox-photo{max-height:calc(100dvh - 150px)}
  .lightbox-prev{left:6px}.lightbox-next{right:6px}
  .lightbox-count{padding:13px 0 14px}
}
@media(max-height:450px){
  dialog.lightbox{padding-top:6px}.lightbox-head{margin-bottom:6px}
  dialog.lightbox .lightbox-photo{max-height:calc(100dvh - 130px)}
  .lightbox-count{padding:9px 0}
}