.drive-media-preview-dialog {
  position: relative !important;
}

.drive-media-preview-header {
  position: absolute !important;
  z-index: 5;
  inset: 0 0 auto;
  height: 0;
  min-height: 0 !important;
  flex: none;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  pointer-events: none;
}

.drive-media-preview-header > div {
  position: absolute;
  top: calc(env(safe-area-inset-top) + 12px);
  left: calc(env(safe-area-inset-left) + 12px);
  width: min(340px, calc(100vw - 82px));
  gap: 0;
  border: 1px solid color-mix(in srgb, var(--foreground) 12%, transparent);
  border-radius: 13px;
  padding: 8px 12px;
  background: color-mix(in srgb, var(--card) 88%, transparent);
  box-shadow: 0 8px 28px color-mix(in srgb, var(--background) 26%, transparent);
  backdrop-filter: blur(18px);
  pointer-events: auto;
}

.drive-media-preview-header h2 {
  font-size: 11px;
}

.drive-media-preview-header p {
  display: none;
}

.drive-media-preview-header > button {
  position: absolute;
  top: calc(env(safe-area-inset-top) + 12px);
  right: calc(env(safe-area-inset-right) + 12px);
  width: 40px;
  height: 40px;
  border-color: color-mix(in srgb, var(--foreground) 16%, transparent);
  background: color-mix(in srgb, var(--card) 90%, transparent);
  box-shadow: 0 8px 28px color-mix(in srgb, var(--background) 26%, transparent);
  backdrop-filter: blur(18px);
  pointer-events: auto;
}

.drive-media-preview-body {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  flex: none !important;
  padding: 0 !important;
}

.drive-media-preview-body > img,
.drive-media-preview-body > video {
  display: block;
  width: auto !important;
  height: auto !important;
  max-width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 16px) !important;
  max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 16px) !important;
  object-fit: contain;
}

.drive-media-preview-body > iframe {
  width: 100%;
  height: 100%;
}

@media (max-width: 640px) {
  .drive-media-preview-header > div {
    top: calc(env(safe-area-inset-top) + 8px);
    left: calc(env(safe-area-inset-left) + 8px);
    width: min(300px, calc(100vw - 72px));
  }

  .drive-media-preview-header > button {
    top: calc(env(safe-area-inset-top) + 8px);
    right: calc(env(safe-area-inset-right) + 8px);
    width: 38px;
    height: 38px;
  }
}