:root { color-scheme: light; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: #1c130e; font-family: Arial, sans-serif; }
.image-stack { width: 100%; max-width: 2560px; margin: auto; }
.panel { position: relative; width: 100%; line-height: 0; }
.panel img { display: block; width: 100%; height: auto; }
.hit { position: absolute; display: block; z-index: 2; border-radius: 8px; }
.hit:hover { background: rgba(255,255,255,.1); }
.hit:focus-visible { outline: 4px solid #fff; outline-offset: 1px; background: rgba(0,0,0,.18); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip { position: fixed; z-index: 20; top: -100px; left: 8px; padding: 12px; background: #fff; color: #111; }
.skip:focus { top: 8px; }
.semantic-intro { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 700px) {
  .hit { min-height: 12px; }
}