.photos-page{max-width:var(--content-max);margin:0 auto;padding:clamp(24px,5vw,40px) var(--gutter) 40px}header h1{font-size:clamp(30px,4vw,42px);margin-top:10px}.subhead{font-size:15px;opacity:.65;margin-top:12px}.controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-top:32px}.filters{display:flex;gap:10px;flex-wrap:wrap}.select-field{position:relative}.field-trigger{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--ink);font:inherit;font-weight:500;font-size:14px;color:inherit;background:transparent;cursor:pointer}.field-trigger:hover{border-color:var(--accent);color:var(--accent)}.field-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.field-trigger .label{opacity:.55;font-weight:600;font-size:11px;letter-spacing:.5px;text-transform:uppercase}.field-value{font-weight:500}.chevron{flex-shrink:0;opacity:.6;transition:transform .2s ease}.select-field.open .chevron{transform:rotate(180deg)}.field-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:10;min-width:100%;max-height:260px;overflow-y:auto;margin:0;padding:4px;list-style:none;background:var(--bg);border:1px solid var(--ink);box-shadow:0 10px 28px #0000002e}.field-menu li{padding:8px 12px;font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap;cursor:pointer}.field-menu li:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)}.field-menu li[aria-selected=true]{background:var(--ink);color:var(--bg)}.field-menu li.disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.clear-filters-btn{font:inherit;font-size:13px;font-weight:600;color:var(--ink);opacity:.55;background:transparent;border:none;text-decoration:underline;cursor:pointer;padding:9px 2px}.clear-filters-btn:hover:not(:disabled){opacity:1;color:var(--accent)}.clear-filters-btn:disabled{opacity:.3;text-decoration:none;cursor:default}.sort-controls{display:flex;align-items:center;gap:10px}.shuffle-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--ink);background:transparent;color:var(--ink);opacity:.55;cursor:pointer;transition:opacity .2s ease,background-color .2s ease,color .2s ease}.shuffle-btn:hover{opacity:.85}.shuffle-btn.active{background:var(--ink);color:var(--bg);opacity:1}.shuffle-btn.flash{background:var(--accent);color:var(--bg);opacity:1}@keyframes shuffle-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.shuffle-btn svg{transform:rotate(0)}.shuffle-btn.spin svg{animation:shuffle-spin .5s ease}.sort-toggle{display:inline-flex;border:1px solid var(--ink)}.sort-toggle button{font-weight:600;font-size:13px;padding:9px 16px;border:none;background:transparent;color:var(--ink);opacity:.55;cursor:pointer;font-family:var(--font)}.sort-toggle button.active{background:var(--ink);color:var(--bg);opacity:1}.year-block{margin-top:34px}.year-block:first-child{margin-top:28px}.year-row{display:flex;align-items:center;gap:16px;margin-bottom:16px}.year-row .num{font-family:var(--font);font-weight:700;font-size:20px;opacity:.85;white-space:nowrap}.year-row .line{flex:1;height:1px;background:var(--ink);opacity:.25}.month-label{font-family:var(--font);font-weight:600;font-size:11px;letter-spacing:.6px;text-transform:uppercase;opacity:.4;margin:22px 0 10px}.year-row+.month-label{margin-top:0}.photo-grid{container-type:inline-size}.tile-grid{--cols: 3;--gap: 14px;display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:var(--gap);grid-auto-rows:calc((100cqw - (var(--cols) - 1) * var(--gap)) / var(--cols) * 2 / 3)}@media(max-width:700px){.tile-grid{--cols: 2}}.shuffle-grid{margin-top:90px}.tile{display:block;width:100%;height:100%;border:none;padding:0;cursor:pointer;overflow:hidden;transition:transform .2s ease,opacity .4s ease}.tile img{display:block;width:100%;height:100%;object-fit:cover}.tile-portrait{grid-row:span 2}.tile-portrait img{object-fit:fill}.tile:hover{transform:scale(1.02);z-index:2}.load-more-wrap{display:flex;justify-content:center;margin-top:36px}.load-more-btn{font:inherit;font-size:13px;font-weight:600;padding:11px 22px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;transition:border-color .2s ease,color .2s ease}.load-more-btn:hover{border-color:var(--accent);color:var(--accent)}.hint{font-size:13px;opacity:.45;margin-top:36px}.empty-state{font-size:14px;opacity:.5;padding:40px 0}.empty-state code{font-family:monospace;background:color-mix(in srgb,var(--ink) 8%,transparent);padding:2px 6px}.lightbox{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:28px;background:#080a0aeb;backdrop-filter:blur(11px);touch-action:none}.lightbox[hidden]{display:none}.lightbox-close{position:absolute;right:32px;top:32px;width:38px;height:38px;border:1.5px solid rgba(255,255,255,.35);background:transparent;color:#ffffffd9;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s ease,color .2s ease}.lightbox-close:hover{border-color:#ffffffb3;color:#fff}.lightbox-content{display:flex;flex-direction:column;align-items:center;max-width:94vw;max-height:92vh;animation:lightbox-in .22s ease}@keyframes lightbox-in{0%{opacity:0;transform:scale(.97) translateY(6px)}to{opacity:1;transform:none}}.lightbox-image{flex:1 1 auto;min-height:0;max-width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 0 0 1px #ffffff17,0 10px 20px #0006,0 30px 70px #0000008c}.lightbox-image img{display:block;max-width:100%;max-height:min(70vh,calc(92vh - 96px));width:auto;height:auto;object-fit:contain}.lightbox-image.color-fallback{flex:0 0 auto;width:min(100%,480px);aspect-ratio:4 / 5}.lightbox-caption{flex:0 0 auto;width:100%;max-width:520px;margin-top:20px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);text-align:center}.lightbox-location{font-family:var(--font);font-weight:600;font-size:16px;color:#ffffffeb}.lightbox-meta{font-size:12px;color:#ffffff80;letter-spacing:.3px;margin-top:5px}.lightbox-notes{font-size:13px;color:#ffffffa6;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1)}.lightbox-notes:empty{display:none}@media(max-width:700px),(max-height:500px){.lightbox-caption{margin-top:12px;padding-top:10px}.lightbox-location{font-size:14px}.lightbox-meta{font-size:11px}.lightbox-notes{font-size:12px;margin-top:8px;padding-top:8px}}
