@property --dlb-opacity{syntax:"<number>";inherits:true;initial-value:1}@layer dialog-lightbox{html:has(dialog[data-dlb][open]){overflow:hidden}dialog[data-dlb]{overscroll-behavior:contain;border:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;inset:0}[data-dlb-viewport]{position:absolute;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;inset:0}[data-dlb-viewport]:focus{outline:none}[data-dlb-slide]{position:absolute;inset:0}}:root{--buncss-light:initial;--buncss-dark: ;color-scheme:light dark;--page:#f6f3ee;--text:#1d1b19;--film:#171513;--print:#e9dfc8;font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}@media (prefers-color-scheme:dark){:root{--buncss-light: ;--buncss-dark:initial;--page:#141312;--text:#ece7df}}body{background:var(--page);color:var(--text);margin:0}main{max-width:60rem;margin:0 auto;padding:2rem 1rem 4rem}.film{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:radial-gradient(circle,var(--page)3px,transparent 3.5px)0 4px/14px 14px repeat-x,radial-gradient(circle,var(--page)3px,transparent 3.5px)0 calc(100% - 4px)/14px 14px repeat-x,var(--film);padding:22px 0}.frames{display:flex;list-style:none;gap:8px;margin:0;padding:0 8px}.frames li{scroll-snap-align:start;flex:none}.frames figure{margin:0}.frames a{position:relative;display:block}.frames img{display:block;aspect-ratio:3/2;object-fit:cover;width:15rem}.frames a[data-dlb-type=video]:after{content:"▶";position:absolute;color:#fff;text-shadow:0 1px 4px #000000b3;font-size:2rem;inset:50% auto auto 50%;translate:-50% -50%}.frames figcaption{color:var(--print);letter-spacing:.08em;text-transform:uppercase;padding-top:4px;font:11px/1.6 ui-monospace,monospace}dialog[data-dlb]{color:#fff;background:0 0}dialog[data-dlb]::backdrop{background:rgb(12 11 10/var(--dlb-opacity))}[data-dlb-viewport]{padding:3.5rem 0 6rem}@media (min-width:48rem){[data-dlb-viewport]{padding-inline-start:4.5rem;padding-inline-end:4.5rem}}.box-bar{position:absolute;display:flex;padding:.5rem max(1rem,env(safe-area-inset-left));align-items: center;gap:.5rem;transition:opacity .2s;left:0;right:0}.box-top{top:0}.box-top [data-dlb-counter]{font-variant-numeric:tabular-nums;margin-inline-end:auto}.box-bottom{padding-bottom:max(.75rem,env(safe-area-inset-bottom));flex-direction:column;bottom:0}dialog button{display:grid;color:#fff;cursor:pointer;background:#ffffff1f;border:0;border-radius:50%;place-items: center;width:2.5rem;height:2.5rem;padding:0}dialog button:hover:not(:disabled){background:#ffffff40}dialog button:disabled{opacity:.3;cursor:default}dialog svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;width:1.25rem;height:1.25rem}.box-side{position:absolute;top:50%;translate:0 -50%}[data-dlb-prev]{left:1rem}[data-dlb-next]{right:1rem}.caption{text-align:center;text-shadow:0 1px 3px #000c;margin:0;font-size:.9rem}.video-bar{display:flex;align-items: center;gap:.75rem;width:min(30rem,100%)}dialog:not([data-dlb-type=video]) .video-bar{display:none}[data-dlb-progress]{background:linear-gradient(#fff,#fff)left/calc(var(--dlb-progress,0)*100%)100% no-repeat,#ffffff40;border-radius:2px;flex:1;height:3px}dialog[data-dlb-paused] .icon-pause,dialog:not([data-dlb-paused]) .icon-play,dialog[data-dlb-muted] .icon-sound,dialog:not([data-dlb-muted]) .icon-muted{display:none}dialog[data-dlb-ui-hidden] .box-bar,dialog[data-dlb-ui-hidden] .box-side{opacity:0;pointer-events:none}dialog[data-dlb-zoomable] [data-dlb-current] img{cursor:zoom-in}dialog[data-dlb-zoomed] [data-dlb-current] img{cursor:zoom-out}dialog[data-dlb-error] .caption:before{content:"This photo could not be loaded. "}dialog[data-dlb-loading]:after{content:"";position:absolute;opacity:0;animation:.8s linear infinite spin,0s .4s both appear;border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:2rem;height:2rem;margin:-1rem;inset:50% auto auto 50%}@keyframes spin{to{rotate:1turn}}@keyframes appear{to{opacity:1}}@media (pointer:coarse){.box-side{display:none}[data-dlb-close]{position:absolute;overflow:hidden;clip-path:inset(50%);white-space:nowrap;width:1px;height:1px}}
