/* A small sticky-language bonus, not a primary learning section. */
.language-bonus{
  border:1px solid rgba(41,39,45,.1);
  border-radius:20px;
  background:linear-gradient(135deg,#fff,#f8f7ff,#eef9ff);
  box-shadow:0 10px 28px rgba(93,72,120,.08);
  overflow:hidden;
}

.language-bonus[hidden]{
  display:none;
}

.language-bonus summary{
  display:flex;
  gap:.7rem;
  align-items:center;
  padding:.85rem .9rem;
  cursor:pointer;
  list-style:none;
  user-select:none;
}

.language-bonus summary::-webkit-details-marker{
  display:none;
}

.language-bonus summary::after{
  content:"+";
  margin-left:auto;
  font-size:1.2rem;
  font-weight:800;
  line-height:1;
  color:#655579;
}

.language-bonus[open] summary::after{
  content:"–";
}

.language-bonus__sparkle{
  display:grid;
  place-items:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:linear-gradient(145deg,var(--ice),var(--pink));
  font-weight:800;
}

.language-bonus summary span:nth-child(2){
  display:grid;
  gap:.08rem;
}

.language-bonus summary strong{
  font-size:.9rem;
}

.language-bonus summary small{
  color:var(--muted);
  font-size:.72rem;
  line-height:1.35;
}

.language-bonus__content{
  padding:0 .9rem .95rem;
  border-top:1px solid rgba(41,39,45,.08);
}

.language-bonus__name{
  margin:.85rem 0 .6rem;
  font-size:1.05rem;
}

.language-bonus__name strong{
  font-size:1.25rem;
}

.language-bonus__parts{
  display:grid;
  gap:.35rem;
  margin:.65rem 0;
}

.language-bonus__parts p{
  display:grid;
  grid-template-columns:minmax(48px,.6fr) minmax(76px,.8fr) 1.5fr;
  gap:.4rem;
  margin:0;
  padding:.45rem .55rem;
  border-radius:12px;
  background:rgba(255,255,255,.75);
  font-size:.78rem;
}

.language-bonus__content>p{
  font-size:.8rem;
}

.language-bonus__closer{
  margin-bottom:0;
  color:#655579;
  font-weight:700;
}

.article-sources-footer{
  margin:2.5rem 0 1rem;
  padding-top:1.4rem;
  border-top:1px solid var(--line);
}

.article-sources-footer details{
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.7);
}

.article-sources-footer summary{
  padding:.9rem 1rem;
  cursor:pointer;
  font-weight:800;
}

.article-sources-footer [data-article-sources]{
  padding:0 1rem 1rem;
  color:var(--muted);
}

.article-sources-footer ul{
  margin:.5rem 0 0;
  padding-left:1.2rem;
}

@media(max-width:899px){
  .language-bonus{
    margin:1rem 0;
  }
}

@media(max-width:520px){
  .language-bonus__parts p{
    grid-template-columns:1fr;
    gap:.05rem;
  }
}