.icon-atlas { padding-block: 2rem 5rem; }
.icon-atlas > header { max-width: 75ch; }
.icon-atlas-search { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; margin-block:2rem 1rem; }
.icon-atlas-search input[type=search] { flex:1; min-width:12rem; }
.icon-atlas-nav { display:flex; flex-wrap:wrap; gap:.5rem; }
.icon-atlas-jump > summary { cursor:pointer; padding-block:.75rem; color:var(--sc-gold); }
.icon-atlas-section { margin-top:3rem; scroll-margin-top:6rem; }
.icon-atlas-section h2 { margin-bottom:1rem; }
.icon-atlas-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr)); gap:1rem; }
.icon-atlas-card { border:1px solid var(--sc-edge); background:var(--sc-panel); padding:1rem; min-width:0; }
.icon-atlas-card h3 { font-size:1rem; margin:0 0 .4rem; }
.icon-atlas-card code { font-size:.75rem; overflow-wrap:anywhere; opacity:.7; }
.icon-atlas-card .sc-kicker { margin-top:1rem; }
.icon-atlas-states { display:flex; flex-wrap:wrap; gap:.6rem; margin-block:.8rem; }
.icon-atlas-states figure { margin:0; text-align:center; }
.icon-atlas-states a { display:grid; place-items:center; width:80px; height:80px; background:#05080b; border:1px solid var(--sc-edge); }
.icon-atlas-states img { object-fit:contain; max-width:72px; max-height:68px; }
.icon-atlas-states figcaption { font-size:.7rem; margin-top:.3rem; }
.icon-atlas-card details { font-size:.75rem; overflow-wrap:anywhere; }
.icon-atlas-card summary { cursor:pointer; padding-block:.5rem; }
.icon-atlas-card details a { text-decoration:underline; }