/* r33: карточка подарка в «Медиа» — одна геометрия во всех состояниях
   (пусто, загрузка, готово, ошибка, сожжён). Класс .v17 на .nac-wrap
   отрезает старые слои r24–r30. */
:root body .nac-wrap.v17{margin-left:0!important;margin-right:0!important}
:root body .nac-wrap.v17 .nac{
  display:grid!important;grid-template-columns:96px minmax(0,1fr)!important;
  grid-template-areas:"art head" "art stat" "rows rows" "note note"!important;grid-template-rows:auto auto!important;
  column-gap:14px!important;row-gap:0!important;align-items:stretch!important;
  padding:14px!important;border-radius:22px!important;background:var(--s1)!important;box-shadow:inset 0 0 0 1px var(--sep)!important;
  height:auto!important;min-height:0!important}
:root body .nac-wrap.v17 .nac::before,:root body .nac-wrap.v17 .nac::after,
:root body .nac-wrap.v17 .nac-t::before,:root body .nac-wrap.v17 .nac-t::after{content:none!important;display:none!important}
:root body .nac-wrap.v17 .nac-t{display:contents!important}
:root body .nac-wrap.v17 .nac-art{grid-area:art!important;width:96px!important;height:96px!important;min-width:0!important;aspect-ratio:1!important;
  border-radius:18px!important;overflow:hidden!important;position:relative!important;background:var(--s2)!important}
:root body .nac-wrap.v17 .nac.is-empty .nac-art{background:var(--tint)!important}
:root body .nac-wrap.v17 .nac-placeholder{position:absolute!important;left:50%!important;top:50%!important;width:40px!important;height:40px!important;
  transform:translate(-50%,-50%)!important;color:var(--ac)!important;opacity:1!important}
:root body .nac-wrap.v17 .nac:not(.is-empty) .nac-placeholder{opacity:0!important}

