/* 🛍 «Магазин работ» (workshop.js, флаг /me.shop) — «Тёплая сцена»: бордо, золото, бархат.
   Текст не меньше 14px, кнопки не ниже 44px. Префикс wsh- (старый магазин бота — shop-). */
.wsh-screen { padding: calc(var(--safe-t, 0px) + 10px) 14px 110px; color: #fbf1de; }
.wsh-top { display: flex; align-items: center; gap: 10px; }
.wsh-back { min-width: 44px; min-height: 44px; border: 0; background: none; color: #f2c46d; font-size: 24px; cursor: pointer; }
.wsh-h { flex: 1; min-width: 0; margin: 0; font: 700 20px/1.15 Georgia, "Times New Roman", serif; color: #fbf1de; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsh-pill { min-height: 44px; padding: 6px 14px; border-radius: 999px; border: 1.5px solid rgba(242,196,109,.5);
  background: rgba(242,196,109,.1); color: #f7d58c; font: inherit; font-size: 15px; font-weight: 800; cursor: pointer; white-space: nowrap; }
.wsh-sub { margin: 4px 0 12px; font-size: 15px; color: #cbb89c; }
.wsh-chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin: 0 -14px 10px; padding-left: 14px; padding-right: 14px; scrollbar-width: none; }
.wsh-chips::-webkit-scrollbar { display: none; }
.wsh-chip { flex: none; min-height: 44px; padding: 6px 16px; border-radius: 999px; border: 1.5px solid rgba(242,196,109,.32);
  background: rgba(255,238,208,.055); color: #e3d3ba; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.wsh-chip.on { background: linear-gradient(160deg, #f7d58c, #e2a94a); color: #2a1408; border-color: transparent; }

.wsh-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wsh-card { position: relative; display: flex; flex-direction: column; padding: 0; border-radius: 18px; overflow: hidden; text-align: left;
  border: 1.5px solid rgba(242,196,109,.3); background: #1a0b0f; color: #fbf1de; font: inherit; cursor: pointer; min-height: 44px; }
.wsh-card:active { transform: scale(.98); }
.wsh-skel { aspect-ratio: 3 / 4; background: linear-gradient(110deg, #22100f 30%, #2f1518 50%, #22100f 70%); background-size: 200% 100%;
  animation: wsh-sh 1.3s linear infinite; cursor: default; }
@keyframes wsh-sh { to { background-position: -200% 0; } }
.wsh-cov { position: relative; display: block; width: 100%; aspect-ratio: 1 / 1; background: radial-gradient(circle at 30% 30%, #7a2433, #2a0d13); overflow: hidden; }
.wsh-cov img { display: block; width: 100%; height: 100%; object-fit: cover; }
.wsh-cov-empty::after { content: "✨"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 40px; opacity: .7; }
.wsh-cov-audio.wsh-cov-empty::after { content: "🎵"; }
.wsh-cov-video.wsh-cov-empty::after { content: "🎬"; }
.wsh-kind { position: absolute; top: 8px; left: 8px; width: 30px; height: 30px; border-radius: 10px; display: flex; align-items: center; justify-content: center;
  background: rgba(17,7,8,.72); font-size: 16px; }
.wsh-model { position: absolute; left: 8px; bottom: 8px; max-width: calc(100% - 16px); padding: 3px 9px; border-radius: 999px;
  background: rgba(17,7,8,.78); border: 1px solid rgba(242,196,109,.4); color: #f7d58c; font-size: 14px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsh-bought { position: absolute; top: 8px; right: 8px; padding: 3px 10px; border-radius: 999px; background: linear-gradient(160deg, #f7d58c, #e2a94a);
  color: #2a1408; font-size: 14px; font-weight: 800; }
.wsh-mine { background: rgba(17,7,8,.78); color: #f7d58c; border: 1px solid rgba(242,196,109,.5); }
.wsh-tx { display: flex; flex-direction: column; gap: 6px; padding: 9px 11px 11px; }
.wsh-title { font-size: 16px; font-weight: 800; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wsh-title-sm { font-size: 14px; font-weight: 600; color: #e3d3ba; -webkit-line-clamp: 3; }
.wsh-row { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.wsh-rep { font-size: 14px; color: #cbb89c; }
.wsh-price { font-size: 15px; font-weight: 800; color: #f2c46d; }
.wsh-price.is-free { color: #9fd89a; }
.wsh-empty { margin: 24px 6px; font-size: 16px; color: #cbb89c; text-align: center; line-height: 1.4; }
.wsh-more { display: block; width: 100%; min-height: 48px; margin-top: 14px; }

/* Шторки */
.wsh-sheet { max-height: calc(100% - 24px); overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: radial-gradient(90% 40% at 50% 0%, rgba(242,196,109,.14), transparent 70%), linear-gradient(175deg, #3a0f18, #1a0b0f 55%, #110708);
  border-top: 1.5px solid rgba(242,196,109,.55); color: #fbf1de; }
.wsh-sheet .shr-head strong { font: 700 22px/1.2 Georgia, "Times New Roman", serif; color: #fbf1de; }
.wsh-body { display: flex; flex-direction: column; gap: 12px; }
.wsh-load, .wsh-err { font-size: 16px; color: #cbb89c; padding: 12px 0; }
.wsh-err { color: #f3a6a6; }
.wsh-media { position: relative; border-radius: 18px; overflow: hidden; background: #1a0b0f; border: 1.5px solid rgba(242,196,109,.3); }
.wsh-media img, .wsh-media video { display: block; width: 100%; max-height: 52vh; object-fit: contain; background: #0d0506; }
.wsh-media audio { display: block; width: 100%; min-height: 44px; }
.wsh-media-ic { height: 160px; display: flex; align-items: center; justify-content: center; font-size: 56px; }
.wsh-author { display: flex; align-items: center; gap: 10px; }
.wsh-ava { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; flex: none; display: flex; align-items: center; justify-content: center;
  border: 2px solid #f2c46d; background: linear-gradient(160deg, #6e1e2a, #3a0f17); font: 700 18px Georgia, serif; color: #f7d58c; }
.wsh-ava img { width: 100%; height: 100%; object-fit: cover; }
.wsh-author-name { font-size: 17px; font-weight: 800; }
.wsh-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.wsh-tag { padding: 4px 10px; border-radius: 999px; border: 1px solid rgba(242,196,109,.45); color: #f7d58c; font-size: 14px; font-weight: 700; }
.wsh-stat { font-size: 15px; color: #e3d3ba; }
.wsh-prompt { border-radius: 16px; padding: 12px 14px; background: rgba(255,238,208,.06); border: 1.5px solid rgba(242,196,109,.28); }
.wsh-prompt-h { font-size: 14px; font-weight: 800; color: #f2c46d; margin-bottom: 6px; }
.wsh-prompt-tx { font-size: 16px; line-height: 1.45; white-space: pre-wrap; word-break: break-word; user-select: text; -webkit-user-select: text; }
.wsh-prompt.is-locked .wsh-prompt-tx { filter: blur(6px); user-select: none; -webkit-user-select: none; pointer-events: none; }
.wsh-copy { margin-top: 10px; min-height: 44px; font-size: 15px; }
.wsh-plaque { padding: 10px 14px; border-radius: 14px; background: rgba(159,216,154,.12); border: 1px solid rgba(159,216,154,.45); color: #c9efc4; font-size: 15px; font-weight: 700; }
.wsh-plaque-mine { background: rgba(242,196,109,.1); border-color: rgba(242,196,109,.45); color: #f7d58c; }
.wsh-acts { display: flex; flex-direction: column; gap: 10px; }
.wsh-btn { width: 100%; min-height: 54px; font-size: 17px; }
.wsh-danger { color: #f3a6a6 !important; border-color: rgba(243,166,166,.45) !important; }
.wsh-note { margin: 0; font-size: 14px; line-height: 1.4; color: #cbb89c; text-align: center; }
.wsh-sheet .primary-btn { background: linear-gradient(160deg, #f7d58c, #e2a94a); color: #2a1408; border: 0; border-radius: 16px; font-weight: 800; cursor: pointer; }
.wsh-sheet .primary-btn:disabled { opacity: .55; }
.wsh-sheet .outline-btn { background: transparent; color: #f2c46d; border: 1.5px solid rgba(242,196,109,.45); border-radius: 16px; font-weight: 700; cursor: pointer; }

/* Форма «Выставить» */
.wsh-form-prev { width: 100%; max-height: 200px; object-fit: cover; border-radius: 16px; border: 1.5px solid rgba(242,196,109,.3); }
.wsh-label { display: flex; flex-direction: column; gap: 6px; font-size: 15px; font-weight: 700; color: #e3d3ba; }
.wsh-input { min-height: 50px; padding: 8px 14px; border-radius: 14px; font: inherit; font-size: 17px; color: #fbf1de;
  background: rgba(255,238,208,.08); border: 1.5px solid rgba(242,196,109,.35); box-sizing: border-box; width: 100%; }
.wsh-input:focus { outline: none; border-color: #f2c46d; box-shadow: 0 0 0 3px rgba(242,196,109,.2); }
.wsh-count { align-self: flex-end; margin-top: -6px; font-size: 14px; color: #cbb89c; }
.wsh-stepper { display: flex; gap: 10px; align-items: center; }
.wsh-step { flex: none; width: 54px; min-height: 50px; border-radius: 14px; border: 1.5px solid rgba(242,196,109,.45); background: rgba(242,196,109,.1);
  color: #f7d58c; font-size: 24px; font-weight: 800; cursor: pointer; }
.wsh-price-in { text-align: center; font-weight: 800; }

/* «Доход от магазина» */
.wsh-total { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 14px; border-radius: 18px;
  background: linear-gradient(160deg, rgba(247,213,140,.2), rgba(226,169,74,.08)); border: 1.5px solid rgba(242,196,109,.5); }
.wsh-total-l { font-size: 15px; color: #e3d3ba; }
.wsh-total-n { font: 700 34px/1.1 Georgia, "Times New Roman", serif; color: #f7d58c; }
.wsh-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.wsh-stat-box { display: flex; flex-direction: column; align-items: center; padding: 10px 6px; border-radius: 14px; background: rgba(255,238,208,.055);
  border: 1px solid rgba(242,196,109,.26); }
.wsh-stat-box b { font-size: 19px; color: #fbf1de; }
.wsh-stat-box span { font-size: 14px; color: #cbb89c; }
.wsh-sec { margin: 6px 0 0; font-size: 15px; font-weight: 800; color: #f2c46d; }
.wsh-list { display: flex; flex-direction: column; gap: 8px; }
.wsh-li { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 8px 12px; border-radius: 16px; border: 1px solid rgba(242,196,109,.28);
  background: rgba(255,238,208,.05); color: #fbf1de; font: inherit; text-align: left; cursor: pointer; }
.wsh-li.is-off { opacity: .6; }
.wsh-li-th { width: 48px; height: 48px; flex: none; border-radius: 12px; overflow: hidden; display: flex; align-items: center; justify-content: center;
  background: #2a1014; font-size: 22px; }
.wsh-li-th img { width: 100%; height: 100%; object-fit: cover; }
.wsh-li-mid { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.wsh-li-t { font-size: 16px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsh-li-s { font-size: 14px; color: #cbb89c; }
.wsh-li-earn { flex: none; font-size: 16px; font-weight: 800; color: #9fd89a; }
.wsh-pick-grid .wsh-cov { aspect-ratio: 4 / 3; }

/* Кнопка у своей работы и в профиле */
.history-viewer-sell-btn { min-height: 48px; padding: 8px 16px; border-radius: 16px; border: 1.5px solid rgba(242,196,109,.55);
  background: rgba(242,196,109,.12); color: #f7d58c; font: inherit; font-size: 16px; font-weight: 800; cursor: pointer; }
.history-viewer-sell-btn[hidden], #navWorkshop[hidden], .wsh-prof-btn[hidden] { display: none !important; }
.wsh-prof-btn { min-height: 48px; font-size: 16px; }
/* Вкладка «🛍 Магазин» видна → панель делится поровну на все видимые вкладки (иначе 6-я ушла бы на новую строку). */
body.wsh-nav .bottom-nav { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }

/* #1373: плашка «🆕 Новое» (48 ч) — за флагом */
.wsh-new { position: absolute; right: 8px; bottom: 40px; padding: 4px 10px; border-radius: 999px; background: linear-gradient(180deg, #f6d58b, #e0a43a); color: #1b0c10; font-size: 14px; font-weight: 800; line-height: 1.2; box-shadow: 0 2px 8px rgba(0,0,0,.35); z-index: 2; }

/* #1373: золотой счётчик новинок на «Магазине» */
#navWorkshop { position: relative; }
#navWorkshop .wsh-cnt { position: absolute; top: 2px; left: calc(50% + 6px); min-width: 20px; height: 20px; padding: 0 5px; box-sizing: border-box; border-radius: 10px; background: linear-gradient(180deg, #f6d58b, #e0a43a); color: #1b0c10; font-size: 14px; font-weight: 800; line-height: 20px; font-style: normal; text-align: center; box-shadow: 0 0 0 2px #1b0c10, 0 2px 6px rgba(0,0,0,.4); pointer-events: none; }

/* #1398: превью лотов до покупки */
.wsh-cplay { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3; min-width: 44px; height: 44px; padding: 0 14px; border-radius: 22px; border: 1.5px solid rgba(242,196,109,.8); background: rgba(27,12,16,.78); color: #fbf1de; font-size: 15px; font-weight: 800; display: flex; align-items: center; gap: 6px; cursor: pointer; }
.wsh-cplay i { font-style: normal; color: #f2c46d; font-size: 16px; }
.wsh-cplay.is-end { opacity: .7; }
.wsh-pplay { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; margin-top: 10px; border-radius: 14px; border: 0; background: linear-gradient(180deg, #f6d58b, #e0a43a); color: #1b0c10; font-size: 17px; font-weight: 800; cursor: pointer; }
.wsh-pplay i { font-style: normal; }
.wsh-prevnote { margin: 8px 0 0; font-size: 14px; line-height: 1.35; color: #c9bba3; }
.wsh-prevnote.is-end { color: #f2c46d; font-weight: 700; }
.wsh-media .wsh-pplay { width: calc(100% - 24px); margin: 12px 12px 0; }
.wsh-media .wsh-prevnote { margin: 8px 12px 12px; }

/* ───── #1478: вкладки сортировки + фильтр вида, карточка работы ───── */
.wsh-sorts .wsh-chip { flex: 1 1 0; padding: 6px 8px; text-align: center; white-space: nowrap; }
.wsh-cats { margin-bottom: 12px; }
.wsh-chip-s { font-size: 14px; font-weight: 600; padding: 6px 14px; background: transparent; }
.wsh-chip-s.on { background: rgba(242,196,109,.2); color: #f7d58c; border-color: rgba(242,196,109,.85); }
.wsh-newdot { position: absolute; top: 12px; right: 12px; width: 12px; height: 12px; border-radius: 50%; background: #f6d58b; box-shadow: 0 0 0 2px rgba(17,7,8,.75), 0 0 8px rgba(246,213,139,.7); z-index: 2; }
.wsh-by { font-size: 14px; color: #cbb89c; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsh-pricehint, .sp2-note.sp2-pricehint { color: #9a8f82; text-align: left; }
.wsh-row { flex-wrap: wrap; row-gap: 2px; }
.wsh-rep, .wsh-price { white-space: nowrap; }
.wsh-row .wsh-price { margin-left: auto; }

/* ───── #1486: 360px — «▶ 15 с» в одну строку; заголовок nl не обрезается ───── */
.wsh-cplay, .wsh-pplay { white-space: nowrap; }
.wsh-cplay span, .wsh-pplay span { white-space: nowrap; }
.wsh-top { gap: 6px; }
.wsh-h { font-size: 18px; }
.wsh-pill { padding: 6px 12px; font-size: 14px; }
.wsh-cplay { display: flex; align-items: center; justify-content: center; gap: 6px; }

/* ───── #1529: магазин по ученикам — плашки продавцов и витрина ученика ───── */
.wsh-screen.wsh-m-sellers .wsh-cats { display: none; }
.wsh-screen.wsh-m-seller .wsh-sorts { display: none; }
.wsh-sellers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wsh-seller { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 18px; text-align: left; box-sizing: border-box; width: 100%;
  border: 1.5px solid rgba(242,196,109,.32); background: linear-gradient(160deg, #2a1015, #1a0b0f); color: #fbf1de; font: inherit; cursor: pointer; min-height: 44px; }
button.wsh-seller:active { transform: scale(.98); }
.wsh-seller.wsh-skel { aspect-ratio: auto; height: 132px; }
.wsh-sttop { display: flex; align-items: center; gap: 12px; min-width: 0; }
.wsh-sava { position: relative; flex: none; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; display: grid; place-items: center;
  background: radial-gradient(circle at 30% 30%, #7a2433, #3a0f19); border: 2px solid rgba(242,196,109,.6); }
.wsh-sava b { font-size: 22px; color: #f7d58c; }
.wsh-sava img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.wsh-stx { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.wsh-sname { font: 700 18px/1.2 Georgia, "Times New Roman", serif; color: #fbf1de; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsh-sitems { font-size: 14px; color: #cbb89c; margin-top: 2px; }
.wsh-sstats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.wsh-sstat { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 64px; padding: 6px 4px; border-radius: 14px; background: rgba(242,196,109,.1); border: 1px solid rgba(242,196,109,.28); }
.wsh-sn { font-size: 24px; font-weight: 800; line-height: 1.1; color: #f7d58c; white-space: nowrap; }
.wsh-sstat-r.is-none .wsh-sn { color: #cbb89c; }
.wsh-sl { font-size: 14px; color: #e3d3ba; margin-top: 2px; }
.wsh-shead { display: flex; flex-direction: column; gap: 10px; margin-bottom: 12px; align-items: flex-start; }
.wsh-sall { align-self: flex-start; }
.wsh-seller-big { cursor: default; }
.wsh-ccnt { margin-left: 6px; font-size: 14px; opacity: .8; }
.wsh-chip.is-zero { opacity: .5; }
.wsh-rate { margin: 14px 0 4px; padding: 12px; border-radius: 16px; border: 1.5px solid rgba(242,196,109,.35); background: rgba(242,196,109,.08); text-align: center; }
.wsh-rate-h { font-size: 15px; font-weight: 700; color: #f7d58c; margin-bottom: 6px; }
.wsh-stars { display: flex; justify-content: center; gap: 4px; }
.wsh-star { min-width: 48px; min-height: 48px; border: 0; background: none; font-size: 34px; line-height: 1; color: rgba(251,241,222,.28); cursor: pointer; padding: 0; }
.wsh-star.on { color: #f2c46d; }
.wsh-star:disabled { opacity: .6; }

/* #1529 (переделка): плашка ученика = карточка ленты, превью сменяются сами, внизу одна строка */
.wsh-splate { position: relative; display: block; padding: 0; margin: 0; border-radius: 18px; overflow: hidden; aspect-ratio: 3 / 4; width: 100%; box-sizing: border-box;
  border: 1.5px solid rgba(242,196,109,.34); background: #1a0b0f; color: #fbf1de; font: inherit; text-align: left; cursor: pointer; }
.wsh-splate:active { transform: scale(.98); }
.wsh-splate.wsh-skel { cursor: default; }
.wsh-sstage { position: absolute; inset: 0; display: block; background: radial-gradient(circle at 30% 30%, #7a2433, #2a0d13); }
.wsh-sph { position: absolute; inset: 0; display: grid; place-items: center; font: 700 56px Georgia, serif; color: rgba(247,213,140,.55); }
.wsh-sph[hidden] { display: none; }
.wsh-sslide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .7s ease; }
.wsh-sslide.on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .wsh-sslide { transition: none; } }
.wsh-sinfo { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 4px; padding: 22px 6px 7px; min-width: 0;
  background: linear-gradient(to top, rgba(17,6,8,.92) 15%, rgba(17,6,8,0)); font-size: 14px; line-height: 1.2; }
.wsh-sava-s { width: 24px; height: 24px; display: grid; border-width: 1.5px; flex: none; }
.wsh-sava-s b { font-size: 12px; }
.wsh-snm { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 2px; font-weight: 700; color: #fbf1de; }
.wsh-snt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsh-sawrap { position: relative; flex: none; display: block; width: 24px; height: 24px; }
.wsh-smark { position: absolute; right: -6px; bottom: -5px; font-style: normal; font-size: 13px; line-height: 1; text-shadow: 0 1px 3px rgba(0,0,0,.8); }
.wsh-ssm { flex: none; font-weight: 700; color: #f7d58c; white-space: nowrap; }
.wsh-stag { position: absolute; top: 8px; right: 8px; z-index: 2; display: flex; align-items: center; padding: 4px 9px; border-radius: 999px;
  background: rgba(17,6,8,.72); font-size: 14px; line-height: 1.2; }
.wsh-stag-l { right: auto; left: 8px; }

/* #1542: работа либо в ленте, либо в магазине — закрытая кнопка серая, но нажимается (тост с объяснением) */
.is-locked { opacity: .45; filter: grayscale(.7); }