.intro{display:none}html[data-intro=on] .intro:not([hidden]){z-index:1;pointer-events:none;animation:3.2s linear both intro-layer;display:block;position:absolute;inset:0}html[data-intro=on] .intro:not([hidden]):before{content:"";background:var(--color-bg);animation:3.2s ease-out both intro-veil;position:absolute;inset:0}.intro-skip{right:var(--space-4);top:calc(var(--header-h) + var(--space-3));pointer-events:auto;color:var(--color-onMedia);background:#0b10188c;position:absolute}@media (min-width:48em){.intro-skip{top:auto;right:var(--space-6);bottom:var(--space-6)}}.hero h1[tabindex="-1"]:focus:not(:focus-visible){outline:none}html[data-intro=on] .hero-map-frame{transform-origin:var(--cape-x) var(--cape-y);animation:3.2s cubic-bezier(.3,0,.15,1) both intro-zoom}html[data-intro=on] .hero-place{animation:3.2s ease-out both intro-place}@keyframes intro-layer{0%,88%{opacity:1;visibility:visible}to{opacity:0;visibility:hidden}}@keyframes intro-veil{0%{opacity:1}30%{opacity:.2}to{opacity:0}}@keyframes intro-zoom{0%{transform:scale(3.2)}to{transform:scale(1)}}@keyframes intro-place{0%,70%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.intro{display:none!important}html[data-intro=on] .hero-map-frame,html[data-intro=on] .hero-place{animation:none}}