:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#171b20;color:#eadfc7}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:1440px;margin:auto;padding:28px}header{padding-bottom:18px}.back{float:right}.eyebrow{color:#c5a45d;font-size:12px;letter-spacing:.15em}h1{font-family:Georgia,serif;font-size:clamp(30px,4vw,48px);margin:12px 0}header p,.note,footer{color:#b4bdc6}a{color:#d6c38d}button,.import,.open{font:inherit;padding:9px 16px;border:1px solid #756445;border-radius:7px;background:#272b31;color:#eee4d1;cursor:pointer;text-decoration:none}button:hover,.import:hover,.open:hover{background:#494435}button:disabled{opacity:.5;cursor:not-allowed}button[aria-pressed=true]{background:#c5a45d;color:#191b1e;font-weight:700}a:focus-visible,button:focus-visible,input:focus-visible,.import:focus-within{outline:3px solid #e8c982;outline-offset:3px}.collections{position:sticky;top:0;z-index:5;background:#171b20f5;padding:12px 28px;border-block:1px solid #45443b;display:flex;gap:10px;flex-wrap:wrap}.folders,.views,.tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:12px 0}.controls{border-bottom:1px solid #45443b}.note{font-size:13px;max-width:1050px}.tools input[type=search]{font:inherit;background:#242831;color:inherit;border:1px solid #756445;padding:9px;border-radius:7px}.import{position:relative;overflow:hidden}.import input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.gray{font-size:14px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.grid.landscapes{grid-template-columns:repeat(2,minmax(0,1fr))}article{background:#23282f;border:1px solid #47473e;border-radius:10px;overflow:hidden}.preview{position:relative;background:#111419}.preview img{width:100%;height:450px;object-fit:contain;display:block}.landscape .preview img{height:auto;aspect-ratio:16/9}.open{position:absolute;top:12px;right:12px;z-index:1;background:#161a20ed;box-shadow:0 2px 10px #0007}.body{padding:20px}h3{font-size:21px;line-height:1.25;margin:0 0 12px}.description{font-size:14px;color:#b9c1c9;line-height:1.6}.actions,.links{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}.links{font-size:13px}.delete{color:#f1b3a7;border-color:#986253}.badge{font-size:11px;letter-spacing:.1em;color:#c5a45d;text-transform:uppercase;margin:0 0 10px}.gray-mode .preview img{filter:grayscale(1)}[hidden]{display:none!important}#notice{color:#d9c798;min-height:24px}footer{font-size:13px;line-height:1.6} @media(max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.grid,.grid.landscapes{grid-template-columns:1fr}header,main,footer{padding:18px}.collections{padding:10px}.back{float:none;display:block;margin-bottom:18px}.preview img{height:auto;max-height:650px}.open{font-size:13px}}
:where(.reference-menu){max-width:1440px;margin:auto;padding:16px 28px 0;display:flex;gap:10px;align-items:center}
.reference-menu::before{content:'References /';color:#b4bdc6;font-size:14px}
.filter-row{display:flex;justify-content:space-between;align-items:center;gap:20px;overflow-x:auto;padding:4px;margin:12px -4px}
.filter-row .folders,.filter-row .views{margin:0;flex-wrap:nowrap;flex-shrink:0}
.filter-row button{white-space:nowrap}
.views button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 12px}
.views svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.view-count{font-size:13px;font-variant-numeric:tabular-nums;min-width:1ch}
.discarded{margin-top:48px;border-top:1px solid #756445;padding-top:24px}
body.image-viewer-open{overflow:hidden}
#imageViewer{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;padding:64px 16px 16px;background:#0a0d12f5;color:#eee4d1;cursor:zoom-out;overflow:hidden}
#imageViewer[open]{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:12px}
#imageViewer::backdrop{background:#000d}
#viewerImage{display:block;width:100%;height:100%;min-height:0;object-fit:contain}
#closeViewer{position:absolute;top:12px;right:16px;min-height:44px}
#viewerHint{text-align:center;font-size:13px;margin:0;color:#b4bdc6}
.gray-mode #viewerImage{filter:grayscale(1)}
@media(max-width:700px){.reference-menu{padding:14px 18px 0}.filter-row{gap:12px}.filter-row .folders{gap:6px}.filter-row .folders button{padding:9px 10px}.filter-row .views{gap:6px}}