.gallery-hero{
  background:var(--rv-paper);
  color:var(--rv-ink)
}

.gallery-hero-copy{
  display:grid;
  align-items:start;
  gap:var(--rv-space-2)
}

.gallery-hero-copy>p{
  max-width:42rem;
  color:var(--rv-muted)
}

.gallery-search{
  display:grid;
  gap:var(--rv-space-1);
  width:min(100%,36rem);
  margin-top:var(--rv-space-2)
}

.gallery-search label{
  color:var(--rv-ink);
  font-weight:700
}

.gallery-search-control{
  position:relative;
  min-width:0
}

.gallery-search-control svg{
  position:absolute;
  top:50%;
  left:1rem;
  z-index:1;
  width:1.15rem;
  height:1.15rem;
  color:var(--rv-primary-paper);
  transform:translateY(-50%);
  pointer-events:none
}

.gallery-search-control .c-input{
  padding-inline-start:3rem
}

.gallery-search-status{
  color:var(--rv-muted);
  font-size:var(--rv-fs-1)
}

.gallery-index-board{
  display:flex;
  flex-direction:column;
  min-width:0;
  height:auto;min-height:0;
  padding:var(--rv-space-3);
  border-radius:var(--rv-radius-lg);
  background:var(--rv-dark);
  color:#effbf7;
  box-shadow:var(--rv-shadow-float);
  text-align:left
}

.gallery-index-board-head{
  display:flex;
  min-width:0;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--rv-space-2)
}

.gallery-index-board-head span{
  min-width:0;
  color:#b8d2cc;
  font-family:var(--rv-font-mono);
  font-size:var(--rv-fs-0);
  letter-spacing:.07em;
  overflow-wrap:anywhere
}

.gallery-index-board-head strong{
  flex:0 0 auto;
  color:#effbf7;
  font-family:var(--rv-font-heading);
  font-size:var(--rv-fs-1)
}

.gallery-index-route{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--rv-space-1);
  margin-block:var(--rv-space-3)
}

.gallery-index-route span{
  height:.45rem;
  border-radius:var(--rv-radius-pill);
  background:var(--rv-primary)
}

.gallery-index-route span:nth-child(2){
  background:var(--rv-accent)
}

.gallery-index-route span:nth-child(3){
  background:var(--rv-yellow)
}

.gallery-index-route span:nth-child(4){
  background:var(--rv-mint)
}

.gallery-index-rows{
  display:grid;
  gap:var(--rv-space-1)
}

.gallery-index-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  min-width:0;
  align-items:center;
  gap:var(--rv-space-2);
  padding:var(--rv-space-2);
  border-radius:var(--rv-radius-sm);
  background:#ffffff;
  color:#172321
}

.gallery-index-row div{
  display:grid;
  min-width:0;
  gap:var(--rv-space-1)
}

.gallery-index-row strong{
  color:#172321;
  font-family:var(--rv-font-heading);
  font-size:var(--rv-fs-2);
  overflow-wrap:anywhere
}

.gallery-index-row small{
  color:#596866;
  overflow-wrap:anywhere
}

.gallery-index-code{
  color:#087f72;
  font-size:var(--rv-fs-0);
  font-weight:700
}

.gallery-index-state{
  padding:.4rem .65rem;
  border-radius:var(--rv-radius-pill);
  background:var(--rv-primary-soft);
  color:#116c62;
  font-size:var(--rv-fs-0);
  font-weight:700
}

.gallery-index-foot{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:var(--rv-space-1);
  margin-top:auto;
  padding-top:var(--rv-space-2);
  color:#b8d2cc;
  font-size:var(--rv-fs-0)
}

.gallery-section-head{
  display:grid;
  align-items:start;
  gap:var(--rv-space-1);
  max-width:48rem;
  margin-bottom:var(--rv-space-4)
}

.gallery-section-head>p{
  color:var(--rv-muted)
}

.gallery-articles{
  color:#172321
}

.gallery-featured{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  min-width:0;
  overflow:hidden;
  border-radius:var(--rv-radius-lg);
  background:#ffffff;
  color:#172321;
  transition:transform var(--rv-duration) var(--rv-ease),box-shadow var(--rv-duration) var(--rv-ease)
}

.gallery-featured:hover{
  transform:translateY(-4px);
  box-shadow:var(--rv-shadow-float)
}

.gallery-featured:focus-visible{
  outline-offset:5px
}

.gallery-featured-media{
  position:relative;
  display:grid;
  min-width:0;
  height:clamp(20rem,34vw,29rem);
  place-items:center;
  padding:var(--rv-space-3);
  background:var(--rv-mint);
  color:#173532
}

