:root{color-scheme:dark;--navy:#182a33;--ivory:#f6f3eb;--red:#cf5b60}*{box-sizing:border-box}body{margin:0;background:var(--navy);color:var(--ivory);font:15px/1.5 Arial,sans-serif;min-height:100svh;display:flex;flex-direction:column}header{display:flex;gap:20px;align-items:center;justify-content:space-between;padding:16px 24px;background:#132229;border-bottom:1px solid #ffffff24}header p{font-size:10px;letter-spacing:2px;margin:10px 0 0}h1{font:26px/1.2 Georgia,serif;margin:5px 0}a{color:inherit;text-underline-offset:4px}nav{display:flex;gap:8px;flex-wrap:wrap;align-items:center}button,select,nav a{font:inherit;color:inherit;background:#ffffff06;border:1px solid #ffffff45;border-radius:5px;min-height:44px;padding:9px 13px;cursor:pointer}nav a{text-decoration:none}button:hover,nav a:hover{background:#ffffff17}button:disabled{opacity:.35;cursor:default}:focus-visible{outline:2px solid #f7cf87;outline-offset:3px}main{flex:1;min-height:0}.stage{height:calc(100svh - 225px);min-height:300px;display:flex;align-items:center;justify-content:center;overflow:auto;padding:18px;position:relative;touch-action:pan-y}.stage img{max-width:100%;max-height:100%;width:auto;height:auto;display:block;box-shadow:0 10px 40px #0005;object-fit:contain}.stage.zoomed{display:block;touch-action:auto}.stage.zoomed img{max-width:none;max-height:none;width:1200px;margin:auto}.turning{animation:turn .24s ease-out}@keyframes turn{from{opacity:.5;transform:perspective(1300px) rotateY(-7deg)}to{opacity:1;transform:none}}#loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#132229;padding:10px 15px;border-radius:4px}footer{padding:12px 24px 16px;background:#132229;border-top:1px solid #ffffff24;text-align:center}.paging{display:flex;gap:12px;align-items:center;justify-content:center}footer p{font-size:12px;margin:8px 0 0;color:#ced5d5}#slider{display:block;max-width:450px;width:80%;margin:14px auto 0;accent-color:var(--red);height:24px}.slider-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}dialog{background:#182a33;color:var(--ivory);border:1px solid #ffffff40;border-radius:8px;width:min(1000px,94vw);max-height:90svh;padding:22px}dialog::backdrop{background:#000b}.dialog-header{display:flex;justify-content:space-between;gap:20px;align-items:center;position:sticky;top:-22px;background:#182a33;padding:8px 0;z-index:1}h2{font:25px Georgia,serif}#thumbnails{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px}#thumbnails button{padding:8px}#thumbnails img{width:100%;display:block;margin-bottom:6px}pre{white-space:pre-wrap;font:16px/1.7 Arial,sans-serif}#error{margin:25px;text-align:center}[hidden]{display:none!important}@media(max-width:700px){header{display:block;padding:12px 16px}h1{font-size:21px}header p{font-size:9px}nav{margin-top:12px;gap:6px}button,select,nav a{font-size:13px;padding:8px 10px}.stage{height:calc(100svh - 320px);min-height:340px;padding:12px 8px}footer{padding:12px}.paging{gap:8px}#count{font-size:13px}#fullscreen{display:none}}@media(prefers-reduced-motion:reduce){.turning{animation:none}}
@media(min-width:701px){.stage{height:calc(100svh - 270px)}}