/* заголовок: коллекция, ниже — номер и статус */
:root body .nac-wrap.v17 .nac-h{grid-area:head!important;align-self:end!important;display:block!important;height:auto!important;min-height:0!important;
  margin:0!important;font:600 18px/23px var(--ui-font,-apple-system,system-ui,sans-serif)!important;letter-spacing:-.3px!important;color:var(--ink)!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
:root body .nac-wrap.v17 .nac-h span{display:none!important}
:root body .nac-wrap.v17 .nac-st{grid-area:stat!important;align-self:start!important;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px;min-height:24px;
  font:400 14px/19px var(--ui-font,-apple-system,system-ui,sans-serif);color:var(--ink2)}
:root body .nac-wrap.v17 .nac-num{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:12px;background:var(--tint);color:var(--ac);
  font-weight:600;font-variant-numeric:tabular-nums}
:root body .nac-wrap.v17 .nac-burn{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:12px;background:rgba(255,120,60,.16);color:#ff8a4c;font-weight:600}
:root body .nac-wrap.v17 .nac-burn svg{width:13px;height:13px}
html[data-scheme="light"] body .nac-wrap.v17 .nac-burn{color:#c2410c;background:rgba(234,88,12,.12)}

/* атрибуты — три строки как в списке настроек */
:root body .nac-wrap.v17 .nac-rows{grid-area:rows!important;display:flex!important;flex-direction:column!important;gap:0!important;margin-top:12px!important;
  border-top:1px solid var(--sep);min-width:0}
:root body .nac-wrap.v17 .nac-r{display:grid!important;grid-template-columns:68px minmax(0,1fr) auto!important;align-items:center!important;column-gap:8px!important;
  min-height:42px!important;height:auto!important;padding:0!important;border-bottom:1px solid var(--sep)}
:root body .nac-wrap.v17 .nac-r:last-child{border-bottom:0}
:root body .nac-wrap.v17 .nac-l{display:contents!important}
:root body .nac-wrap.v17 .nac-l small{grid-column:1!important;grid-row:1!important;position:static!important;width:auto!important;height:auto!important;clip:auto!important;
  font:400 14px/19px var(--ui-font,system-ui)!important;color:var(--ink2)!important}
:root body .nac-wrap.v17 .nac-v{grid-column:2!important;grid-row:1!important;display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important}
:root body .nac-wrap.v17 .nac-th{width:22px!important;height:22px!important;flex:none!important;border-radius:6px!important;background:var(--s2)!important}
:root body .nac-wrap.v17 .nac-th.is-b{border-radius:50%!important}
:root body .nac-wrap.v17 .nac-v b{font:500 15px/20px var(--ui-font,system-ui)!important;color:var(--ink)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
:root body .nac-wrap.v17 .nac-rar{grid-column:3!important;grid-row:1!important;font:600 13px/18px var(--ui-font,system-ui)!important;color:var(--ink2)!important;font-variant-numeric:tabular-nums}
:root body .nac-wrap.v17 .nac.is-empty .nac-v b{color:var(--ink3)!important}

/* загрузка: те же строки, значения — мерцающие плашки */
:root body .nac-wrap.v17 .nac.is-load .nac-v b{color:transparent!important;width:46%;border-radius:6px;background:var(--s2);animation:nacPulse 1.2s ease-in-out infinite}
:root body .nac-wrap.v17 .nac.is-load .nac-art{animation:nacPulse 1.2s ease-in-out infinite}
@keyframes nacPulse{50%{opacity:.55}}

:root body .nac-wrap.v17 .nac-note{grid-area:note!important;margin:10px 0 0!important;font:400 14px/19px var(--ui-font,system-ui)!important;color:var(--ink2)!important}
:root body .nac-wrap.v17 .nac-note:empty{display:none!important}
:root body .nac-wrap.v17 .nac-retry{grid-column:1/-1!important}

/* сожжён: модель гаснет, снизу горит огонёк */
:root body .nac-wrap.v17 .nac.is-burned .nv-model,:root body .nac-wrap.v17 .nac.is-burned .nac-model{filter:grayscale(.85) brightness(.75)!important}
.nac-fire{position:absolute;left:0;right:0;bottom:0;height:62%;z-index:6;pointer-events:none;opacity:0;transition:opacity .3s}
:root body .nac-wrap.v17 .nac.is-burned .nac-fire{opacity:1}
/* огонь есть только у сожжённых: у остальных его анимации 60 раз в секунду
   перерисовывали невидимый слой с mix-blend-mode */
.nac-fire i,.nac-fire b{animation-play-state:paused}
.nac-fire{display:none}
:root body .nac-wrap.v17 .nac.is-burned .nac-fire{display:block}
:root body .nac-wrap.v17 .nac.is-burned .nac-fire i,:root body .nac-wrap.v17 .nac.is-burned .nac-fire b{animation-play-state:running}
.nac-fire i{position:absolute;bottom:-12%;width:46%;height:78%;border-radius:50% 50% 45% 45%/62% 62% 38% 38%;
  background:radial-gradient(ellipse at 50% 78%,#fff3b0 0 18%,#ffb340 38%,rgba(255,90,30,.85) 62%,rgba(255,60,20,0) 76%);
  transform-origin:50% 100%;mix-blend-mode:screen;animation:nacFlame 1.1s ease-in-out infinite alternate}
.nac-fire i:nth-child(1){left:8%;animation-duration:.9s}
.nac-fire i:nth-child(2){left:27%;height:96%;width:48%;animation-delay:-.4s}
.nac-fire i:nth-child(3){left:48%;animation-duration:1.3s;animation-delay:-.7s}
.nac-fire b{position:absolute;bottom:20%;width:4px;height:4px;border-radius:50%;background:#ffcf6b;opacity:0;animation:nacEmber 1.8s ease-out infinite}
.nac-fire b:nth-of-type(1){left:34%}
.nac-fire b:nth-of-type(2){left:62%;animation-delay:-.9s}
@keyframes nacFlame{0%{transform:scale(.92,.86) translateX(0);opacity:.85}100%{transform:scale(1.04,1.08) translateX(2px);opacity:1}}
@keyframes nacEmber{0%{transform:translateY(0);opacity:0}20%{opacity:1}100%{transform:translateY(-46px);opacity:0}}
@media (prefers-reduced-motion:reduce){.nac-fire i,.nac-fire b,:root body .nac-wrap.v17 .nac.is-load .nac-v b,:root body .nac-wrap.v17 .nac.is-load .nac-art{animation:none!important}}
html.studio-no-motion .nac-fire i,html.studio-no-motion .nac-fire b{animation:none!important}
html.perf-min .nac-fire b{display:none}

/* шторки и поля «Медиа»: свой цвет текста, без системной рамки у поля номера */
:root .sht,:root #shtitle{color:var(--ink)!important}
:root body #nftp-num,:root body #nftp-num:focus,:root body #nftp-num:focus-visible{outline:none!important;border:0!important;box-shadow:none!important;background:transparent!important;color:var(--ink)!important}
:root :is(.sx,.np-theme):focus:not(:focus-visible){outline:none!important}

/* пустое состояние — те же строки с прочерками, а не серые полосы */
:root body .nac-wrap.v17 .nac.is-empty{min-height:0!important}
:root body .nac-wrap.v17 .nac.is-empty :is(.nac-h,.nac-l,.nac-v){visibility:visible!important}
:root body .nac-wrap.v17 .nac.is-empty .nac-r{width:auto!important;height:auto!important;min-height:42px!important;background:none!important;border-radius:0!important}
:root body .nac-wrap.v17 .nac.is-empty .nac-th{background:var(--s2)!important}
:root body .nac-wrap.v17 .nac.is-empty .nac-th img{display:none}

/* перевес над r30 (.nac.is-ok …): та же геометрия и в готовом состоянии */
:root body .nac-wrap.v17 .nac[class]{grid-template-columns:96px minmax(0,1fr)!important;gap:0 14px!important;align-items:stretch!important}
:root body .nac-wrap.v17 .nac[class] .nac-art{width:96px!important;height:96px!important}
:root body .nac-wrap.v17 .nac[class] .nac-h{font:600 18px/23px var(--ui-font,-apple-system,system-ui,sans-serif)!important;align-self:end!important}
:root body .nac-wrap.v17 .nac[class] .nac-rows{grid-column:1/-1!important;grid-row:auto!important}
:root body .nac-wrap.v17 .nac[class] .nac-r{grid-template-columns:68px minmax(0,1fr) auto!important;min-height:42px!important}

/* шапка при прокрутке: цвет фона текущей темы, а не зашитый чёрный */
:root html .ui-nav__bg,html:not(.perf-low) body .ui-nav__bg,:root body .ui-nav__bg{
  background:var(--bg)!important;
  background:linear-gradient(180deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 94%,transparent) calc(100% - 26px),color-mix(in srgb,var(--bg) 0%,transparent) 100%)!important}

/* фон подарка: градиент поверх нашей подложки (раньше его перекрывал --s2) */
:root body .nac-wrap.v17 .nac[class] .nac-art.has-bg{background:radial-gradient(circle at 50% 42%,var(--c),var(--e))!important}
:root body .nac-wrap.v17 .nac[class] .nac-th.is-b{background:radial-gradient(circle at 50% 40%,var(--c,var(--s2)),var(--e,var(--s2)))!important}

/* шторка выбора в «Медиа»: проявляется только затемнение, сама шторка
   непрозрачная и выезжает снизу — страница сквозь неё не просвечивает
   (мигание на macOS). Без каскада плиток: список открывают часто. */
@keyframes ovlDim{from{background-color:transparent}}
:root body .ovl{transition:background-color .22s ease-out,visibility 0s!important}
:root body .ovl.on{animation:ovlDim .22s ease-out!important;opacity:1!important}
:root body .ovl .sht{background:var(--s1)!important;opacity:1!important;
  animation:sheetUp .36s cubic-bezier(.32,.72,0,1)!important;will-change:transform}
:root body #ovl.p6-open #sbdy[data-t] .sit{animation:none!important}
@media (prefers-reduced-motion:reduce){:root body .ovl .sht{animation:none!important}}
html.studio-no-motion body .ovl .sht{animation:none!important}