.gallery-featured-media time{
  position:absolute;
  top:var(--rv-space-3);
  left:var(--rv-space-3);
  z-index:1;
  padding:.45rem .75rem;
  border-radius:var(--rv-radius-pill);
  background:#173532;
  color:#effbf7;
  font-family:var(--rv-font-mono);
  font-size:var(--rv-fs-0);
  font-variant-numeric:tabular-nums
}

.gallery-featured-media svg{
  width:min(100%,35rem);
  height:100%
}

.gallery-featured-body{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:var(--rv-space-1);
  padding:var(--rv-space-4);
  background:#ffffff;
  color:#172321
}

.gallery-featured-body p{
  color:#596866
}

.gallery-article-points{
  display:flex;
  flex-wrap:wrap;
  gap:var(--rv-space-1);
  margin-top:var(--rv-space-2)
}

.gallery-article-points span{
  padding:.4rem .7rem;
  border-radius:var(--rv-radius-pill);
  background:var(--rv-blue);
  color:#173532;
  font-size:var(--rv-fs-0);
  font-weight:700
}

.gallery-read-link{
  display:inline-flex;
  align-items:center;
  gap:var(--rv-space-1);
  margin-top:var(--rv-space-2);
  color:var(--rv-primary-paper);
  font-weight:700
}

.gallery-read-link svg{
  width:1rem;
  height:1rem;
  transition:transform var(--rv-duration) var(--rv-ease)
}

.gallery-featured:hover .gallery-read-link svg{
  transform:translateX(.25rem)
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
  gap:var(--rv-space-3);
  margin-top:var(--rv-space-4)
}

.gallery-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--rv-space-1);
  transition:transform var(--rv-duration) var(--rv-ease),box-shadow var(--rv-duration) var(--rv-ease)
}

.gallery-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--rv-shadow-soft)
}

.gallery-card-meta{
  display:flex;
  width:100%;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:var(--rv-space-1)
}

.gallery-card-meta time{
  color:inherit;
  font-family:var(--rv-font-mono);
  font-size:var(--rv-fs-0);
  font-variant-numeric:tabular-nums
}

.gallery-card h3{
  overflow-wrap:anywhere
}

.gallery-card-hint{
  display:block;
  margin-top:var(--rv-space-2);
  color:inherit;
  font-size:var(--rv-fs-1);
  font-weight:700
}

.gallery-empty{
  display:grid;
  gap:var(--rv-space-1);
  margin-top:var(--rv-space-3);
  background:var(--rv-blue);
  color:#172321
}

.gallery-empty p{
  color:#4f686d
}

.gallery-empty[hidden]{
  display:none
}

.gallery-scene-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
  gap:var(--rv-space-3)
}

.gallery-scene-card{
  min-width:0;
  overflow:hidden;
  border-radius:var(--rv-radius-md);
  background:#ffffff;
  color:#172321;
  box-shadow:var(--rv-shadow-soft)
}

.gallery-browser{
  background:var(--rv-dark);
  color:#effbf7
}

.gallery-browser-bar{
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:var(--rv-space-2);
  padding:var(--rv-space-2) var(--rv-space-3);
  background:var(--rv-yellow);
  color:#3d3d2f
}

.gallery-browser-bar span{
  min-width:0;
  font-size:var(--rv-fs-0);
  font-weight:700;
  overflow-wrap:anywhere
}

.gallery-browser-body{
  display:grid;
  gap:var(--rv-space-1);
  padding:var(--rv-space-3)
}

.gallery-job{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  min-width:0;
  gap:var(--rv-space-1) var(--rv-space-2);
  padding:var(--rv-space-2);
  border-radius:var(--rv-radius-sm);
  background:color-mix(in srgb,var(--rv-dark) 88%,white);
  color:#effbf7
}

.gallery-job>span{
  grid-row:1 / span 2;
  display:inline-flex;
  width:2rem;
  height:2rem;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--rv-yellow);
  color:#3d3d2f;
  font-family:var(--rv-font-mono);
  font-size:var(--rv-fs-0);
  line-height:1
}

.gallery-job strong{
  min-width:0;
  color:#effbf7;
  font-size:var(--rv-fs-1);
  overflow-wrap:anywhere
}

.gallery-job small{
  min-width:0;
  color:#b8d2cc;
  overflow-wrap:anywhere
}

.gallery-job.is-done>span{
  background:var(--rv-mint);
  color:#173532
}

.gallery-job.is-active{
  background:var(--rv-primary);
  color:#103a35
}

.gallery-job.is-active>span{
  background:#173532;
  color:#effbf7
}

