:root{color-scheme:light;--ink:#202823;--paper:#f5f3ec;--muted:#71776c;--green:#314c3d;--line:#dcded2;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}[hidden]{display:none!important}button,input{font:inherit}button{cursor:pointer;border:0;border-radius:6px;padding:12px 18px;background:var(--green);color:white}button:disabled{cursor:wait;opacity:.6}button:focus-visible,input:focus-visible{outline:3px solid #bb853c;outline-offset:3px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.23em;color:var(--muted)}h1{font-family:Georgia,serif;font-weight:400;letter-spacing:-.04em;line-height:1.08}main{max-width:1680px;margin:auto;padding:44px 5vw 0}header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:38px}header h1{font-size:clamp(30px,4vw,56px);margin:20px 0 0}.quiet{background:none;color:var(--muted);font-size:12px}.toolbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--paper);z-index:2;padding:8px 0}.tabs{display:flex;gap:6px}.tabs button{background:none;color:var(--muted);border-radius:0;border-bottom:2px solid transparent}.tabs .active{color:var(--green);border-color:var(--green)}#selected-count{font-size:11px;background:#e3e7dc;padding:3px 7px;border-radius:20px;margin-left:4px}#summary{font-size:12px;color:var(--muted)}.progress-line{display:flex;align-items:center;justify-content:space-between;padding:14px 0;font-size:11px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px 14px}.card{min-width:0;position:relative}.open-photo{background:#e3e2da;border-radius:5px;padding:0;width:100%;display:block;overflow:hidden;aspect-ratio:4/3}.open-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}.open-photo:hover img{transform:scale(1.025)}.card.picked .open-photo{outline:3px solid var(--green);outline-offset:2px}.pick{position:absolute;right:9px;top:9px;border-radius:50%;width:34px;height:34px;padding:0;background:#fffef5ed;color:var(--green);box-shadow:0 1px 6px #0002;font-size:20px}.card.picked .pick{background:var(--green);color:white}.caption{display:flex;align-items:center;justify-content:space-between;padding-top:9px;font-size:10px;color:var(--muted);gap:6px}.caption .filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.caption .number{font-variant-numeric:tabular-nums;flex-shrink:0}.load{display:block;margin:30px auto;background:none;border:1px solid var(--line);color:var(--green);min-width:180px}footer{text-align:center;color:var(--muted);font-family:Georgia,serif;font-style:italic;font-size:15px;padding:40px 0 50px}.login{min-height:100svh;display:grid;place-items:center;padding:30px;background:radial-gradient(ellipse at top right,#e0e4d6,transparent 65%),var(--paper)}.login-card{max-width:430px;width:100%}.login h1{font-size:64px;margin:26px 0}.login p{font-size:14px;line-height:1.8;color:var(--muted)}.login .eyebrow{font-size:10px}form{margin-top:36px}label{font-size:12px;display:block;margin-bottom:10px}input{width:100%;background:#fff9;border:1px solid var(--line);border-radius:6px;padding:14px;margin-bottom:12px}form button{width:100%;display:flex;justify-content:space-between}#login-error{color:#a13f32;min-height:24px}dialog{border:0;padding:0;width:100vw;max-width:100vw;height:100svh;max-height:100svh;background:#161b18;color:white}dialog[open]{display:flex;flex-direction:column}dialog::backdrop{background:#161b18}.viewer-bar,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;gap:16px;flex-shrink:0}.viewer-bar{font-size:12px;color:#c9cec8}.viewer-bar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-bar button,.photo-stage button{background:none;color:white;font-size:24px}.photo-stage{display:flex;flex:1;min-height:0;align-items:center;justify-content:space-between}.photo-stage img{min-width:0;max-width:calc(100% - 112px);max-height:100%;object-fit:contain}.photo-stage button{padding:15px;font-size:40px}.viewer-bottom{padding-bottom:max(20px,env(safe-area-inset-bottom));font-size:12px;color:#c9cec8}.viewer-bottom button{background:#dce6d9;color:#203326;min-width:170px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:90vw;padding:14px 20px;border-radius:8px;background:#823f30;color:white;z-index:10;font-size:13px;box-shadow:0 4px 20px #0003}@media(min-width:1500px){.grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:1000px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:700px){main{padding:24px 16px 0}header{margin-bottom:24px}header h1{font-size:34px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.toolbar{gap:5px}.tabs button{padding:12px 8px;font-size:13px}#summary{font-size:10px}.progress-line{font-size:10px}.progress-line button{padding-right:0}.photo-stage img{max-width:calc(100% - 64px)}.photo-stage button{padding:7px;font-size:30px}.viewer-bar,.viewer-bottom{padding:12px}.login h1{font-size:58px}}

/* Full-screen carousel: each photo gets an isolated loading surface. */
body.viewer-open{overflow:hidden}
.photo-stage{overflow:hidden}
.photo-stage>button{flex:0 0 56px;width:56px;padding:0;align-self:stretch;border-radius:0}
.photo-stage>button:disabled{opacity:.22;cursor:default}
.preview-viewport{position:relative;flex:1;min-width:0;align-self:stretch;overflow:hidden;touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}
.preview-surface{position:absolute;inset:0;will-change:transform}
.photo-stage .preview-image{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;pointer-events:none}
.preview-loading,.preview-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:#becabd;font-size:12px;letter-spacing:.04em;text-align:center;padding:20px}
.preview-spinner{display:block;width:34px;height:34px;border:2px solid #dce6d922;border-top-color:#c7d8c0;border-radius:50%;animation:preview-spin .8s linear infinite}
.preview-error p{margin:0;line-height:1.6}
.photo-stage .preview-error button{font-size:13px;padding:12px 20px;border:1px solid #dce6d944;border-radius:6px}
@keyframes preview-spin{to{transform:rotate(360deg)}}
@media(max-width:700px){.photo-stage>button{flex-basis:32px;width:32px}.preview-loading,.preview-error{font-size:11px}}
@media(prefers-reduced-motion:reduce){.preview-spinner{animation:none}.preview-surface{will-change:auto}}

.viewer-actions{display:flex;align-items:center;gap:10px;min-width:0}
.viewer-actions button{min-width:0;white-space:nowrap}
.viewer-actions #choose{min-width:170px}
.viewer-actions #download{background:transparent;border:1px solid #dce6d955;color:#dce6d9;padding:11px 14px}
.viewer-actions #download:disabled{opacity:.35;cursor:default}
@media(max-width:700px){.viewer-bottom{gap:8px}.viewer-actions{gap:8px}.viewer-actions button{font-size:12px;padding:11px 12px}.viewer-actions #choose{min-width:0}.viewer-actions #download{padding:10px 12px}}
@media(max-width:480px){.viewer-bottom{flex-wrap:wrap}.viewer-bottom #position{width:100%;font-size:11px}.viewer-actions{width:100%}.viewer-actions #choose{flex:1}}
