:host{display:block;min-width:0;width:100%;color:#e7ded1;font-family:inherit;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
.archive{width:100%;margin:clamp(24px,4vw,48px) 0 0;padding:clamp(16px,4vw,44px);border:1px solid #79644e;border-radius:18px;background:radial-gradient(ellipse at 50% 40%,#56483a 0%,#332c29 48%,#241f20 100%);isolation:isolate}
.archive-heading{text-align:center;margin:0 0 22px}.archive-heading>span{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#c2ab88}.archive-heading h2{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:clamp(24px,3.5vw,38px);line-height:1.2;margin:10px 0 0;color:#e7ded1}
.toolbar{display:grid;grid-template-columns:44px minmax(0,1fr) 44px 44px;gap:clamp(4px,1vw,8px);align-items:center;max-width:600px;margin:0 auto 28px}
button{appearance:none;display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0;aspect-ratio:1;padding:10px;border:1px solid #ab916b;border-radius:50%;background:#6050438f;color:#eee4d4;cursor:pointer;transition:background .2s,border-color .2s;line-height:1;font:inherit}
button:hover{background:#79644e;border-color:#d1ba95}button:disabled{opacity:.35;cursor:default}
button:focus-visible,input:focus-visible{outline:2px solid #e4c898;outline-offset:4px}
button svg{display:block;width:20px;height:20px;min-width:20px;min-height:20px;aspect-ratio:1;flex-shrink:0;pointer-events:none}
.counter{font-size:14px;font-variant-numeric:tabular-nums;text-align:center;color:#e7ded1}
.progress{grid-column:1/-1;width:100%;min-width:0;height:28px;margin:0;accent-color:#b49a68;cursor:pointer;touch-action:pan-y}
.desk{padding:4px 7px 12px;max-width:854px;margin:0 auto}
.stack{position:relative;isolation:isolate;width:100%;box-shadow:0 20px 45px #120f1160}
.stack::before,.stack::after{content:"";position:absolute;inset:0;z-index:-1;background:#c8bca9;border:1px solid #ae9a80;border-radius:1px}
.stack::before{transform:translate(3px,5px)}.stack::after{transform:translate(6px,10px)}
.scan{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;border:0;border-radius:1px;cursor:zoom-in;background:#d3c8b9}
.caption{max-width:680px;margin:24px auto 0;text-align:center;line-height:1.6}.caption h3{font:400 21px/1.4 "Source Serif 4",Georgia,serif;color:#e7ded1;margin:0 0 8px}.caption p{font-size:15px;color:#cfc2b1;margin:0;white-space:pre-line}
[hidden]{display:none}.error{color:#ead4b8;margin:16px 0 0;text-align:center}
.zoom-dialog{position:fixed;inset:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border:1px solid #79644e;background:radial-gradient(ellipse at center,#44392f,#241f20 80%);color:#e7ded1;overflow:hidden;overscroll-behavior:contain}
.zoom-dialog::backdrop{background:#241f20ed}
.zoom-tools{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:flex;gap:10px;z-index:2}
.zoom-stage{position:absolute;inset:72px 12px max(12px,env(safe-area-inset-bottom));overflow:hidden;touch-action:none;user-select:none}
.zoom-scan{position:absolute;left:50%;top:50%;width:auto;height:auto;max-width:none;max-height:none;object-fit:contain;transform-origin:center;user-select:none;touch-action:none;border:0}
@media(prefers-reduced-motion:reduce){button{transition:none}}
