/* Explosion types (CIT Tools, 15 Oct 2026). Builds on /CITtools/assets/ids/ids.css. */
.ex-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.ex-grid a{padding:8px 8px 10px}
.ex-grid img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;margin:0 0 6px;border-radius:6px;background:#1c2023}
.ex-grid b{font-size:24px;line-height:1.15}
.ex-grid .ex-note{display:block;margin-top:4px;font-size:12px;color:var(--warn)}
.ex-grid span{font-size:14px;color:var(--text)}
.group h2{margin-top:22px}
p+.code{margin-top:10px}
.code+p{margin-top:14px}
.code{max-width:640px}
.page > p,.sources ul{max-width:40em}
.ex-hero{margin:16px 0 0;max-width:880px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#101315}
.ex-hero img{display:block;width:100%;height:auto;aspect-ratio:auto 16/9;object-fit:contain}
.ex-frames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px;max-width:880px}
.ex-frames figure{margin:0}
.ex-frames a{display:block}
.ex-frames img{display:block;width:100%;height:auto;aspect-ratio:auto 16/9;object-fit:contain;border-radius:10px;border:1px solid var(--line);background:#101315}
.ex-shot{font-size:12px;margin-top:6px}
@media (max-width:620px){
  .ex-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .ex-grid b{font-size:21px}
  .ex-frames{gap:6px}
  .ex-frames img{border-radius:6px}
  .copy{min-width:72px;min-height:44px;font-size:14px}
  .pager .pg{display:flex;align-items:center;min-height:44px}
  .more-links a{display:inline-flex;align-items:center;min-height:44px}
}