/* Side film strips that roll with scroll, drawn like a classic film icon:
   solid body with square sprocket holes and rounded frames cut out (SVG mask),
   so the page background shows through every opening. */
.film-strip{position:fixed;top:0;bottom:0;width:var(--fw,112px);z-index:3;pointer-events:none;
  background:var(--film-tint,rgba(255,255,255,.032));
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='60'%3E%3Cpath fill-rule='evenodd' d='M0 0H112V60H0Z M12 8h14v14h-14z M12 38h14v14h-14z M86 8h14v14h-14z M86 38h14v14h-14z M41 5h30a5 5 0 0 1 5 5v40a5 5 0 0 1-5 5h-30a5 5 0 0 1-5-5v-40a5 5 0 0 1 5-5z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='60'%3E%3Cpath fill-rule='evenodd' d='M0 0H112V60H0Z M12 8h14v14h-14z M12 38h14v14h-14z M86 8h14v14h-14z M86 38h14v14h-14z M41 5h30a5 5 0 0 1 5 5v40a5 5 0 0 1-5 5h-30a5 5 0 0 1-5-5v-40a5 5 0 0 1 5-5z'/%3E%3C/svg%3E");
  -webkit-mask-size:100% auto;mask-size:100% auto;-webkit-mask-repeat:repeat-y;mask-repeat:repeat-y;
  -webkit-mask-position:0 var(--off,0px);mask-position:0 var(--off,0px)}
.film-strip.l{left:0}.film-strip.r{right:0}
.film-reel,.film-strip .edge,.film-strip .code{display:none}
body.has-film .film-pad{padding-inline:var(--fw,112px)}
@media(max-width:1100px){.film-strip{width:64px}body.has-film .film-pad{padding-inline:64px}}
@media(max-width:760px){.film-strip{width:28px}.film-strip.r{display:none}body.has-film .film-pad{padding-inline:0}}
@media print{.film-strip{display:none}}