:root{
  --bg:#fbfbff;
  --ink:#0f172a;
  --muted:#475569;
  --line:rgba(15,23,42,.12);
  --c1:#ff3d71;
  --c2:#2dd4bf;
  --c3:#60a5fa;
}

body.theme-b0013{background:var(--bg); color:var(--ink);} 

#logo img{height:42px; width:auto; display:block;}

.ribbon{
  height:10px;
  background:linear-gradient(90deg, var(--c1), var(--c2), var(--c3));
}

.masonry{column-count:3; column-gap:1rem;}
.cardx{break-inside:avoid; margin:0 0 1rem; border:1px solid var(--line); border-radius:16px; padding:1rem; background:#fff; box-shadow:0 10px 30px rgba(15,23,42,.06);} 

.filterbar{display:flex; gap:.5rem; flex-wrap:wrap; align-items:center;}

.bottom-tabs{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(150%) blur(10px);
  border-top:1px solid var(--line);
  z-index:40;
}
.bottom-tabs a{flex:1; text-align:center; padding:.75rem .5rem; color:var(--muted); text-decoration:none; font-size:.9rem;}
.bottom-tabs a.is-active{color:var(--ink); font-weight:700;}

.padbottom{padding-bottom:86px;}

#footer{margin-top:2rem; padding:1.75rem 0; border-top:1px solid var(--line);} 

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

@media (max-width: 980px){
  .masonry{column-count:1;}
}
@media (min-width: 981px) and (max-width: 1200px){
  .masonry{column-count:2;}
}
