/* Mobile layout and interaction rules shared by the portfolio and its viewers. */
.project-portfolio a,
.project-portfolio button,
.project-portfolio summary { -webkit-tap-highlight-color: rgba(var(--space-rgb,135,80,240),.2); touch-action: manipulation; }
.project-portfolio .project-title h3,
.project-portfolio .case-heading h2,
.project-portfolio .case-bottom > span { overflow-wrap: anywhere; min-width: 0; }
.project-portfolio .site-header nav a,
.project-portfolio .elsewhere,
.project-portfolio .wordmark,
.project-portfolio .text-link,
.project-portfolio .footer-bottom a { min-height: 44px; display: inline-flex; align-items: center; }
.project-portfolio .text-link:hover { color: var(--accent); }
.project-portfolio .case-nav button,
.project-portfolio .case-bottom button,
.project-portfolio .filters button,
.project-portfolio .dialog-close,
.project-portfolio .photo-prev,
.project-portfolio .photo-next { min-width: 44px; min-height: 44px; }
/* Bound dialogs to the viewport even when the browser resizes an open modal. */
.cosmos-theme .project-portfolio .project-dialog,
.project-portfolio .project-dialog,
.project-portfolio .photo-dialog {
  inset: 0; width: 100vw; width: 100dvw; max-width: 100vw;
  height: 100%; height: 100dvh; max-height: 100dvh;
  margin: 0; overscroll-behavior: contain;
}
.project-portfolio .project-dialog { overflow-x: hidden; }
.project-portfolio #project-detail { width: 100%; min-width: 0; }
.project-portfolio .project-dialog > .dialog-close,
.project-portfolio .photo-dialog > .dialog-close {
  position: fixed; top: max(12px,env(safe-area-inset-top));
  right: max(16px,env(safe-area-inset-right)); width: 44px; height: 44px;
  box-shadow: 0 2px 12px #0004; z-index: 10;
}
.project-portfolio .case-nav { min-height: 52px; font-size: 12px; padding-right: 60px; gap: 12px; }
.project-portfolio .case-nav > div { flex-shrink: 0; }
.project-portfolio .case-nav button { font-size: 18px; }
.project-portfolio .detail-links .text-link { font: 400 14px/1.5 'DM Sans',sans-serif; text-transform: none; letter-spacing: 0; gap: 14px; }
.project-portfolio .detail-links .project-primary-link { padding: 12px 18px; background: var(--accent); color: var(--paper); border: 1px solid var(--accent); border-radius: 6px; }
.project-portfolio .detail-links .project-primary-link:hover { filter: brightness(1.12); }
.project-portfolio .case-screens figcaption { font-size: 12px; }
.project-portfolio .case-bottom { gap: 16px; font-size: 12px; }
.project-portfolio .case-bottom button { font-size: 13px; flex-shrink: 0; }
.project-portfolio .photo-dialog figure { padding-top: max(72px,calc(env(safe-area-inset-top) + 60px)); padding-bottom: max(30px,env(safe-area-inset-bottom)); }
.project-portfolio .photo-dialog figcaption { overflow-wrap: anywhere; }
.project-portfolio .photo-dialog figcaption > div { min-width: 0; }
@media (max-width: 760px) {
  .cosmos-theme .project-portfolio .site-header { flex-wrap: wrap; gap: 0 16px; padding: max(12px,env(safe-area-inset-top)) 6% 10px; }
  .project-portfolio .site-header .wordmark { font-size: 16px; }
  .project-portfolio .site-header .surname { display: inline; }
  .project-portfolio .site-header .elsewhere { display: inline-flex; margin-left: auto; font-size: 12px; }
  .cosmos-theme .project-portfolio .site-header nav { order: 3; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 0 12px; font-size: 13px; }
  .project-portfolio .site-header nav a { padding: 0 2px; }
  .cosmos-theme .project-portfolio .portfolio-intro h1 { font-size: clamp(30px,8.5vw,48px); max-width: 100%; }
  .project-portfolio .portfolio-intro .orbital-system { opacity: .25; }
  .project-portfolio #intro { font-size: 15px; max-width: 34ch; }
  .project-portfolio .portfolio-intro .eyebrow { font-size: 10px; }
  .project-portfolio .work-heading { align-items: flex-start; flex-direction: column; gap: 6px; }
  .cosmos-theme .project-portfolio .work-heading h2 { font-size: 15px; }
  .project-portfolio .work-heading > .eyebrow { font-size: 10px; max-width: none; text-align: left; }
  .cosmos-theme .project-portfolio .project-category { font-size: 11px; }
  .project-portfolio .project-number { font-size: 10px; }
  .cosmos-theme .project-portfolio .project-dialog { padding: max(72px,calc(env(safe-area-inset-top) + 60px)) max(20px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); }
  .project-portfolio .case-nav { padding: 0 0 12px; flex-wrap: wrap; }
  .project-portfolio .case-heading { padding: 28px 0; }
  .project-portfolio .case-heading .detail-category { font-size: 12px; }
  .cosmos-theme .project-portfolio .project-dialog h2 { font-size: clamp(34px,10vw,65px); }
  .project-portfolio .detail-description,
  .project-portfolio .case-notes p { font-size: 16px; line-height: 1.7; }
  .project-portfolio .detail-links { gap: 12px; margin-top: 20px; }
  .project-portfolio .detail-links .text-link { justify-content: center; flex: 1 1 160px; }
  .project-portfolio .case-screens { padding: 16px; }
  .project-portfolio .case-bottom { flex-wrap: wrap; }
  .project-portfolio .section-top .eyebrow { font-size: 10px; letter-spacing: 1px; }
  .cosmos-theme .project-portfolio .section-heading p { font-size: 14px; }
  .project-portfolio .filters button { font-size: 13px; }
  .project-portfolio .gallery-toolbar { flex-wrap: wrap; }
  .project-portfolio .about-links { flex-wrap: wrap; }
  .project-portfolio .stats { flex-wrap: wrap; gap: 20px; }
  .project-portfolio .activity summary { min-height: 44px; }
  .project-portfolio .activity summary span { font-size: 12px; }
  .project-portfolio .footer-bottom { flex-wrap: wrap; align-items: center; font-size: 12px; gap: 8px 20px; }
  .project-portfolio .photo-dialog figure { padding-left: 20px; padding-right: 20px; padding-bottom: max(80px,calc(env(safe-area-inset-bottom) + 68px)); }
  .project-portfolio .photo-prev,
  .project-portfolio .photo-next { top: auto; bottom: max(16px,env(safe-area-inset-bottom)); }
}
@media (max-width: 360px) {
  .project-portfolio .site-header .surname { display: none; }
  .project-portfolio .case-nav { font-size: 11px; }
}
.project-portfolio .case-heading h2:focus { outline: none; }
/* Keep the off-edge decorative photography orbit inside its own section. */
.project-portfolio .photography-section { overflow: clip; }

