/* Consistent feature visibility while live feature settings are loading. */
html:not(.yp-features-ready) .nav-item[data-nav="music"] { display:none; }
.discover-welcome { padding:1.25rem; margin:.75rem; border:1px solid var(--border); border-radius:18px; background:var(--surface); }
.discover-welcome h2 { font-size:1.25rem; margin:0 0 .5rem; }
.discover-welcome p { color:var(--muted); line-height:1.6; margin:0 0 1rem; }
.discover-welcome button { min-height:44px; padding:.65rem 1.25rem; }
.channel-description { font-size:.82rem; line-height:1.4; margin-top:.25rem; color:var(--muted); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.channel-meta { font-size:.72rem; color:var(--muted); margin-top:.3rem; }
.channel-preview { font-size:.8rem; line-height:1.4; margin-top:.4rem; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.channel-preview:empty { display:none; }
.settings-group > summary { cursor:pointer; list-style:none; min-height:52px; display:flex; align-items:center; justify-content:space-between; padding:.9rem 1rem; margin:0; }
.settings-group > summary::after { content:'+'; font-size:1.2rem; }
.settings-group[open] > summary::after { content:'−'; }
.settings-group-body { border-top:1px solid var(--border); }
.settings-group .settings-edit-btn { min-height:40px; }
.pwa-ib-close { min-width:44px; min-height:44px; justify-content:center; }
.pwa-install-banner { position:relative; inset:auto; transform:none; display:none; margin:.75rem auto; box-shadow:none; }
.pwa-install-banner.show { display:flex; }

.discover-filters { display:flex; gap:.4rem; padding:.25rem .75rem .75rem; flex-wrap:wrap; }
.discover-filters button { min-height:44px; border:1px solid var(--border); background:var(--surface); color:var(--text); padding:.5rem .8rem; border-radius:22px; font:inherit; font-size:.8rem; cursor:pointer; }
.discover-filters button[aria-pressed="true"] { background:var(--accent); color:white; }

/* Entrance animation transforms must not cancel desktop centering. */
@media (min-width:768px) { .screen.active { animation:none; transform:translateX(-50%) !important; } }
