.grid-section .grid { cursor: zoom-in; }
.grid-section .grid:focus-visible { outline: 1px solid #111; outline-offset: 6px; }
.bit-viewer { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; box-sizing: border-box; border: 0; margin: 0; padding: 48px 16px 20px; background: #fff; color: #111; }
.bit-viewer[open] { display: grid; place-items: center; }
.bit-viewer::backdrop { background: #fff; }
.bit-viewer button { display: block; border: 0; padding: 0; margin: 0; border-radius: 0; box-shadow: none; background: transparent; color: inherit; }
.bit-viewer [hidden] { display: none !important; }
.bit-viewer .bit-close { position: absolute; z-index: 2; right: 12px; top: 4px; width: 44px; height: 44px; font: 32px/1 serif; cursor: pointer; }
.bit-nine { display: grid; direction: rtl; grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(3,minmax(0,1fr)); gap: 6px; width: min(calc(100vw - 32px),calc(100dvh - 68px)); aspect-ratio: 1; }
.bit-nine button { min-width: 0; min-height: 0; cursor: zoom-in; }
.bit-nine img { display: block; width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; }
.bit-viewer .bit-single { width: 100%; height: 100%; min-height: 0; cursor: zoom-out; }
.bit-single img { display: block; width: 100%; height: 100%; max-height: calc(100dvh - 68px); object-fit: contain; image-rendering: pixelated; }
.bit-viewer button:focus-visible { outline: 1px solid #777; outline-offset: 2px; }