:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:#323232;color:#e5e5e5;font:14px/1.5 system-ui,Arial}main{max-width:1110px;margin:auto;padding:0 20px}header{text-align:center;padding:34px 0 22px}.kicker{font-size:10px;letter-spacing:.18em;color:#a8bfc2}h1{font:italic 42px Georgia,serif;color:#66e5eb;margin:9px 0 2px}.sub{font:italic 13px Georgia,serif;color:#9de4e8}.by{font-size:12px;color:#b9d9dc;margin:4px 0 19px}nav{display:flex;justify-content:center;gap:25px}nav a{color:#c8d2d5;text-decoration:none;font-size:12px}nav a:hover{color:#67e5eb}.controls{display:flex;align-items:center;justify-content:space-between;gap:12px;border-block:1px solid #555;padding:12px 0}#filters{display:flex;gap:4px;flex-wrap:wrap}button{border:1px solid transparent;background:none;color:#cdd2d4;padding:7px 11px;border-radius:4px;cursor:pointer}button:hover{border-color:#879da1}button.active{background:#89e1e6;color:#16292b}input{background:#242424;color:white;border:1px solid #666;border-radius:4px;padding:9px;width:180px}.meta{display:flex;justify-content:space-between;color:#b5bec1;font-size:11px;padding:16px 0 12px}.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px 17px}.photo{aspect-ratio:3/2;position:relative;display:block;overflow:hidden;background:#222}.photo img{width:100%;height:100%;object-fit:cover;display:block}.photo.featured{grid-column:span 3;grid-row:span 2}.caption{position:absolute;bottom:0;left:0;right:0;padding:20px 7px 7px;color:white;background:linear-gradient(transparent,#000c);opacity:0;font-size:11px}.photo:hover .caption,.photo:focus-visible .caption{opacity:1}.photo:hover img{filter:brightness(.8)}.photo:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid #89e1e6;outline-offset:2px}footer{border-top:1px solid #555;margin-top:45px;padding:25px;text-align:center;color:#b5bec1;font-size:11px}@media(max-width:800px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.controls{flex-direction:column;align-items:stretch}input{width:100%}}@media(max-width:550px){main{padding:0 12px}h1{font-size:32px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.photo.featured{grid-column:span 2;grid-row:span 2}.meta span:last-child{display:none}.caption{opacity:1}button{padding:7px}}
.controls{display:flex;flex-direction:column;align-items:stretch;gap:10px}
#filters{display:flex;flex-wrap:wrap;gap:5px}
.filter-row{display:flex;flex-wrap:wrap;gap:12px}
.filter-label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#cbd8da;min-width:150px;flex:1}
.filter-label select{background:#242424;color:#eee;border:1px solid #666;border-radius:4px;padding:9px;max-width:100%;width:100%}
.search-row{display:flex;align-items:center;gap:10px}
.search-row input{flex:1;max-width:360px}
#reset{border:1px solid #666}
.warning{color:#ffd18a;font-size:12px}
select:focus-visible{outline:2px solid #89e1e6;outline-offset:2px}
@media(max-width:550px){.filter-label{min-width:calc(50% - 8px)}.search-row input{min-width:0}}