.showcase-hero{
  overflow:hidden;
}

.showcase-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  gap:var(--mr-space-5);
  align-items:center;
}

.showcase-hero .c-badge,
.showcase-library .c-badge,
.showcase-case .c-badge,
.showcase-decision .c-badge{
  width:fit-content;
  align-self:flex-start;
}

.showcase-hero .c-badge + .page-hero__title,
.showcase-library .c-badge + h2,
.showcase-case .c-badge + h2,
.showcase-decision .c-badge + h2{
  margin-top:var(--mr-space-2);
}

.showcase-hero__grid em{
  color:var(--mr-color-dark);
  font-style:italic;
  background:linear-gradient(transparent 18%,var(--mr-color-primary) 18%,var(--mr-color-primary) 88%,transparent 88%);
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}

.showcase-console{
  min-width:0;
  padding:var(--mr-space-2);
  border:1px solid var(--mr-line-strong);
  border-radius:var(--mr-radius-lg);
  background:var(--mr-color-dark-deep);
  box-shadow:var(--mr-shadow-md),var(--mr-shadow-glow);
}

.showcase-console__head{
  display:flex;
  min-width:0;
  align-items:center;
  gap:var(--mr-space-2);
  padding-bottom:var(--mr-space-2);
  color:var(--mr-color-text-muted);
  border-bottom:1px solid var(--mr-line-purple);
  font-size:var(--mr-fs-0);
}

.showcase-console__head > span:nth-child(2){
  min-width:0;
  margin-right:auto;
  overflow-wrap:anywhere;
}

.showcase-console__dots{
  display:flex;
  flex:0 0 auto;
  gap:.4rem;
}

.showcase-console__dots i{
  width:.65rem;
  height:.65rem;
  border-radius:50%;
  background:var(--mr-color-danger);
}

.showcase-console__dots i:nth-child(2){
  background:var(--mr-color-warning);
}

.showcase-console__dots i:nth-child(3){
  background:var(--mr-color-success);
}

.showcase-console__flow{
  display:grid;
  gap:.5rem;
  margin-block:var(--mr-space-2);
}

.showcase-console__step{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:var(--mr-space-2);
  align-items:center;
  min-width:0;
  padding:.7rem;
  border:1px solid var(--mr-line-purple);
  border-radius:var(--mr-radius-sm);
  background:var(--mr-color-surface);
}

.showcase-console__step > span{
  color:var(--mr-color-primary);
  font-family:var(--mr-font-mono);
  font-size:var(--mr-fs-0);
}

.showcase-console__step div{
  min-width:0;
}

.showcase-console__step strong,
.showcase-console__step small{
  display:block;
}

.showcase-console__step strong{
  font-family:var(--mr-font-mono);
}

.showcase-console__step small{
  margin-top:.15rem;
  color:var(--mr-color-text-muted);
}

.showcase-console__step b{
  color:var(--mr-color-primary);
  font-family:var(--mr-font-mono);
  font-size:var(--mr-fs-0);
}

.showcase-overview{
  margin-top:var(--mr-space-4);
}

.showcase-overview .c-card__body{
  height:100%;
}

.showcase-overview svg{
  width:2rem;
  height:2rem;
  margin-bottom:var(--mr-space-2);
  color:var(--mr-color-primary);
}

.showcase-overview h3{
  margin-bottom:var(--mr-space-2);
}

.showcase-overview p{
  color:var(--mr-color-text-muted);
}

.showcase-overview__signal{
  display:block;
  margin-top:var(--mr-space-3);
  padding-top:var(--mr-space-2);
  color:var(--mr-color-accent);
  border-top:1px solid var(--mr-line-purple);
  font-family:var(--mr-font-mono);
  font-size:var(--mr-fs-0);
}

.showcase-library{
  background:var(--mr-color-dark-deep);
}

.showcase-library__layout{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(16rem,1fr);
  grid-template-areas:"feed rail";
  gap:var(--mr-space-4);
  align-items:start;
  margin-top:var(--mr-space-4);
}

.showcase-feed{
  grid-area:feed;
  display:grid;
  gap:var(--mr-space-3);
  min-width:0;
}

