:root{color-scheme:light;background:#fafaf9;color:#171717;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;display:grid;place-items:center;padding:32px 24px;overflow-x:hidden}
main{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;height:calc(100svh - 64px);min-height:0}
figure{margin:0;width:min(100%,400px);min-height:0;flex:1 1 auto;display:flex;flex-direction:column;align-items:center}
.image-space{width:100%;min-height:0;flex:1 1 auto;position:relative;display:grid;place-items:center;overflow:hidden}
img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply;animation:plopp .48s cubic-bezier(.2,.9,.35,1.2)}
[hidden]{display:none!important}
figcaption{min-height:15px;flex:0 0 auto;text-align:center;margin-top:12px;font-size:.75rem;line-height:1.25}
a{color:#747470;text-decoration:underline;text-decoration-color:#c7c7c3;text-underline-offset:3px}
a:hover{color:#171717}
button{flex:0 0 auto;border:0;border-radius:7px;background:#171717;color:#fff;font:400 1rem/1.25 Arial,Helvetica,sans-serif;padding:15px 25px;min-height:50px;cursor:pointer;transition:background .18s,transform .18s}
button:hover{background:#333;transform:translateY(-2px)}
button:active{transform:translateY(1px) scale(.98)}
:focus-visible{outline:2px solid #171717;outline-offset:6px}
#message{font-size:.875rem;line-height:1.5;color:#747470;text-align:center;padding:24px}
@keyframes plopp{from{opacity:0;transform:translateY(7px) scale(.93)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-height:500px){body{padding:16px}main{height:calc(100svh - 32px);gap:12px}figcaption{margin-top:8px}}