/* Conceal photos immediately when the viewer leaves the page or window. */
.photos-private #photo-gallery .photo-button { background: #000; }
.photos-private #photo-gallery .photo-button img { visibility: hidden; transition: none; }
.photos-private #photo-gallery .photo-button::after { visibility: hidden; }
.photos-private #photo-dialog { background: #000; }
.photos-private #photo-dialog > * { visibility: hidden; }
@media print {
  #photography, #photo-dialog { display: none !important; }
}
/* Filing Tracker capture shield, including the modal viewer's top layer. */
.capture-shield{display:none}
html.capture-shield-shortcut .capture-shield,html.capture-shield-blur .capture-shield{display:flex!important;visibility:visible!important;position:fixed;inset:0;width:100vw;height:100dvh;z-index:2147483647;background:#000;color:#ddd;align-items:center;justify-content:center;pointer-events:auto;cursor:pointer}
.capture-shield-inner{display:flex;align-items:center;flex-direction:column;gap:18px;padding:24px;text-align:center;font:14px/1.5 -apple-system,BlinkMacSystemFont,sans-serif}
html.capture-shield-shortcut .photo-button img,html.capture-shield-blur .photo-button img,html.capture-shield-shortcut #lightbox-image,html.capture-shield-blur #lightbox-image{visibility:hidden!important;transition:none!important}