/* Additive reading features; existing shrine cards and filters are untouched. */
.story-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr));gap:18px}
.story-grid>li{min-width:0}
.story-card{display:flex;flex-direction:column;height:100%;border:1px solid var(--c-line);border-radius:8px;overflow:hidden;background:var(--c-surface);text-decoration:none;color:var(--c-ink)}
.story-card:visited{color:var(--c-ink)}
.story-card:hover{border-color:var(--c-primary)}
.story-card>img{width:100%;aspect-ratio:4/3;object-fit:cover}
.story-card-copy{display:flex;flex-direction:column;gap:10px;padding:18px;flex:1;font-size:14px}
.story-card-copy strong{font-size:18px;line-height:1.65}
.story-reason{color:var(--c-ink-weak);font-size:13px}
.story-more{color:var(--c-link);font-weight:bold;margin-top:auto}
.photo-note{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin:28px 0;padding-bottom:24px;border-bottom:1px solid var(--c-line)}
.photo-note figure,.story-hero{margin:0}
.photo-note h3{margin-top:0}
.photo-note figcaption,.story-hero figcaption{font-size:13px;color:var(--c-ink-weak);line-height:1.7;margin-top:8px}
.photo-note img{display:block;width:100%;height:auto}
.photo-zoom,.story-hero>a{display:block;position:relative}
.zoom-label{position:absolute;right:8px;bottom:8px;background:#2b2723;color:white;padding:4px 12px;font-size:13px;border-radius:4px}
.story-hero img{width:100%;height:auto;display:block}
.story-article .body{line-height:2}
.story-return{padding:16px;background:var(--c-primary-pale);border-radius:6px}
.photo-dialog{width:min(1120px,96vw);max-width:96vw;max-height:94dvh;padding:16px;border:0;border-radius:8px;background:var(--c-bg);color:var(--c-ink)}
.photo-dialog::backdrop{background:rgba(0,0,0,.8)}
.photo-dialog img{display:block;max-height:72dvh;width:auto;max-width:100%;height:auto;margin:auto;object-fit:contain}
.photo-dialog button{display:block;margin:0 0 12px auto;min-height:44px;padding:8px 20px;background:var(--c-primary-dark);color:#fff;border:0;border-radius:4px;font:inherit;cursor:pointer}
.photo-dialog p{margin:12px 0 0}
.photo-open{overflow:hidden}
.story-card:focus-visible,.photo-zoom:focus-visible,.story-hero>a:focus-visible,.photo-dialog button:focus-visible{outline:3px solid var(--c-primary);outline-offset:4px}
@media(max-width:600px){.photo-note{grid-template-columns:1fr;gap:16px}.story-grid{grid-template-columns:1fr}.photo-dialog{padding:12px}.story-card-copy{padding:16px}}
