/* masonry.css — stacked gallery for mixed-height images/videos/X embeds (Kaede rule: keep original aspect ratios).
   <div class="masonry"><figure class="m-item"><img …></figure><figure class="m-item"><blockquote class="twitter-tweet">…</blockquote></figure></div> */
.masonry{columns:4 280px;column-gap:clamp(12px,1.4vw,20px)}
.m-item{break-inside:avoid;margin:0 0 clamp(12px,1.4vw,20px);border-radius:var(--radius,14px);overflow:hidden;background:rgba(255,255,255,.04);border:1px solid var(--line,rgba(255,255,255,.12));
  transform:rotate(var(--r,0deg));transition:transform .35s var(--ease-out,ease),box-shadow .35s}
.m-item img,.m-item video{width:100%;height:auto}
.m-item:hover{transform:rotate(0) translateY(-4px) scale(1.01);box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.m-item .twitter-tweet{margin:0!important}
.m-item figcaption{padding:.6rem .8rem;font:500 .75rem/1.3 var(--font-mono,monospace);color:var(--muted,#999)}
@media (max-width:560px){.masonry{columns:2 150px}}