/* The home page demonstrates the studio. One wordmark, one compact signature. */
.head{position:fixed;background:transparent;pointer-events:none}
html.intro .head{background:var(--paper)}
/* The wordmark stays put under the bar, BELOW the opening (the user, 2026-11-09): the stage is see-through,
   so the header shows behind the thesis, and the card rises and grows over it. Once the card is the whole
   screen the header goes (main.js: .is-covered), so it never shows over the page further down. */
@media(prefers-reduced-motion:no-preference){
  .head{z-index:0}
  .open__stage{background:transparent}
  .head.is-covered{visibility:hidden}
}
.door__media img{display:block;width:100%;height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
html.invert .door__media img{filter:invert(1) hue-rotate(180deg)}
@media(prefers-reduced-motion:reduce){.head{position:absolute}}