/* Desktop only. Mobile production and preview are deliberately untouched. */
.ProjectContext,.ProjectContext-toggle,.ProjectInfo { display:none; }
@media (min-width:880px) and (hover:hover) and (pointer:fine) {
  .has-corner-context .Project:focus-visible { outline:none; }
  .has-corner-context .Project:focus-visible::after { content:""; position:absolute; left:-.7rem; top:calc(50% - 2px); width:4px; height:4px; border-radius:50%; background:currentColor; }
  .has-project-context .Project-detail { display:none; }
  .has-project-context .Portfolio-shade { background:linear-gradient(90deg,rgba(0,0,0,.12),transparent 50%,rgba(0,0,0,.38)),linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.08) 48%,transparent); }
  .ProjectContext:not([hidden]) { display:block; position:absolute; z-index:2; left:32px; bottom:30px; width:min(44vw,600px); max-height:calc(100svh - 110px); overflow:auto; overscroll-behavior:contain; color:#fff; font:clamp(18px,1.55vw,22px)/1.55 'Courier New',monospace; }
  .ProjectContext-summary { margin:0; letter-spacing:0; text-wrap:pretty; }
  .ProjectContext-actions { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:22px; }
  .ProjectContext-play { display:inline-flex; align-items:center; gap:12px; min-height:48px; border:0; padding:10px 0; background:none; color:#fff; font:18px/1.3 'Courier New',monospace; letter-spacing:.025em; cursor:pointer; }
  .ProjectContext-play span { font:15px/1 Arial,sans-serif; }
  .ProjectContext-play:hover { opacity:.75; }
  .ProjectContext-toggle:not([hidden]) { display:block; flex:0 0 48px; width:48px; height:48px; padding:0; border:0; color:#fff; background:none; font:36px/1 Arial,sans-serif; cursor:pointer; }
  .ProjectContext-toggle:hover { opacity:.75; }
  .ProjectInfo:not([hidden]) { display:flex; position:fixed; inset:0; z-index:8; align-items:center; justify-content:center; padding:28px; background:rgba(0,0,0,.12); }
  .ProjectInfo-card { display:flex; flex-direction:column; width:min(100%,640px); max-height:calc(100svh - 56px); padding:24px 32px; border:1px solid rgba(255,255,255,.16); background:rgba(16,16,16,.84); color:#fff; font:clamp(18px,1.4vw,20px)/1.55 'Courier New',monospace; }
  .ProjectInfo-header { display:flex; align-items:center; justify-content:space-between; gap:24px; flex-shrink:0; }
  .ProjectInfo-header h2 { margin:0; font:16px/1.5 'Courier New',monospace; text-transform:uppercase; letter-spacing:.025em; }
  .ProjectInfo-header button { flex-shrink:0; min-height:44px; min-width:44px; border:0; padding:10px 0; color:inherit; background:none; font:15px/1.3 'Courier New',monospace; cursor:pointer; }
  .ProjectInfo-copy { overflow:auto; overscroll-behavior:contain; min-height:0; padding:8px 0; }
  .ProjectInfo-copy p { margin:0 0 16px; }
  .ProjectInfo-copy p:last-child { margin-bottom:0; }
  .ProjectContext button:focus-visible,.ProjectContext-toggle:focus-visible,.ProjectInfo button:focus-visible,.ProjectInfo-copy:focus-visible { outline:1px solid #fff; outline-offset:4px; }
  .is-project-info-open .ProjectContext,.is-project-info-open .ProjectContext-toggle,.is-project-info-open .ProjectIndex { opacity:0; pointer-events:none; }
  .is-film-open .ProjectContext,.is-film-open .ProjectContext-toggle { opacity:0; visibility:hidden; pointer-events:none; }
  .SiteHeader { font:18px/1.3 'Courier New',monospace; letter-spacing:.025em; padding:12px 24px; }
  .SiteHeader a { display:inline-flex; align-items:center; min-height:44px; }
  .SiteHeader-name { font-weight:400; }
}