:root{background:#f8f9f7;color:#627173}
.painting{background:#f8f9f7;overflow:hidden}
.art-plane{position:absolute;left:50%;top:50%;width:min(100vw,177.683315svh);aspect-ratio:1672/941;translate:-50% -50%;transform-origin:80% 64%;transition:transform 1.3s cubic-bezier(.22,.68,.18,1);-webkit-mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);mask-composite:intersect}
.ink-art{display:block;width:100%;height:100%;object-fit:contain}
#atmosphere{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.painting.is-detail .art-plane{transform:translate(-30%,-14%) scale(3.3)}
.controls{color:#627173;opacity:.75;transition:opacity 1s}
body.is-idle .controls{opacity:0;pointer-events:none}
body.is-idle .controls:focus-within,.controls:hover,.controls:focus-within{opacity:1;pointer-events:auto}
.play-btn{background:#f8f9f733;border-color:#697d813d}
.play-btn:hover{background:#edf2ef88}
#fullscreen-btn,#detail-btn{height:44px;width:32px;place-items:center}
#fullscreen-btn:not([hidden]),#detail-btn{display:grid}
#fullscreen-btn svg,#detail-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
@media(prefers-reduced-motion:reduce){.art-plane,.controls{transition:none}}