/* [gallery] story photo gallery + CSS-only :target lightbox (no scripts). Linked only on stories with a gallery. */
.sg{margin:1.75rem 0 1.25rem;clear:both;max-width:100%}
.sg h2{font-size:1.25rem;margin:0 0 .15rem;display:flex;align-items:center;gap:.5rem}
.sg-n{font-size:.75rem;font-weight:700;line-height:1;padding:.25rem .5rem;border-radius:999px;background:#e8eef6;color:#1b3a5c}
.sg-hint{font-size:.85rem;margin:0 0 .65rem;opacity:.75}
.sg-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.sg-item{margin:0;padding:0;min-width:0;display:flex;flex-direction:column}
.sg-thumb{display:block;position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:8px;background:#0b1626}
.sg-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.sg-thumb:hover img,.sg-thumb:focus-visible img{transform:scale(1.04)}
.sg-thumb:focus-visible{outline:3px solid #f2a900;outline-offset:2px}
.sg-thumb::after{content:"\2922";position:absolute;right:.4rem;bottom:.4rem;width:1.7rem;height:1.7rem;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:.95rem;line-height:1.7rem;text-align:center;pointer-events:none}
.sg-cap{font-size:.84rem;line-height:1.38;margin:.4rem 0 0;overflow-wrap:anywhere}
.sg-time{font-weight:700;white-space:nowrap}
.sg-credit,.sg-credit-i{font-size:.8rem;opacity:.75}
.sg-credit{margin:.6rem 0 0;font-style:italic}
/* a last tile left alone in its row spans the row, so there is no empty hole */
@media (max-width:699.98px){
  .sg-item:last-child:nth-child(odd){grid-column:1/-1}
  .sg-item:last-child:nth-child(odd) .sg-thumb{aspect-ratio:3/2}
}
@media (min-width:700px){
  .sg-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
  .sg-item:last-child:nth-child(3n+2){grid-column:span 2}
  .sg-item:last-child:nth-child(3n+2) .sg-thumb{aspect-ratio:3/2}
  .sg-item:last-child:nth-child(3n+1):not(:first-child){grid-column:1/-1}
  .sg-item:last-child:nth-child(3n+1):not(:first-child) .sg-thumb{aspect-ratio:2/1}
}
/* lightbox: flex column [photo][caption][nav]; the photo box takes whatever height is left (object-fit:contain), so nothing overlaps */
.sg-lb{display:none}
.sg-lb:target{display:flex;flex-direction:column;align-items:center;position:fixed;inset:0;z-index:10000;padding:3.25rem .75rem .75rem;box-sizing:border-box;background:rgba(4,9,18,.97);color:#eef3f9}
html:has(.sg-lb:target){overflow:hidden}
.sg-lb-bg{position:absolute;inset:0;z-index:0;cursor:zoom-out}
.sg-lb-fig{position:relative;z-index:1;margin:0;width:100%;max-width:1200px;flex:1 1 0;min-height:0;display:flex;flex-direction:column;align-items:center}
.sg-lb-fig img{display:block;flex:1 1 0;min-height:0;width:100%;height:auto;object-fit:contain;cursor:default}
.sg-lb-fig figcaption{flex:none;font-size:.9rem;line-height:1.45;margin:.6rem 0 0;max-width:62ch;text-align:center;color:#eef3f9}
.sg-lb-credit{display:block;font-size:.8rem;opacity:.8;margin-top:.15rem}
.sg-lb-nav{flex:none;position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.45rem .6rem;margin:.65rem 0 0}
.sg-lb a.sg-lb-x,.sg-lb-nav a,.sg-lb-off{display:inline-flex;align-items:center;gap:.4rem;min-height:40px;padding:0 .9rem;border-radius:999px;font-size:.9rem;font-weight:600;text-decoration:none;color:#fff;background:rgba(255,255,255,.14)}
.sg-lb-nav a:hover,.sg-lb a.sg-lb-x:hover{background:rgba(255,255,255,.26)}
.sg-lb-off{opacity:.35}
.sg-lb-pos{font-size:.85rem;opacity:.8;padding:0 .2rem}
.sg-lb a.sg-lb-x{position:absolute;top:.55rem;right:.6rem;z-index:2}
@media (orientation:landscape) and (max-height:600px){.sg-lb:target{padding-top:2.9rem}.sg-lb-fig figcaption{font-size:.8rem;margin-top:.4rem}.sg-lb-nav{margin-top:.4rem}}
@media print{.sg-lb{display:none!important}}