.art-study{overflow:hidden;isolation:isolate;--art-time:2s}
.art-study .identity-frame{z-index:2}
.opening-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:0}
.art-study .identity-frame:before,.art-study .identity-frame:after{animation:art-corners var(--art-time) both}
.art-study .refined-role{animation:art-role var(--art-time) both}
.art-study .refined-story{animation:art-story var(--art-time) both}
.art-study[data-motion="etched"]{--art-time:2.05s}
.art-study[data-motion="etched"] h1{animation:engraved-focus var(--art-time) both}
.art-study[data-motion="etched"] .opening-art{animation:etched-turn var(--art-time) both}
.etched-rings path{stroke-dasharray:1;animation:ink-draw var(--art-time) both}
.lens-marks{transform-origin:600px 180px;animation:marks-turn var(--art-time) both}
.art-study[data-motion="tidal"]{--art-time:2.15s}
.art-study[data-motion="tidal"] h1{animation:tide-name var(--art-time) both}
.art-study[data-motion="tidal"] .opening-art{animation:ink-wash var(--art-time) both}
.ink-waves{animation:ink-flow var(--art-time) both}
.tide-focus{transform-origin:600px 180px;animation:marks-turn var(--art-time) both}
.art-study[data-motion="branches"]{--art-time:2.2s}
.art-study[data-motion="branches"] h1{animation:wood-name var(--art-time) both}
.art-study[data-motion="branches"] .opening-art{animation:wood-fade var(--art-time) both}
.ink-branches path{stroke-dasharray:1;animation:branch-grow var(--art-time) both}
.art-study[data-motion="overprint"]{--art-time:1.8s}
.art-study[data-motion="overprint"] h1{animation:ink-register var(--art-time) both}
.art-study[data-motion="overprint"] .opening-art{animation:print-fade var(--art-time) both}
.print-blocks{animation:print-align var(--art-time) both}
.art-study[data-motion="eclipse"]{--art-time:2.2s}
.art-study[data-motion="eclipse"] h1{animation:iris-name var(--art-time) both}
.art-study[data-motion="eclipse"] .opening-art{animation:eclipse-open var(--art-time) both}
.eclipse-disc{transform-origin:600px 180px;animation:eclipse-spin var(--art-time) both}
@keyframes art-corners{0%,15%{opacity:0;transform:scale(.8)}70%,100%{opacity:1;transform:scale(1)}}
@keyframes art-role{0%,22%{opacity:0;transform:translateY(4px)}70%,100%{opacity:1;transform:translateY(0)}}
@keyframes art-story{0%,48%{opacity:0;transform:translateY(4px)}87%,100%{opacity:1;transform:translateY(0)}}
@keyframes engraved-focus{0%{opacity:0;filter:blur(3px);transform:scale(1.025)}30%{opacity:.8;filter:blur(1px)}65%,100%{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes etched-turn{0%{opacity:0;transform:rotate(-8deg) scale(.96)}22%,43%{opacity:.6}100%{opacity:0;transform:rotate(4deg) scale(1.015)}}
@keyframes ink-draw{0%{stroke-dashoffset:1}65%,100%{stroke-dashoffset:0}}
@keyframes marks-turn{from{transform:rotate(-22deg)}to{transform:rotate(8deg)}}
@keyframes tide-name{0%{opacity:0;filter:blur(2px);transform:translateY(7px)}65%,100%{opacity:1;filter:blur(0);transform:translateY(0)}}
@keyframes ink-wash{0%{opacity:0}22%,48%{opacity:.65}100%{opacity:0}}
@keyframes ink-flow{from{transform:translate(-26px,12px)}to{transform:translate(24px,-9px)}}
@keyframes wood-name{0%,12%{opacity:0;clip-path:inset(0 0 100% 0)}60%,100%{opacity:1;clip-path:inset(0)}}
@keyframes wood-fade{0%{opacity:0}20%,58%{opacity:.8}100%{opacity:0}}
@keyframes branch-grow{0%{stroke-dashoffset:1}58%,100%{stroke-dashoffset:0}}
@keyframes ink-register{0%{opacity:0;color:#c9bfa7;text-shadow:7px 2px #af695e,-6px -2px #56877d;transform:translateY(2px)}22%,38%{opacity:.85;text-shadow:3px 1px #af695e,-3px -1px #56877d}70%,100%{opacity:1;color:var(--ink);text-shadow:0 0 transparent,0 0 transparent;transform:translateY(0)}}
@keyframes print-fade{0%{opacity:0}22%,48%{opacity:.75}100%{opacity:0}}
@keyframes print-align{from{transform:translate(-12px,5px)}to{transform:translate(0)}}
@keyframes iris-name{0%,12%{opacity:0;clip-path:ellipse(0% 70% at 50% 50%);filter:blur(2px)}58%,100%{opacity:1;clip-path:ellipse(80% 120% at 50% 50%);filter:blur(0)}}
@keyframes eclipse-open{0%{opacity:0;transform:scale(.8)}25%,43%{opacity:.55}100%{opacity:0;transform:scale(1.6)}}
@keyframes eclipse-spin{from{transform:rotate(-18deg)}to{transform:rotate(13deg)}}
/* Explicit slow playback is for comparing studies, never a site default. */
.motion-demo.motion-slow *,.motion-demo.motion-slow *:before,.motion-demo.motion-slow *:after{animation-duration:5s!important}
.motion-demo.motion-still *,.motion-demo.motion-still *:before,.motion-demo.motion-still *:after{animation-duration:2s!important;animation-delay:-1s!important;animation-play-state:paused!important}
@media(max-width:600px){.art-study .opening-art{width:160%;max-width:none;left:-30%;right:auto}.art-study[data-motion="branches"] .opening-art{width:100%;left:0}.art-study[data-motion="branches"] .opening-art{opacity:0}.art-study[data-motion="overprint"] .opening-art{width:100%;left:0}}
@media(prefers-reduced-motion:reduce){.art-study *,.art-study *:before,.art-study *:after{animation:none!important;transition:none!important}.opening-art{display:none}}