.showcase-rail{
  grid-area:rail;
  min-width:0;
}

.showcase-rail__panel{
  position:sticky;
  top:calc(var(--mr-header-height) + var(--mr-space-2));
  display:grid;
  gap:var(--mr-space-3);
  min-width:0;
  padding:var(--mr-space-3);
  border:1px solid var(--mr-line-strong);
  border-radius:var(--mr-radius-lg);
  background:var(--mr-color-surface);
  box-shadow:var(--mr-shadow-sm);
}

.showcase-rail__heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--mr-space-2);
  padding-bottom:var(--mr-space-2);
  border-bottom:1px solid var(--mr-line-purple);
  font-family:var(--mr-font-heading);
  font-weight:var(--mr-weight-bold);
}

.showcase-rail__heading strong{
  color:var(--mr-color-primary);
}

.showcase-search{
  position:relative;
  display:block;
  min-width:0;
}

.showcase-search svg{
  position:absolute;
  top:50%;
  left:.85rem;
  z-index:1;
  width:1.1rem;
  height:1.1rem;
  color:var(--mr-color-text-dim);
  transform:translateY(-50%);
  pointer-events:none;
}

.showcase-search .c-input{
  padding-left:2.6rem;
}

.showcase-rail__group{
  display:grid;
  gap:var(--mr-space-2);
}

.showcase-rail__label{
  font-size:var(--mr-fs-1);
  font-weight:var(--mr-weight-bold);
}

.showcase-rail .c-filter{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.showcase-rail .c-filter__button{
  min-width:0;
  white-space:normal;
}

.showcase-rail__count{
  padding:.7rem;
  color:var(--mr-color-accent);
  border:1px solid var(--mr-line);
  border-radius:var(--mr-radius-sm);
  background:rgba(183,255,42,.045);
  font-family:var(--mr-font-mono);
  font-size:var(--mr-fs-0);
  text-align:center;
}

.showcase-rail__note{
  padding:var(--mr-space-2);
  border-left:2px solid var(--mr-color-primary);
  background:var(--mr-color-dark-deep);
}

.showcase-rail__note strong{
  display:block;
  margin-bottom:.5rem;
}

.showcase-rail__note p{
  margin-bottom:0;
  color:var(--mr-color-text-muted);
  font-size:var(--mr-fs-1);
}

.showcase-article{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--mr-space-3);
  padding:var(--mr-space-3);
}

.showcase-article__index{
  color:var(--mr-color-primary);
  font-size:var(--mr-fs-3);
  font-weight:var(--mr-weight-bold);
}

.showcase-article__content{
  min-width:0;
}

.showcase-article__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--mr-space-2);
  margin-bottom:var(--mr-space-2);
  color:var(--mr-color-text-muted);
  font-size:var(--mr-fs-0);
}

.showcase-article h3{
  margin-bottom:var(--mr-space-2);
}

.showcase-article h3 a{
  transition:color var(--mr-transition-fast);
}

.showcase-article h3 a:hover,
.showcase-article h3 a:focus-visible{
  color:var(--mr-color-primary);
}

.showcase-article p{
  color:var(--mr-color-text-muted);
}

.showcase-article__footer{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--mr-space-2);
  margin-top:var(--mr-space-3);
  padding-top:var(--mr-space-2);
  border-top:1px solid var(--mr-line-purple);
  font-size:var(--mr-fs-1);
}

.showcase-article__footer span{
  min-width:0;
  color:var(--mr-color-text-dim);
}

.showcase-article__footer a{
  color:var(--mr-color-primary);
  font-weight:var(--mr-weight-bold);
}

.showcase-article__footer a:hover{
  color:var(--mr-color-accent);
}

.showcase-empty{
  padding:var(--mr-space-4);
  text-align:center;
}

.showcase-empty svg{
  width:2.5rem;
  height:2.5rem;
  margin:0 auto var(--mr-space-2);
  color:var(--mr-color-primary);
}

.showcase-empty h3{
  margin-bottom:var(--mr-space-2);
}

.showcase-empty p{
  color:var(--mr-color-text-muted);
}

.showcase-case{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--mr-space-5);
  align-items:start;
}

