main {
  display: block;
  columns: 12rem;
  column-gap: 1rem;
}
main {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  grid-template-rows: auto;
  gap: 1rem;
}
@media (max-width: 500px) {
  main { grid-template-columns: repeat(2, 1fr); }
}
main {
  display: grid-lanes;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 1rem;
}
@media (max-width: 768px) {
  main { grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); }
}
@media (max-width: 500px) {
  main { grid-template-columns: repeat(2, 1fr); }
}
main {
  display: grid-lanes;
  grid-template-columns: 10ch repeat(auto-fill, minmax(20ch, 1fr)) 10ch;
  gap: 1rem;
}
@media (max-width: 500px) {
  main { grid-template-columns: repeat(2, 1fr); }
}
main {
  display: grid-lanes;
  grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr) minmax(14rem, 2fr)) minmax(8rem, 1fr);
  gap: 1rem;
}
@media (max-width: 768px) {
  main { grid-template-columns: repeat(auto-fill, minmax(6rem, 1fr) minmax(10rem, 2fr)) minmax(6rem, 1fr); }
}
@media (max-width: 500px) {
  main { grid-template-columns: 1fr 2fr; }
}
main {
  display: grid-lanes;
  grid-template-columns: repeat(auto-fill, minmax(16ch, 1fr));
  gap: 1rem;
}
@media (max-width: 500px) {
  main { grid-template-columns: repeat(2, 1fr); }
}
.card:nth-child(5n) { grid-column: span 2; }
main {
  display: grid-lanes;
  grid-template-columns: repeat(auto-fill, minmax(18ch, 1fr));
}
@media (max-width: 500px) {
  main { grid-template-columns: repeat(2, 1fr); }
}
figure:has(.wide) { grid-column: span 2; }
main {
  display: grid-lanes;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}
@media (max-width: 500px) {
  main { grid-template-columns: repeat(2, 1fr); }
}
.card { view-transition-name: match-element; }
.expanded { grid-column: 1 / -1; }
main {
  display: grid-lanes;
  grid-template-columns: 1fr 1fr 2fr 3fr 5fr 8fr;
  gap: 1rem;
}
@media (max-width: 768px) {
  main { grid-template-columns: 1fr 1fr 2fr 3fr; }
}
@media (max-width: 500px) {
  main { grid-template-columns: 1fr 1fr 2fr; }
}
main {
  display: grid-lanes;
  grid-template-rows: repeat(5, 1fr);
  gap: 1rem;
  overflow-x: scroll;
}
@media (max-width: 500px) {
  main { grid-template-rows: repeat(4, 1fr); }
}
main {
  display: grid-lanes;
  grid-template-rows: repeat(3, 1fr);
  gap: 1rem;
  overflow-x: scroll;
}
@media (max-width: 500px) {
  main { grid-template-rows: repeat(2, 1fr); }
}
main {
  display: grid-lanes;
  grid-template-rows: repeat(5, 1fr);
  gap: 1rem;
  overflow-x: scroll;
}
@media (max-width: 500px) {
  main { grid-template-rows: repeat(4, 1fr); }
}
figure:has(.wide) { grid-row: span 2; }
main {
  display: grid-lanes;
  grid-template-rows: 2fr 1fr 2fr 1fr 2fr;
  gap: 1rem;
  overflow-x: scroll;
}
@media (max-width: 500px) {
  main { grid-template-rows: 2fr 1fr 2fr; }
}
main {
  display: flex;
  flex-flow: row wrap;
  gap: 1rem;
}
figure { flex: auto; }
img { height: 200px; width: auto; min-width: 100%; object-fit: cover; }

This layout uses View Transitions to animate items smoothly when the grid reflows — for example, when the browser is resized or tolerance changes. Because your system prefers reduced motion, those animations are not playing. The layout itself still works the same way.

Photo gallery

Hotel lounge with leather banquette and pendants
Pink ranunculus flower with water droplets
White church on a grassy hill
Green chairs and wooden tables in cafe
Potted plant on stand against yellow wall
Narrow road through sand dunes
Ocean wave breaking close-up
Turquoise spiral staircase looking up
Stone engine house on a coastal hillside
Marble sculpture and painting in ornate room
Person walking toward snowy mountains
Person at base of tropical waterfall
White hydrangea flower clusters
White building with colorful vertical slats
Close-up of tree bark texture
Museum interior with arch and staircase
Manhattan Bridge framed by brick buildings
Person walking past Japanese restaurant at night
Sunlit office hallway with metal railing
White building detail with round vent
Autumn leaves floating on dark water
Traditional Japanese tatami room interior
Sculptural bathroom with oval windows at sunset
Grey heron standing at water's edge
Waves on a sandy beach
Jefferson Memorial with cherry blossoms
Foggy pine forest treeline
White sailing ship on calm sea
Red poppies in a wheat field
Mountain peaks at golden sunset with flowers
Foggy forest-covered hillside
Snow-covered evergreen tree in winter
Broken blue window on concrete wall
Teal shuttered window on pink wall
Layered pale green paper curves
Pedestrians crossing a busy Manhattan street
Daisies and grass on a seaside cliff
Starry night sky over desert canyon
Bicycle wheel and handlebars against orange wall
Angular brick building looking upward
Snowy mountain peak emerging from clouds
Mountain valley with lake at sunset
Pink cherry blossom branches in bloom
Orange glossy abstract curved surface
Lone tree between green hills
Tall redwood trees in a forest
Tropical plants inside a glass greenhouse
Empty outdoor swimming pool with slide
Empire State Building and skyline at sunset
Pink hotel building against blue sky
Modern building with sandstone columns
Concrete column edge against teal sky
Green wooden cottage with matching door
Red cardinal bird on snowy branch
Old wooden double doors with handles
Bee on bright orange flowers
Green fern leaves close-up
Sea stack with natural arch in ocean
Diamond-patterned glass building facade
River flowing through red rock canyon
Small cabin in an alpine valley
Mossy sea stack with arch in ocean
Rocky mountain peaks at sunset with wildflowers
Milky way across the night sky
Brick rowhouse with orange front door
Orange building facade with iron balconies
Ornate domed ceiling with geometric patterns
Yellow building with arches and stairway
High-rise apartment building looking up
Red torii gates at a Japanese shrine
Yellow wildflowers against a pale sky
Lichen-covered grey rock face
Rocky sea cliffs with crashing waves
Yellow arched building with staircase
Sunset over lake with purple flowers
Subway train at Wall Street station
New York City skyline at night
Cozy living room with stone fireplace
Cherry blossom branches against blue sky
Blue glass building walls looking upward