/* V39 — cinematic gallery art direction. Visual only: preserve all media geometry, imagery and playback. */
:root{--jr39-hairline:rgba(247,227,202,.085);--jr39-amber:rgba(231,154,75,.68)}
/* Frames should have the depth of a screening room, not heavy decoration. */
#gallery .card{
  background:#141312;
  border-color:rgba(234,218,198,.115);
  box-shadow:0 15px 42px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.018);
  transition:border-color .36s ease,box-shadow .48s cubic-bezier(.22,1,.36,1);
}
/* The art direction sits *inside* the original thumbnail shell, never changes its box. */
#gallery .card .thumb-shell{isolation:isolate;}
#gallery .card .thumb-shell::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,7,6,.10),transparent 23%,transparent 72%,rgba(8,7,6,.20)),
    linear-gradient(90deg,rgba(11,9,7,.10),transparent 14%,transparent 86%,rgba(11,9,7,.10));
  box-shadow:inset 0 0 0 1px rgba(252,235,210,.085),inset 0 0 0 9px rgba(10,10,10,.015);
  transition:box-shadow .45s ease,background .45s ease;
}
@media (hover:hover) and (pointer:fine){
  #gallery .card:hover{border-color:rgba(233,158,75,.34);box-shadow:0 25px 68px rgba(0,0,0,.29),0 0 0 1px rgba(235,157,73,.035);}
  #gallery .card:hover .thumb-shell::before{
    box-shadow:inset 0 0 0 1px rgba(255,215,159,.20),inset 0 0 0 9px rgba(10,10,10,.018);
  }
}
/* Metadata resembles a film credit: quieter category, stronger title, restrained numbering. */
#gallery .card .meta{
  background:linear-gradient(135deg,#1b1917 0%,#171615 78%);
  border-top:1px solid var(--jr39-hairline);
  position:relative;
}
#gallery .card .meta h3{color:#f5f0ea;font-weight:700;letter-spacing:-.024em;text-wrap:pretty;}
#gallery .card .meta p{color:#a99f94;font-weight:550;letter-spacing:.125em;}
#gallery .card .meta .jr-v25-project-number{color:#dda164;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:.12em;}
/* The pre-existing left orange hover line is the only prominent accent. */
#gallery .card::before{width:2px;background:linear-gradient(180deg,transparent 5%,rgba(226,139,50,.88) 50%,transparent 95%);}
@media (max-width:650px){
 #gallery .card .thumb-shell::before{box-shadow:inset 0 0 0 1px rgba(252,235,210,.065);}
 #gallery .card .meta h3{letter-spacing:-.015em;}
 #gallery .card .meta p{letter-spacing:.095em;}
}
@media (prefers-reduced-motion:reduce){#gallery .card,#gallery .card .thumb-shell::before{transition:none;}}