/* ==========================================================================
   css/apps/app-store-modal.css
   Split from app.html (build 2026.10.08.9-beta), original lines 8040-8053.
   Rules are in their ORIGINAL order; load order is defined in index.html.
   ========================================================================== */
/* The App Store gets a wider modal than the other channel modals. */
#appsModal .ch-modal { width:960px; }
.app-store-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
@media (min-width:820px){ #appsModal .app-store-grid { grid-template-columns:repeat(3,1fr); } }
.app-store-card { display:flex; flex-direction:column; gap:12px; padding:18px 18px 16px; border:1px solid var(--border); border-radius:14px; background:var(--bg-surface); transition:border-color .15s, transform .15s; }
.app-store-card:hover { border-color:var(--accent); transform:translateY(-2px); }
.app-store-top { display:flex; align-items:center; gap:12px; }
.app-store-icon { width:48px; height:48px; border-radius:13px; background:linear-gradient(135deg,var(--accent-dim),transparent); color:var(--accent); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.app-store-name { font-size:15px; font-weight:700; color:var(--text-primary); }
.app-store-cat { font-size:11px; font-weight:600; color:var(--accent); text-transform:uppercase; letter-spacing:.04em; }
.app-store-desc { font-size:12.5px; color:var(--text-muted); line-height:1.5; flex:1; }
.app-store-input { width:100%; box-sizing:border-box; background:var(--bg-void); border:1px solid var(--border-strong); border-radius:8px; padding:8px 10px; color:var(--text-primary); font-size:13px; outline:none; }
.app-store-add { width:100%; padding:11px; }
@media (max-width:560px){ .app-store-grid { grid-template-columns:1fr; } }