:root{--accent:#336600;--accent-light:#8fcf4f;--accent-hover:#b5e486;color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#111;color:#eee}*{box-sizing:border-box}body{margin:0}button,a{touch-action:manipulation}button{font:inherit}.sidebar{position:fixed;inset:0 auto 0 0;width:220px;background:#1d1d1d;padding:34px 26px;display:flex;flex-direction:column;justify-content:space-between}.brand{display:block;line-height:0;text-decoration:none;border-radius:50%}.brand img{display:block;width:170px;height:auto;max-width:100%;margin:0 auto}.brand:hover img{filter:brightness(1.08)}.tagline{margin:14px 0 0;color:var(--accent-light);font-size:12px;letter-spacing:.06em;text-align:center}.mobile-tagline{display:none}.side-nav{margin-top:22px;text-align:center}.home-link{color:var(--accent-light);text-decoration:none;font-size:14px;font-weight:700;letter-spacing:.05em}.home-link:hover,.home-link:focus-visible{color:var(--accent-hover);text-decoration:underline}a:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px}.sidebar-bottom{font-size:12px;color:#888}.gallery-area{margin-left:220px;padding:12px}.masonry{columns:5 220px;column-gap:10px}.tile{display:block;text-decoration:none;width:100%;padding:0;margin:0 0 10px;border:0;border-radius:10px;background:#222;break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;cursor:zoom-in;overflow:hidden;isolation:isolate;transform:translateZ(0)}.tile img{display:block;width:100%;height:auto;border-radius:inherit;transition:opacity .2s}.tile:hover img{opacity:.82}.tile:focus-visible{outline:2px solid var(--accent-light);outline-offset:3px}.empty{padding:35px;color:#aaa}.mobile-header{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.lightbox[hidden]{display:none}.lightbox{position:fixed;inset:0;z-index:20;background:rgba(0,0,0,.97);display:flex;align-items:center;justify-content:center}.lightbox-bar{position:absolute;z-index:3;top:0;left:0;right:0;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;color:#bbb;font-size:13px}.meta{display:flex;gap:12px;align-items:baseline;min-width:0}.caption{color:#5c5c5c;font-size:12px;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.caption.custom{color:#8a8a8a}.actions{display:flex;gap:12px;align-items:center}.actions button,.actions a{background:none;border:0;color:white;font-size:29px;cursor:pointer;text-decoration:none;min-width:36px;text-align:center}.viewer{width:calc(100% - 115px);height:calc(100% - 95px);display:flex;align-items:center;justify-content:center;overflow:auto;touch-action:pan-x pan-y}.viewer img{display:block;max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in}.viewer.zoomed{display:block;text-align:center}.viewer.zoomed img{max-width:none;max-height:none;width:auto;height:auto;margin:auto;cursor:zoom-out}.nav{position:absolute;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--accent-light);font-size:56px;cursor:pointer;padding:12px;z-index:2}.prev{left:4px}.next{right:4px}body.viewer-open{overflow:hidden}@media(max-width:700px){.sidebar{display:none}.mobile-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid var(--accent);height:60px;padding:0 15px;background:#1d1d1d}.brand img{width:44px;height:44px}.mobile-tagline{display:block;flex:1;margin:0 12px;color:var(--accent-light);font-size:12px;letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gallery-area{margin:0;padding:6px}.masonry{columns:2;column-gap:6px}.tile{margin-bottom:6px;border-radius:7px}.viewer{width:100%;height:calc(100% - 105px)}.nav{top:auto;bottom:6px;transform:none;font-size:40px}.prev{left:12px}.next{right:12px}.lightbox-bar{height:50px}.actions{gap:5px}}@media(min-width:701px) and (max-width:1050px){.sidebar{width:170px;padding:30px 16px}.brand img{width:138px}.gallery-area{margin-left:170px}.masonry{columns:3 190px}}
.nav:hover,.actions button:hover,.actions a:hover{color:var(--accent-hover)}
