:root{--bg:#ececec;--fg:#1b1b1b;--mute:#6d6d6d;--line:#cdcdcd;color-scheme:light dark}
@media(prefers-color-scheme:dark){:root{--bg:#1c1c1c;--fg:#e8e8e8;--mute:#8f8f8f;--line:#343434}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 system-ui,sans-serif}
header,main{max-width:1400px;margin:auto;padding:0 24px}
header{padding-top:48px;padding-bottom:28px;display:flex;justify-content:space-between;align-items:baseline;gap:16px}
main{padding-bottom:64px}
h1{margin:0;font:400 clamp(30px,4.5vw,48px)/1.1 'Newsreader',Georgia,serif;letter-spacing:-.01em}
body.embed header{display:none}
body.embed main{padding-top:8px}
.grid{columns:3 300px;column-gap:14px}
.grid figure{margin:0 0 14px;break-inside:avoid;cursor:zoom-in;position:relative}
.grid img{display:block;width:100%;height:auto;background:var(--line)}
.empty,#status{color:var(--mute)}
button{font:inherit;color:var(--fg);background:none;border:1px solid var(--fg);padding:8px 16px;cursor:pointer}
button:hover:not(:disabled){background:var(--fg);color:var(--bg)}
button:disabled{opacity:.35;cursor:default}
button.quiet{border-color:var(--line)}
:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
input[type=password]{font:inherit;padding:8px 10px;border:1px solid var(--line);background:transparent;color:var(--fg);margin:0 10px}
.err{color:#b3261e}
.drop{display:block;border:1px dashed var(--mute);padding:40px 16px;text-align:center;color:var(--mute);cursor:pointer;margin-bottom:12px}
.drop.over{border-color:var(--fg);color:var(--fg)}
.admin figure{cursor:pointer}
.admin figure.sel{outline:3px solid var(--fg);outline-offset:-3px}
.admin figure.sel::after{content:'✓';position:absolute;top:8px;left:8px;width:26px;height:26px;display:grid;place-items:center;background:var(--fg);color:var(--bg)}
dialog{border:0;padding:0;background:transparent;width:100vw;height:100vh;max-width:100vw;max-height:100vh}
dialog::backdrop{background:rgba(10,10,10,.94)}
dialog img{position:absolute;inset:0;margin:auto;max-width:94vw;max-height:92vh}
dialog button{position:absolute;color:#eee;border:0;font-size:34px;padding:8px 18px}
dialog button:hover:not(:disabled){background:none;color:#fff}
#prev{left:0;top:45%}#next{right:0;top:45%}#close{right:0;top:0}