.gallery-job.is-active strong,
.gallery-job.is-active small{
  color:#103a35
}

.gallery-scene-copy{
  display:grid;
  gap:var(--rv-space-1);
  padding:var(--rv-space-3);
  background:#ffffff;
  color:#172321
}

.gallery-scene-copy p{
  color:#596866
}

.gallery-filter-layout{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  align-items:center;
  gap:var(--rv-space-4)
}

.gallery-filter-copy{
  display:grid;
  align-items:start;
  gap:var(--rv-space-1)
}

.gallery-filter-copy p{
  color:#62614e
}

.gallery-filter-panel{
  display:grid;
  gap:var(--rv-space-1);
  padding:var(--rv-space-3);
  border-radius:var(--rv-radius-md);
  background:#ffffff;
  color:#172321
}

.gallery-topic-filter{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));
  gap:var(--rv-space-1)
}

.gallery-topic-filter button{
  min-width:0;
  min-height:2.75rem;
  padding:.65rem .9rem;
  border:1px solid var(--rv-input-line);
  border-radius:var(--rv-radius-pill);
  background:#edf1ee;
  color:#172321;
  font-size:var(--rv-fs-1);
  font-weight:700;
  overflow-wrap:anywhere;
  transition:transform var(--rv-duration) var(--rv-ease),background var(--rv-duration) var(--rv-ease),color var(--rv-duration) var(--rv-ease)
}

.gallery-topic-filter button:hover{
  transform:translateY(-2px);
  background:var(--rv-primary-soft);
  color:#116c62
}

.gallery-topic-filter button[aria-pressed="true"]{
  border-color:var(--rv-dark);
  background:var(--rv-dark);
  color:#effbf7
}

.gallery-filter-status{
  color:#596866;
  font-size:var(--rv-fs-1)
}

.gallery-path-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
  gap:var(--rv-space-3)
}

.gallery-path-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--rv-space-1)
}

.gallery-path-number{
  display:inline-flex;
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  padding:.45rem .75rem;
  border-radius:var(--rv-radius-pill);
  background:#173532;
  color:#effbf7;
  font-size:var(--rv-fs-0);
  font-weight:700
}

.gallery-path-card ul{
  display:grid;
  gap:var(--rv-space-1);
  margin-top:var(--rv-space-2);
  color:inherit
}

.gallery-path-card li{
  overflow-wrap:anywhere
}

.gallery-closing-copy{
  display:grid;
  max-width:42rem;
  align-items:start;
  gap:var(--rv-space-1)
}

.gallery-closing-copy .c-badge{
  background:var(--rv-primary);
  color:#103a35
}

.gallery-closing-copy h2{
  color:#effbf7
}

.gallery-closing-copy p{
  color:#b8d2cc
}

.gallery-closing-actions{
  display:grid;
  flex:0 0 min(100%,17rem);
  gap:var(--rv-space-1)
}

.gallery-closing-actions .c-btn{
  width:100%
}

.gallery-closing-actions .c-btn-ghost{
  color:#effbf7;
  border-color:color-mix(in srgb,#effbf7 45%,transparent)
}

@media(max-width:64rem){
  .gallery-grid,
  .gallery-path-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .gallery-filter-layout{
    grid-template-columns:1fr
  }
}

@media(max-width:48rem){
  .gallery-featured,
  .gallery-scene-grid{
    grid-template-columns:1fr
  }

  .gallery-featured-media{
    height:clamp(18rem,70vw,24rem)
  }

  .gallery-featured-body{
    padding:var(--rv-space-3)
  }
}

@media(max-width:42rem){
  .gallery-index-board{
    height:auto;
    min-height:31rem
  }

  .gallery-index-row{
    grid-template-columns:auto minmax(0,1fr);
    gap:var(--rv-space-1)
  }

  .gallery-index-state{
    grid-column:2;
    justify-self:start
  }

  .gallery-index-foot{
    margin-top:var(--rv-space-3)
  }

  .gallery-grid,
  .gallery-path-grid{
    grid-template-columns:1fr
  }

  .gallery-card-meta{
    align-items:flex-start;
    flex-direction:column
  }

  .gallery-browser-bar{
    align-items:flex-start;
    flex-direction:column;
    gap:var(--rv-space-1)
  }

  .gallery-topic-filter{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:24.375rem){
  .gallery-index-board,
  .gallery-featured-body,
  .gallery-filter-panel{
    padding:var(--rv-space-2)
  }

  .gallery-index-row{
    padding:var(--rv-space-1)
  }

  .gallery-topic-filter{
    grid-template-columns:1fr
  }
}