.showcase-case--reverse .showcase-case__copy{
  order:2;
}

.showcase-case--reverse .showcase-case__terminal{
  order:1;
}

.showcase-case__copy{
  display:flex;
  min-width:0;
  flex-direction:column;
}

.showcase-case__copy > p{
  margin-top:var(--mr-space-2);
  color:var(--mr-color-text-muted);
}

.showcase-case__terminal{
  min-width:0;
  padding:var(--mr-space-3);
  border:1px solid var(--mr-line-strong);
  border-radius:var(--mr-radius-lg);
  background:var(--mr-color-dark-deep);
  box-shadow:var(--mr-shadow-md);
}

.showcase-terminal__title{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--mr-space-2);
  margin-bottom:var(--mr-space-2);
}

.showcase-steps{
  display:grid;
  gap:var(--mr-space-2);
  margin:var(--mr-space-3) 0 0;
  padding:0;
  list-style:none;
}

.showcase-steps li{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--mr-space-2);
  min-width:0;
  padding:var(--mr-space-2);
  border:1px solid var(--mr-line-purple);
  border-radius:var(--mr-radius-md);
  background:var(--mr-color-surface);
}

.showcase-steps li > span{
  color:var(--mr-color-primary);
  font-family:var(--mr-font-mono);
  font-weight:var(--mr-weight-bold);
}

.showcase-steps h3{
  margin-bottom:.5rem;
  font-size:var(--mr-fs-3);
}

.showcase-steps p{
  margin-bottom:0;
  color:var(--mr-color-text-muted);
  font-size:var(--mr-fs-1);
}

.showcase-observations{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.5rem;
  margin-top:var(--mr-space-2);
}

.showcase-observations span{
  padding:.5rem;
  color:var(--mr-color-accent);
  border:1px solid var(--mr-line);
  border-radius:var(--mr-radius-sm);
  font-family:var(--mr-font-mono);
  font-size:var(--mr-fs-0);
  text-align:center;
}

.showcase-ci-notes{
  margin-top:var(--mr-space-3);
}

.showcase-ci-notes h3{
  margin-bottom:var(--mr-space-2);
}

.showcase-ci-notes p{
  margin-bottom:0;
  color:var(--mr-color-text-muted);
}

.showcase-checklist{
  display:grid;
  gap:var(--mr-space-2);
  margin-top:var(--mr-space-3);
}

.showcase-checklist > div{
  padding:var(--mr-space-2);
  border-left:2px solid var(--mr-color-primary);
  background:var(--mr-color-surface);
}

.showcase-checklist strong{
  display:block;
  margin-bottom:.5rem;
}

.showcase-checklist p{
  margin-bottom:0;
  color:var(--mr-color-text-muted);
}

.showcase-case__terminal .c-alert{
  margin-top:var(--mr-space-2);
}

.showcase-ai-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--mr-space-3);
  margin-top:var(--mr-space-4);
}

.showcase-ai-card{
  min-width:0;
}

.showcase-ai-card__number{
  display:block;
  margin-bottom:var(--mr-space-2);
  color:var(--mr-color-primary);
  font-size:var(--mr-fs-3);
  font-weight:var(--mr-weight-bold);
}

.showcase-ai-card.c-card--light .showcase-ai-card__number{
  color:var(--mr-color-violet);
}

.showcase-ai-card h3{
  margin-bottom:var(--mr-space-2);
}

.showcase-ai-card p{
  color:var(--mr-color-text-muted);
}

.showcase-ai-card.c-card--light p{
  color:var(--mr-color-dark);
}

.showcase-ai-card dl{
  display:grid;
  gap:.7rem;
  margin:var(--mr-space-3) 0 0;
  padding-top:var(--mr-space-2);
  border-top:1px solid var(--mr-line-purple);
}

.showcase-ai-card dl div{
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  gap:var(--mr-space-2);
  min-width:0;
}

.showcase-ai-card dt{
  font-weight:var(--mr-weight-bold);
}

.showcase-ai-card dd{
  min-width:0;
  margin:0;
  color:var(--mr-color-text-muted);
  overflow-wrap:anywhere;
}

