/* MUSIC FOLDER — install | исходник: 4444..4492 */

/* ═══ установка приложения (PWA) ═══ */
.install-btn{position:relative;display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border-radius:0;
border:1px solid transparent;cursor:pointer;font-family:var(--fb);font-size:12.5px;font-weight:800;letter-spacing:.02em;color:var(--text);
background:linear-gradient(180deg,rgba(19,21,38,.92),rgba(12,13,24,.94)) padding-box,
linear-gradient(135deg,var(--c1),var(--c2)) border-box;
transition:transform .2s,box-shadow .3s;
clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px))}
.install-btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px -8px color-mix(in srgb,var(--c1) 60%,transparent)}
.install-btn:active{transform:scale(.96)}
.install-btn svg{color:var(--c2)}
.app-card{position:relative;overflow:hidden;border-radius:24px;padding:24px 26px;margin-bottom:30px;border:1px solid transparent;
background:
radial-gradient(130% 170% at 0% 0%,color-mix(in srgb,var(--c1) 20%,transparent),transparent 52%),
radial-gradient(130% 170% at 100% 100%,color-mix(in srgb,var(--c2) 16%,transparent),transparent 52%),
linear-gradient(180deg,rgba(19,21,38,.92),rgba(10,11,22,.95)) padding-box,
linear-gradient(135deg,color-mix(in srgb,var(--c1) 55%,transparent),rgba(255,255,255,.08) 45%,color-mix(in srgb,var(--c2) 55%,transparent)) border-box;
box-shadow:0 30px 80px -40px rgba(0,0,0,.9)}
.app-card-in{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.app-head{display:flex;align-items:center;gap:16px;flex:1 1 260px;min-width:0}
.app-ico{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;
background:linear-gradient(135deg,var(--c1),var(--c2));
box-shadow:0 10px 28px -8px color-mix(in srgb,var(--c1) 70%,transparent)}
.app-head-txt b{display:block;font-family:var(--fd);font-weight:700;font-size:16px}
.app-head-txt span{display:block;font-size:13px;color:var(--muted);font-weight:600;margin-top:4px;max-width:42ch}
.app-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1 1 340px}
.app-tile{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:16px;cursor:pointer;text-align:left;color:var(--text);
background:rgba(255,255,255,.05);border:1px solid var(--line);font-family:var(--fb);
transition:border-color .2s,transform .2s,box-shadow .25s}
.app-tile:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--c2) 50%,transparent);
box-shadow:0 14px 34px -14px color-mix(in srgb,var(--c2) 55%,transparent)}
.app-tile:active{transform:scale(.98)}
.app-tile-ico{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#fff;
background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 45%,transparent),color-mix(in srgb,var(--c2) 45%,transparent))}
.app-tile-txt{min-width:0}
.app-tile-txt b{display:block;font-size:14px;font-weight:800}
.app-tile-txt span{display:block;font-size:11.5px;color:var(--muted);font-weight:700;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app-tile-go{margin-left:auto;flex:none;color:var(--c2);font-weight:800;font-size:16px;transition:transform .2s}
.app-tile:hover .app-tile-go{transform:translateX(3px)}
.app-done{display:none;align-items:center;gap:14px;flex:1 1 340px;padding:14px 18px;border-radius:16px;
background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.3)}
.app-done-ico{font-size:22px;flex:none}
.app-done-txt b{display:block;font-size:14px;font-weight:800}
.app-done-txt span{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-top:2px}
body.app-installed .app-tiles{display:none}
body.app-installed .app-done{display:flex}
/* скрываем только кнопку «Установить»; карточка остаётся и показывает статус */
body.app-installed #btnInstall {
display: none !important;
}