.apps-catalog { display: grid; gap: 3rem; min-width: 0; }
.apps-catalog__header { display: flex; align-items: center; gap: 1.25rem; }
.apps-catalog__header h2, .apps-catalog__header p { margin: .3rem 0; }
.apps-catalog__icon { width: 5rem; height: 5rem; object-fit: contain; border-radius: 1rem; flex-shrink: 0; }
.apps-catalog__platforms { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr)); gap: 1.5rem; }
.apps-catalog__platform { min-width: 0; border: 1px solid var(--color-border); border-radius: 1rem; padding: clamp(1rem, 3vw, 1.5rem); }
.apps-catalog__platform h3 { margin-top: 0; }
.apps-catalog__downloads { display: flex; flex-wrap: wrap; gap: 1rem; margin-block: 1.25rem; }
.apps-catalog__downloads > div { min-width: 0; max-width: 100%; }
.apps-catalog__downloads .apps-catalog__button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .75rem 1rem; border: 1px solid var(--color-border); border-radius: .5rem; background: var(--bg-elev); color: var(--text); font-weight: 700; text-decoration: none; white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
.apps-catalog__button:hover { background: var(--bg-elev-2); }
.apps-catalog__button:focus-visible, .apps-catalog__screenshots a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.apps-catalog__header > div { min-width: 0; overflow-wrap: anywhere; }
.apps-catalog__version, .apps-catalog figcaption { font-size: .875rem; opacity: .8; margin-block: .5rem; }
.apps-catalog__copy { white-space: pre-line; overflow-wrap: anywhere; }
.apps-catalog__screenshots { display: flex; gap: 1rem; overflow-x: auto; padding: .25rem .25rem .75rem; scroll-snap-type: x proximity; }
.apps-catalog__screenshots figure { margin: 0; flex: 0 0 auto; max-width: min(22rem, 90%); scroll-snap-align: start; }
.apps-catalog__screenshots img { display: block; width: auto; height: auto; max-height: 18rem; max-width: 100%; object-fit: contain; border-radius: .5rem; }
.apps-catalog__screenshots:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
@media (max-width: 420px) { .apps-catalog__header { align-items: flex-start; } .apps-catalog__icon { width: 3.5rem; height: 3.5rem; } }