.showcase-ai-card.c-card--light dd{
  color:var(--mr-color-dark);
}

.showcase-ai-command{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--mr-space-3);
  align-items:center;
  margin-top:var(--mr-space-3);
  padding:var(--mr-space-3);
  border:1px solid var(--mr-line-strong);
  border-radius:var(--mr-radius-lg);
  background:var(--mr-color-surface);
}

.showcase-ai-command h3{
  margin-block:var(--mr-space-2);
}

.showcase-ai-command p{
  margin-bottom:0;
  color:var(--mr-color-text-muted);
}

.showcase-decision{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:var(--mr-space-5);
  padding:var(--mr-space-4);
  border:1px solid var(--mr-line-strong);
  border-radius:var(--mr-radius-lg);
  background:var(--mr-color-surface);
  box-shadow:var(--mr-shadow-sm);
}

.showcase-decision__intro{
  display:flex;
  min-width:0;
  flex-direction:column;
}

.showcase-decision__intro p{
  margin-top:var(--mr-space-2);
  color:var(--mr-color-text-muted);
}

.showcase-decision__list{
  display:grid;
  gap:var(--mr-space-2);
  margin:0;
  padding:0;
  list-style:none;
}

.showcase-decision__list li{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--mr-space-2);
  align-items:start;
  min-width:0;
  padding-bottom:var(--mr-space-2);
  border-bottom:1px solid var(--mr-line-purple);
}

.showcase-decision__list li:last-child{
  padding-bottom:0;
  border-bottom:0;
}

.showcase-decision__list span{
  display:grid;
  width:2rem;
  height:2rem;
  place-items:center;
  color:var(--mr-color-dark);
  border-radius:50%;
  background:var(--mr-color-primary);
  font-family:var(--mr-font-mono);
  font-weight:var(--mr-weight-bold);
}

.showcase-decision__list p{
  margin-bottom:0;
  color:var(--mr-color-text-muted);
}

.showcase-decision__list strong{
  color:var(--mr-color-text);
}

.page-cta{
  padding:var(--mr-space-4);
  border:1px solid var(--mr-line-strong);
  border-radius:var(--mr-radius-lg);
  background:var(--mr-color-surface);
  box-shadow:var(--mr-shadow-md);
}

.page-cta__content{
  max-width:var(--mr-container-narrow);
}

.page-cta .c-badge{
  width:fit-content;
}

.page-cta .c-badge + h2{
  margin-top:var(--mr-space-2);
}

.page-cta p{
  margin-top:var(--mr-space-2);
  color:var(--mr-color-text-muted);
}

@media(max-width:768px){
  .showcase-hero__grid,
  .showcase-case,
  .showcase-ai-command,
  .showcase-decision{
    grid-template-columns:1fr;
  }

  .showcase-library__layout{
    grid-template-columns:1fr;
    grid-template-areas:
      "rail"
      "feed";
  }

  .showcase-rail__panel{
    position:static;
  }

  .showcase-rail .c-filter{
    display:flex;
  }

  .showcase-rail .c-filter__button{
    flex:1 1 auto;
  }

  .showcase-case--reverse .showcase-case__copy,
  .showcase-case--reverse .showcase-case__terminal{
    order:initial;
  }

  .showcase-ai-grid{
    grid-template-columns:1fr;
  }

  .showcase-decision{
    gap:var(--mr-space-3);
  }
}

@media(max-width:390px){
  .showcase-console__head .c-status{
    display:none;
  }

  .showcase-console__step{
    grid-template-columns:auto minmax(0,1fr);
  }

  .showcase-console__step b{
    grid-column:2;
  }

  .showcase-article{
    grid-template-columns:1fr;
  }

  .showcase-article__index{
    font-size:var(--mr-fs-1);
  }

  .showcase-article__footer{
    align-items:flex-start;
    flex-direction:column;
  }

  .showcase-observations{
    grid-template-columns:1fr;
  }

  .showcase-ai-card dl div{
    grid-template-columns:1fr;
    gap:.25rem;
  }

  .showcase-decision,
  .page-cta{
    padding:var(--mr-space-3);
  }

  .showcase-decision__list li{
    grid-template-columns:1fr;
  }
}
