/* ─── Экран «Магазин» (/store) на десктопе (2026-07-07) ───
   Store-стили живут в mobile-critical-*.css, который подключён с media="(max-width:900px)",
   поэтому на десктопе экран рендерился без стилей (замечание модерации ЮKassa).
   Ниже — десктопная копия тех же правил, scoped под .app-store-screen,
   чтобы не влиять на остальные desktop-страницы. Мобильную вёрстку не трогаем. */
@media (min-width: 901px) {
  .app-store-screen {
    /* верхний отступ = высота fixed .site-header (80px) + воздух */
    width: min(100%, 620px);
    margin: 0 auto;
    padding: 116px 14px 56px;
  }

  .app-store-screen .mobile-profile-top {
    display: none;
  }

  .app-store-screen .app-profile-title {
    margin: 10px 0 16px;
  }

  .app-store-screen .app-profile-title h1 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    color: #d99cff;
    font-size: 30px;
    line-height: 1.05;
    font-weight: 950;
  }

  .app-store-screen .app-profile-title p {
    margin: 0;
    color: #a7adba;
    font-size: 16px;
    line-height: 1.45;
  }

  .app-store-screen .app-profile-card,
  .app-store-screen .store-balance-card {
    border: 1px solid rgba(178, 181, 205, 0.22);
    border-radius: 20px;
    background: #15151d;
  }

  .app-store-screen .app-profile-card-pad {
    padding: 18px 16px;
    margin: 0 0 16px;
  }

  .app-store-screen .store-balance-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 16px;
    overflow: hidden;
  }

  .app-store-screen .store-balance-card > div {
    min-height: 112px;
    padding: 18px 16px;
  }

  .app-store-screen .store-balance-card > div + div {
    border-left: 1px solid rgba(246, 241, 232, 0.12);
  }

  .app-store-screen .store-balance-card span,
  .app-store-screen .store-balance-card strong,
  .app-store-screen .store-balance-card em {
    display: block;
  }

  .app-store-screen .store-balance-card span {
    color: #9ba2b2;
    font-size: 13px;
    font-weight: 950;
    text-transform: uppercase;
  }

  .app-store-screen .store-balance-card strong {
    margin: 8px 0;
    color: #f8fafc;
    font-size: 28px;
    line-height: 1;
    font-weight: 950;
  }

  .app-store-screen .store-balance-card em {
    color: #9ba2b2;
    font-size: 14px;
    font-style: normal;
  }

  .app-store-screen .store-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    margin-bottom: 16px;
    padding: 4px;
    border: 1px solid rgba(246, 241, 232, 0.14);
    border-radius: 14px;
    background: #121219;
  }

  .app-store-screen .store-tabs button {
    min-height: 48px;
    border: 0;
    border-radius: 12px;
    color: #9ba2b2;
    background: transparent;
    font-weight: 950;
    cursor: pointer;
  }

  .app-store-screen .store-tabs button.active {
    color: #fff;
    background: #5f5bf4;
  }

  .app-store-screen .store-note,
  .app-store-screen .store-status {
    color: #c7cbd5;
    line-height: 1.45;
  }

  .app-store-screen .store-status {
    display: grid;
    gap: 8px;
    border-color: rgba(80, 220, 150, 0.2);
    background: #0d2027;
  }

  .app-store-screen .store-product-list {
    display: grid;
    gap: 12px;
    margin-bottom: 14px;
  }

  .app-store-screen .store-product-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 92px;
    padding: 14px;
    border: 1px solid rgba(246, 241, 232, 0.14);
    border-radius: 18px;
    color: #f8fafc;
    background: #14141b;
    text-align: left;
    cursor: pointer;
  }

  .app-store-screen .store-product-card.active {
    border-color: #7067ff;
    box-shadow: 0 0 0 1px rgba(112, 103, 255, 0.55);
  }

  .app-store-screen .store-product-icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #ff812f, #ff4a2d);
    font-size: 24px;
  }

  .app-store-screen .store-product-main {
    min-width: 0;
  }

  .app-store-screen .store-product-main strong,
  .app-store-screen .store-product-main em {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .app-store-screen .store-product-main strong {
    font-size: 20px;
    font-weight: 950;
  }

  .app-store-screen .store-product-main em {
    color: #9ba2b2;
    font-style: normal;
    font-weight: 750;
  }

  .app-store-screen .store-product-card b {
    align-self: start;
    padding: 4px 8px;
    border-radius: 999px;
    background: #3b2d8f;
    color: #d8d3ff;
    font-size: 11px;
    text-transform: lowercase;
  }

  .app-store-screen .store-product-price {
    grid-column: 3;
    color: #fff;
    font-size: 18px;
    font-weight: 950;
  }

  .app-store-screen .store-purchase-btn {
    width: 100%;
    min-height: 58px;
    border: 0;
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(135deg, #8b5cf6, #6366f1);
    font-weight: 950;
    cursor: pointer;
  }
}

/* ═════════ DESIGN V2 — новый десктоп-дизайн главной (WEB Site/ 2026-07-08), скрытый флаг ?design=v2 ═════════ */
@media (min-width: 901px) {
  body.design-v2 { overflow: hidden; background: #0a0a0e; }
  body.design-v2 .site-header, body.design-v2 .site-footer,
  body.design-v2 .bottom-nav, body.design-v2 .mini-player,
  body.design-v2 .music-menu, body.design-v2 .music-menu-scrim { display: none !important; }
  body.design-v2 #app { padding: 0; max-width: none; }

  .dv2-shell {
    height: 100vh; display: flex; flex-direction: column; overflow: hidden;
    background: #0a0a0e; color: #f3f3f6;
    font-family: "Onest", Inter, ui-sans-serif, system-ui, sans-serif;
    position: fixed; inset: 0; z-index: 60;
  }
  .dv2-loading { padding: 40px; color: #82828f; font-size: 15px; }
  .dv2-shell { flex-direction: row; flex-wrap: wrap; }
  .dv2-side { width: clamp(212px, 17vw, 252px); flex: 0 0 clamp(212px, 17vw, 252px); height: calc(100vh - 84px); background: #0c0c11; border-right: 1px solid rgba(255,255,255,.06); padding: 18px 14px; display: flex; flex-direction: column; gap: 14px; box-sizing: border-box; overflow-y: auto; }
  .dv2-col { flex: 1; min-width: 0; height: calc(100vh - 84px); display: flex; flex-direction: column; }
  .dv2-player { flex: 0 0 100%; height: 84px; background: #0c0c11; border-top: 1px solid rgba(255,255,255,.07); padding: 0 20px; display: flex; align-items: center; gap: 18px; box-sizing: border-box; }

  /* ── Sidebar ── */
  .dv2-brand { display: flex; align-items: center; gap: 11px; text-decoration: none; }
  .dv2-brand-badge { width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(140deg,#7c6cf5,#e0517f); box-shadow: 0 6px 18px rgba(124,108,245,.35); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-family: "Spectral", Georgia, serif; font-weight: 600; font-size: 20px; }
  .dv2-brand-main { display: flex; flex-direction: column; }
  .dv2-brand-main b { color: #f5f5f8; font-family: "Spectral", Georgia, serif; font-weight: 600; font-size: 17px; }
  .dv2-brand-main i { font-style: normal; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: #6a6a77; }
  .dv2-create-btn { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border-radius: 12px; background: linear-gradient(135deg,#ff7a45,#ff5a2e); color: #fff; font-weight: 600; font-size: 14px; text-decoration: none; box-shadow: 0 8px 20px rgba(255,90,46,.28); }
  .dv2-create-btn:hover { filter: brightness(1.06); }
  .dv2-nav { display: flex; flex-direction: column; gap: 2px; }
  .dv2-nav-item { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 10px; color: #a6a6b2; font-size: 14px; font-weight: 500; text-decoration: none; }
  .dv2-nav-label { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dv2-nav-item:hover { background: #15151d; color: #f0f0f4; }
  .dv2-nav-item.active { background: rgba(124,108,245,.15); color: #fff; font-weight: 600; }
  .dv2-nav-item.active .dv2-ic { color: #a99cff; }
  .dv2-nav-group { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #585863; padding: 6px 12px 0; }
  .dv2-profile-card { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid rgba(255,255,255,.07); border-radius: 12px; background: #101017; text-decoration: none; }
  .dv2-profile-card:hover { border-color: rgba(255,255,255,.14); }
  /* Блок «Мы на площадках» внизу сайдбара — фирменные значки, приподнятые тайлы с обводкой. */
  .dv2-side-platforms { margin-top: auto; padding: 13px 11px 14px; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; background: linear-gradient(160deg, rgba(34,28,54,.5) 0%, rgba(15,15,22,.55) 100%); box-shadow: 0 14px 30px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.05); }
  .dv2-side-platforms + .dv2-profile-card { margin-top: 0; }
  .dv2-side-plat-title { font-size: 10px; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; color: #74747f; text-align: center; margin: 0 0 11px; }
  /* 7 площадок (с App Store, 2026-07-29): flex-раскладка 4+3 с ЦЕНТРОВКОЙ второго ряда —
     grid repeat(3) давал 3+3+1 («сирота» слева, ломала симметрию блока). */
  .dv2-side-plat-grid { display: flex; flex-wrap: wrap; gap: 9px; justify-content: center; }
  .dv2-side-plat { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 12px; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: #12121a; box-shadow: 0 0 0 1px rgba(255,255,255,.13), 0 5px 13px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.07); transition: transform .15s ease, box-shadow .15s ease; }
  .dv2-side-plat svg { width: 106%; height: 106%; display: block; }
  .dv2-side-plat:hover { transform: translateY(-3px); box-shadow: 0 0 0 1px rgba(255,255,255,.3), 0 12px 22px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.1); }
  .dv2-avatar { width: 34px; height: 34px; border-radius: 9px; background: linear-gradient(140deg,#4f8ef0,#22b8a6); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 13px; overflow: hidden; flex: 0 0 34px; }
  .dv2-avatar img { width: 100%; height: 100%; object-fit: cover; }
  .dv2-profile-main { display: flex; flex-direction: column; min-width: 0; flex: 1; }
  .dv2-profile-main b { color: #f2f2f6; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dv2-profile-main i { font-style: normal; font-size: 11px; color: #7a7a86; }
  .dv2-profile-gear { color: #7a7a86; }

}