:root{
  --bg:#08101d;
  --panel:#0b1a33;
  --ink:#e5e7eb;
  --muted:#9aa7b8;
  --teal:#22d3ee;
  --line:rgba(229,231,235,.14);
}

body.theme-b0009{background:radial-gradient(1000px 600px at 30% 0%, rgba(34,211,238,.16), transparent 55%), var(--bg); color:var(--ink);} 

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

.rail{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  width:72px;
  background:rgba(11,26,51,.76);
  border-right:1px solid var(--line);
  backdrop-filter:saturate(140%) blur(10px);
  z-index:40;
}
.rail a{display:flex; align-items:center; justify-content:center; height:56px; color:var(--muted); text-decoration:none;}
.rail a.is-active{color:var(--ink);} 

.drawer{
  position:fixed;
  top:0;
  left:72px;
  bottom:0;
  width:320px;
  background:rgba(11,26,51,.94);
  border-right:1px solid var(--line);
  transform:translateX(-110%);
  transition:transform .2s ease;
  z-index:35;
  padding:1rem;
}
.drawer.is-open{transform:translateX(0);} 

.shell{margin-left:72px; padding:1.25rem 1.25rem 0;}

.masonry{column-count:3; column-gap:1rem;}
.mcard{break-inside:avoid; margin:0 0 1rem; background:rgba(11,26,51,.86); border:1px solid var(--line); border-radius:14px; padding:1rem;}

.search{max-width:380px;}

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

a{color:var(--teal);} a:hover{text-decoration:underline;}

.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: 1100px){
  .masonry{column-count:2;}
}
@media (max-width: 720px){
  .masonry{column-count:1;}
  .shell{margin-left:0; padding:1rem;}
  .rail{display:none;}
  .drawer{left:0; width:86vw;}
}
