/* Approved minimalist intro: the same layout and 3.6 s timing as the study. */
html.intro #l22intro{
  position:fixed;inset:0;z-index:120;display:grid;place-items:center;
  padding:30px;background:#171716;color:#f4f2ed;overflow:hidden;
  isolation:isolate;opacity:1;will-change:opacity;
}
.l22-intro-copy{
  display:flex;align-items:baseline;gap:.25em;margin:0;
  font:500 clamp(24px,2.35vw,32px)/1.25 'ArchivoL22',sans-serif;
  font-variation-settings:'wdth' 100,'wght' 500;
  letter-spacing:-.02em;white-space:nowrap;
}
.l22-intro-mask{overflow:clip;padding:.15em 0;margin:-.15em 0}
.l22-intro-word{display:inline-block;opacity:0;transform:translateY(10px);will-change:opacity,transform}
.l22-intro-amp{font-family:'InstrumentL22',sans-serif;font-variation-settings:'wght' 500;letter-spacing:0}
.l22-intro-skip{
  position:absolute;right:clamp(24px,4.5vw,80px);bottom:22px;
  min-height:44px;padding:10px 0;border:0;border-radius:0;background:none;
  font:400 12px/1.4 'InstrumentL22',sans-serif;color:#aaa;cursor:pointer;
}
.l22-intro-skip:hover{color:#f4f2ed}
.l22-intro-skip:focus-visible{outline:2px solid currentColor;outline-offset:5px}
@media(max-width:700px){
  html.intro #l22intro{padding:18px}
  .l22-intro-copy{font-size:clamp(18px,5.12vw,24px)}
  .l22-intro-skip{right:22px;bottom:max(14px,env(safe-area-inset-bottom))}
}
@media(max-height:500px) and (min-width:701px){.l22-intro-copy{font-size:28px}}
@media(prefers-reduced-motion:reduce){
  html.intro #l22intro,html.intro::before{display:none}
  html.intro{overflow:visible}
}
