/* Shared device boundaries; retain the ordinary layouts on unsegmented screens. */
:root {
  --page-width: 100vw;
  --gutter: max(clamp(20px, 4.2vw, 80px), env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
}
.site-header { padding-top: max(24px, env(safe-area-inset-top, 0px)); }
.site-footer { padding-bottom: max(28px, env(safe-area-inset-bottom, 0px)); }
.screening-room {
  padding-left: max(clamp(16px, 4vw, 70px), env(safe-area-inset-left, 0px));
  padding-right: max(clamp(16px, 4vw, 70px), env(safe-area-inset-right, 0px));
  padding-bottom: max(28px, env(safe-area-inset-bottom, 0px));
}
.client-directory-panel { width: min(560px, calc(var(--page-width) - 2 * var(--gutter))); }
.has-film-controls:fullscreen .film-controls {
  padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
  padding-left: max(clamp(20px, 3vw, 64px), env(safe-area-inset-left, 0px));
  padding-right: max(clamp(20px, 3vw, 64px), env(safe-area-inset-right, 0px));
}
.film-fullscreen-top { padding-top: max(16px, env(safe-area-inset-top, 0px)); }
.network-form .network-consent { min-height: 44px; padding-block: 6px; }

@media (max-width: 1000px), (pointer: coarse), (horizontal-viewport-segments: 2) {
  .network-form input:not([type="checkbox"]), .network-form select, .network-form textarea,
  .network-review-filters input, .network-review-filters select,
  .network-review-card select, .network-review-card textarea,
  .contact-intake input:not([type="checkbox"]), .contact-intake select, .contact-intake textarea { font-size: 16px; }
}
@media (pointer: coarse) { .film-audio label { display: none; } }
@media (max-width: 720px), (horizontal-viewport-segments: 2) {
  .site-header { padding-top: max(18px, env(safe-area-inset-top, 0px)); }
}

/* Match desktop logo proportions within the narrower gallery artwork. */
@media (max-width: 640px), (horizontal-viewport-segments: 2) {
  .work-tile .work-badge { width: 52px; min-height: 24px; }
  .work-tile .work-badge img { max-width: 52px; max-height: 24px; }
  .work-tile .work-badge img:is(.work-project-logo--osamason, .work-project-logo--spaceship, .work-project-logo--lyrical) { max-height: 34px; }
  .work-tile .work-badge img.work-project-logo--jim { max-width: 24px; max-height: 28px; }
  .work-tile.work-collection .work-badge { min-height: 16px; }
  .work-tile.work-collection .work-badge img { max-height: 16px; }
}

/* On browsers that report a physical hinge, use the first uninterrupted pane.
   Pixel/Galaxy unfolded displays without a hinge continue to use the full grid. */
@media (horizontal-viewport-segments: 2) {
  :root {
    --page-width: env(viewport-segment-width 0 0, 100vw);
    --gutter: max(20px, calc(var(--page-width) * .042), env(safe-area-inset-left, 0px));
  }
  body { width: var(--page-width); }
  .screening-room, .home-arrival { width: var(--page-width); right: auto; }
  .has-film-controls:fullscreen { width: var(--page-width); }
  .has-film-controls:fullscreen > video, .has-film-controls:fullscreen > img {
    width: min(var(--page-width), calc(100dvh * var(--film-aspect, 1.777778)));
    height: min(100dvh, calc(var(--page-width) / var(--film-aspect, 1.777778)));
  }
}