/*
  ФАЙЛ: noticelines.css
  Назначение: стили верхних строк уведомлений и их состояний.
  Что редактируется в этом файле:
  - основная строка уведомлений: #noticeLine
  - строка уведомления режима: #modeNoticeLine
  - строка биллинга: #billingNoticeLine и .billing-notice
  - скрытие, размытие и прозрачность уведомлений при открытых панелях, модалках, плеере и прочих состояниях
  - согласование этих строк с тёмной темой и анимациями переключения
  Примечание: любые правки notice-строк лучше держать только в этом файле.
*/

body.favorites-open .billing-notice{
  filter: none !important;
  -webkit-filter: none !important;
}

body.video-player-active #noticeLine, body.video-player-active #modeNoticeLine, body.video-player-active #billingNoticeLine{
  opacity: 0;
  pointer-events: none;
}

#noticeLine{
  min-height: 18px;
  text-align: center;
  font-size: 14px;
  font-family: Arial, sans-serif;
  letter-spacing: 0;
  font-weight: 800;
  line-height: 1.2;
  color: #8c8c8c;
  user-select: none;
  pointer-events: none;
  transition: none !important;
}

#noticeLine{
  text-align: center;
  margin-top: 22px;
  min-height: 1.2em;
}

html[data-theme="dark"] #noticeLine, body.dark #noticeLine{
  color: #8c8c8c !important;
}

#noticeLine, #noticeLine *{
  transition-property: color, opacity !important;
  transition-duration: 0s !important;
  animation: none !important;
  color: #8c8c8c !important;
  will-change: auto !important;
}

body.sheet-open #billingNotice, body.sheet-open .billing-notice, body.modal-open #billingNotice, body.modal-open .billing-notice, html[data-sheet="tracks"] #billingNotice, html[data-sheet="tracks"] .billing-notice, html[data-sheet="playlists"] #billingNotice, html[data-sheet="playlists"] .billing-notice, .playlists-panel-open #billingNotice, .playlists-panel-open .billing-notice{
  opacity: 0 !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
  pointer-events: none !important;
}

#billingNotice.billing-notice, .billing-notice{
  transition: opacity .16s ease, filter .16s ease !important;
}

#noticeLine{
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: filter, opacity;
}

body.playlists-closing #noticeLine, .dropdown-overlay.open ~ #noticeLine{
  opacity: 1 !important;
  visibility: visible !important;
  filter: blur(10px) !important;
  -webkit-filter: blur(10px) !important;
  pointer-events: none !important;
}

body.theme-animating #noticeLine, body.theme-freeze #noticeLine{
  transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, filter !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
}

#noticeLine{
  left: 50% !important;
  right: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transform: translateX(-50%) translateZ(0) !important;
  -webkit-transform: translateX(-50%) translateZ(0) !important;
  width: min(500px, calc(100vw - 24px)) !important;
  max-width: 500px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

body.theme-animating #noticeLine, body.theme-freeze #noticeLine{
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) translateZ(0) !important;
  -webkit-transform: translateX(-50%) translateZ(0) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  top: auto !important;
  bottom: auto !important;
}

#noticeLine{
  box-sizing: border-box;
}

.theme-transition-clone #noticeLine{
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  -webkit-transform: translateX(-50%) !important;
  width: min(500px, calc(100vw - 24px)) !important;
  max-width: 500px !important;
}

#noticeLine, .theme-transition-clone #noticeLine{
  left: 50% !important;
  right: auto !important;
  width: min(500px, calc(100vw - 24px)) !important;
  max-width: 500px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transform: translateX(-50%) !important;
  -webkit-transform: translateX(-50%) !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

#noticeLine{
  position: relative !important;
  left: 50% !important;
  right: auto !important;
}

#noticeLine{
  width: var(--site-width) !important;
  max-width: var(--site-max-width) !important;
  box-sizing: border-box !important;
}

#noticeLine{
  text-align: center !important;
}

#noticeLine{
  width: var(--site-visual-width) !important;
  max-width: var(--site-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#noticeLine{
  font-family: Arial, sans-serif !important;
}

body.tracks-open #noticeLine{
  filter: blur(10px) !important;
  opacity: .28 !important;
  transition: filter 140ms ease, opacity 140ms ease !important;
}

html.tracks-open #billingNotice, html.tracks-open .billing-notice, body.tracks-open #billingNotice, body.tracks-open .billing-notice, .tracks-panel-open #billingNotice, .tracks-panel-open .billing-notice{
  opacity: 0 !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
  pointer-events: none !important;
}

body.tracks-open #noticeLine, body.tracks-closing #noticeLine, html.tracks-open #noticeLine{
  opacity: 1 !important;
  visibility: visible !important;
  filter: blur(10px) !important;
  -webkit-filter: blur(10px) !important;
  pointer-events: none !important;
}


/* FIX v16: move content list and notice up (desktop only) */
@media (min-width: 768px){
  .content-list-wrap, #contentListWrap, .contentlist-btn{
    transform: translateY(-8px) !important;
  }

  .notice-line, #noticeLine, .subscription-notice{
    transform: translateY(-8px) !important;
  }
}

/* FIX v17: lift notice + fix centering */
@media (min-width: 768px){
  .notice-line,
  #noticeLine,
  .subscription-notice{
    margin-top: -10px !important;
    transform: none !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .connecting-notice,
  #connectingNotice{
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* FIX v18: sync notice + perfect center */
@media (min-width: 768px){
  .notice-line,
  #noticeLine,
  .subscription-notice{
    position: relative !important;
    top: -12px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  .connecting-notice,
  #connectingNotice{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
  }
}

/* FIX v19: lift notices + stable centering (no theme jump) */
@media (min-width: 768px){
  .notice-line,
  #noticeLine,
  .subscription-notice{
    margin-top: -12px !important;
    display: block !important;
    text-align: center !important;
  }

  /* force same centering in all themes */
  .connecting-notice,
  #connectingNotice{
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
  }

  html[data-theme="dark"] .connecting-notice,
  html[data-theme="dark"] #connectingNotice{
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
  }
}

/* FIX v20: sync notice + hard center fix */
@media (min-width: 768px){
  .notice-line,
  #noticeLine,
  .subscription-notice{
    margin-top: -16px !important;
    text-align: center !important;
    width: 100% !important;
  }

  /* absolute center reset */
  .connecting-notice,
  #connectingNotice{
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    margin: 0 auto !important;
    text-align: center !important;
    width: 100% !important;
  }

  html[data-theme="dark"] .connecting-notice,
  html[data-theme="dark"] #connectingNotice{
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    margin: 0 auto !important;
    text-align: center !important;
    width: 100% !important;
  }
}

/* FIX v21: sync notice + center fix */
@media (min-width: 768px){
  .notice-line,
  #noticeLine,
  .subscription-notice{
    transform: translateY(-20px) !important;
    text-align: center !important;
    width: 100% !important;
  }

  #connectingNotice,
  .connecting-notice{
    position: static !important;
    transform: none !important;
    text-align: center !important;
    width: 100% !important;
  }
}


/* FIX v22: restore normal notice position + center */
@media (min-width: 768px){
  .notice-line,
  #noticeLine,
  .subscription-notice{
    transform: none !important;
    margin-top: 0 !important;
    text-align: center !important;
  }

  #connectingNotice,
  .connecting-notice{
    position: static !important;
    transform: none !important;
    text-align: center !important;
    margin: 0 auto !important;
  }
}


/* FIX v23: push 'connecting to bagid' MUCH lower */
@media (min-width: 768px){
  #connectingNotice,
  .connecting-notice{
    margin-top: 80px !important;
  }
}


/* FIX v24: push connecting notice MUCH lower + perfect center */
@media (min-width: 768px){
  #connectingNotice,
  .connecting-notice{
    margin-top: 140px !important;
    text-align: center !important;
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    position: relative !important;
  }
}

/* FIX v25: FORCE push connecting notice DOWN + CENTER */
@media (min-width: 768px){
  body #connectingNotice,
  body .connecting-notice{
    position: relative !important;
    top: 120px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    text-align: center !important;
    transform: none !important;
    margin: 0 auto !important;
  }
}

/* FIX v26: move connecting DOWN + CENTER HARD */
@media (min-width: 768px){
  #connectingNotice,
  .connecting-notice{
    position: absolute !important;
    top: 260px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
  }
}

/* FIX v27: force center + push DOWN */
@media (min-width: 768px){
  #connectingNotice,
  .connecting-notice{
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: 120px !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
  }
}


/* FIX v28: REAL desktop reset for connecting notice + billing line */
@media (min-width: 768px){
  body #noticeLine,
  body.theme-animating #noticeLine,
  body.theme-freeze #noticeLine,
  .theme-transition-clone #noticeLine{
    position: relative !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: var(--site-visual-width) !important;
    max-width: var(--site-max-width) !important;
    margin: 80px 0 0 0 !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    text-align: center !important;
  }

  body #billingNoticeLine,
  body.theme-animating #billingNoticeLine,
  body.theme-freeze #billingNoticeLine,
  .theme-transition-clone #billingNoticeLine{
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: calc(var(--tracks-bottom) + var(--safe-b) + var(--tracks-btn-h) + 8px) !important;
    width: var(--site-visual-width) !important;
    max-width: var(--site-max-width) !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    text-align: center !important;
  }
}


/* FIX v34: desktop keep subscription line fixed under browser zoom */
@media (min-width: 768px){
  body #billingNoticeLine,
  body.theme-animating #billingNoticeLine,
  body.theme-freeze #billingNoticeLine,
  .theme-transition-clone #billingNoticeLine{
    top: 468px !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    width: var(--site-visual-width) !important;
    max-width: var(--site-max-width) !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    text-align: center !important;
  }
}


/* FIX v35: move subscription notice LOWER with Content List */
@media (min-width: 768px){
  body #billingNoticeLine{
    top: 568px !important;
  }
}


/* FIX v36: move subscription LOWER + reduce gap */
@media (min-width: 768px){
  body #billingNoticeLine{
    top: 780px !important;
  }
}


/* FIX v37: reduce gap between Content List and subscription */
@media (min-width: 768px){
  body #billingNoticeLine{
    top: 810px !important;
  }
}


/* FIX v38: increase gap (prevent overlap) */
@media (min-width: 768px){
  body #billingNoticeLine{
    top: 780px !important;
  }
}


/* FIX v39: slightly lower notice */
@media (min-width: 768px){
  body #billingNoticeLine{
    top: 795px !important;
  }
}


/* FIX v40: keep subscription notice stable during theme switching */
@media (min-width: 768px){
  body #billingNoticeLine,
  body.theme-animating #billingNoticeLine,
  body.theme-freeze #billingNoticeLine,
  .theme-transition-clone #billingNoticeLine{
    top: 795px !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    transition: none !important;
    animation: none !important;
  }
}


/* FIX v42: restore subscription notice to follow Content List from bottom */
@media (min-width: 768px){
  body #billingNoticeLine,
  body.theme-animating #billingNoticeLine,
  body.theme-freeze #billingNoticeLine,
  .theme-transition-clone #billingNoticeLine{
    top: auto !important;
    bottom: calc(var(--tracks-bottom) + var(--safe-b) + var(--tracks-btn-h) + 8px) !important;
    left: 50% !important;
    right: auto !important;
    width: var(--site-visual-width) !important;
    max-width: var(--site-max-width) !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    transition: none !important;
    animation: none !important;
  }
}


/* FIX v44: notices must not push video down while video player is active */
body.video-player-active #noticeLine,
body.video-player-active #modeNoticeLine,
body.video-player-active #billingNoticeLine,
body.video-player-active #billingNotice,
body.video-player-active .billing-notice{
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* FIX v63: keep subscription tied to Content List */
@media (min-width: 768px){
  body #billingNoticeLine{
    bottom: calc(var(--tracks-bottom) + var(--safe-b) + var(--tracks-btn-h) + 8px) !important;
    top: auto !important;
  }
}


/* FIX v66: keep subscription visible during video */
body.video-player-active #billingNoticeLine,
body.video-player-active #billingNotice,
body.video-player-active .billing-notice{
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}


/* FIX v67: lock closed subscription notice position against browser zoom */
body.tracks-locked-closed:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
body.tracks-locked-closed.theme-animating:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
body.tracks-locked-closed.theme-freeze:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
  top: var(--billing-fixed-top, auto) !important;
  bottom: auto !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  -webkit-transform: translateX(-50%) !important;
}


/* FIX v72: keep closed subscription notice fixed during browser zoom */
body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
  top: var(--billing-locked-top, auto) !important;
  bottom: auto !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  -webkit-transform: translateX(-50%) !important;
  transition: none !important;
}


/* FIX v73: prevent subscription notice jumping on F5 / Ctrl+F5 */
body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
  opacity: 0 !important;
  transition: none !important;
  animation: none !important;
}


/* FIX v30: hard-lock subscription notice exact closed position from working archive */
@media (min-width: 768px){
  html body #billingNoticeLine,
  html body.theme-animating #billingNoticeLine,
  html body.theme-freeze #billingNoticeLine,
  html .theme-transition-clone #billingNoticeLine,
  html body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html.preload body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
    position: fixed !important;
    top: 795px !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    width: min(500px, calc(100vw - 24px)) !important;
    max-width: 500px !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
    transition: none !important;
    animation: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    will-change: auto !important;
  }
}


/* FIX v31: raise subscription notice initial fixed position */
@media (min-width: 768px){
  html body #billingNoticeLine,
  html body.theme-animating #billingNoticeLine,
  html body.theme-freeze #billingNoticeLine,
  html .theme-transition-clone #billingNoticeLine,
  html body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html.preload body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
    top: 735px !important;
  }
}


/* FIX v32: raise subscription notice higher */
@media (min-width: 768px){
  html body #billingNoticeLine,
  html body.theme-animating #billingNoticeLine,
  html body.theme-freeze #billingNoticeLine,
  html .theme-transition-clone #billingNoticeLine,
  html body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html.preload body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
    top: 675px !important;
  }
}


/* FIX v48: billing notice hidden while favorites/history are open */
body.favorites-open #billingNoticeLine,
body.favorites-closing #billingNoticeLine,
body.history-open #billingNoticeLine{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
}


/* FIX v56: billing/subscription notice should blur/fade during Favorite bags like during Operations history */
body.favorites-open #billingNoticeLine,
body.favorites-closing #billingNoticeLine,
body.favorites-open .billing-notice,
body.favorites-closing .billing-notice{
  opacity: 0.18 !important;
  visibility: visible !important;
  pointer-events: none !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
}


/* FIX v57: Favorite bags should blur/fade billing notice, not hard-hide it */
body.favorites-open #billingNoticeLine,
body.favorites-closing #billingNoticeLine,
body.favorites-open .billing-notice,
body.favorites-closing .billing-notice{
  opacity: 0.18 !important;
  visibility: visible !important;
  pointer-events: none !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
}


/* FIX v134.6: billing notice should blur/fade behind mobile video quality modal */
body.video-quality-modal-open #billingNoticeLine,
body.video-quality-modal-open .billing-notice,
html.video-quality-modal-open #billingNoticeLine,
html.video-quality-modal-open .billing-notice{
  opacity: 0.18 !important;
  visibility: visible !important;
  pointer-events: none !important;
  filter: blur(12px) !important;
  -webkit-filter: blur(12px) !important;
}

/* FIX v137.23: on desktop keep billing notice hidden until JS applies final position; prevents first-load jump */
@media (min-width: 768px){
  html:not(.billing-notice-positioned) body #billingNoticeLine,
  html:not(.billing-notice-positioned) body.theme-animating #billingNoticeLine,
  html:not(.billing-notice-positioned) body.theme-freeze #billingNoticeLine,
  html:not(.billing-notice-positioned) .theme-transition-clone #billingNoticeLine,
  html:not(.billing-notice-positioned) body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html:not(.billing-notice-positioned) body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html:not(.billing-notice-positioned) body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html.billing-notice-positioned body #billingNoticeLine,
  html.billing-notice-positioned body.theme-animating #billingNoticeLine,
  html.billing-notice-positioned body.theme-freeze #billingNoticeLine,
  html.billing-notice-positioned .theme-transition-clone #billingNoticeLine,
  html.billing-notice-positioned body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html.billing-notice-positioned body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html.billing-notice-positioned body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
    opacity: 1 !important;
    visibility: visible !important;
  }
}


/* v137.38 mobile billing notice: keep same stable gap to Content List as desktop and do not shift on open/close */
@media (max-width: 767px){
  html body #billingNoticeLine,
  html body.theme-animating #billingNoticeLine,
  html body.theme-freeze #billingNoticeLine,
  html .theme-transition-clone #billingNoticeLine,
  html body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-open #billingNoticeLine,
  html body.tracks-closing #billingNoticeLine,
  html body.playlists-closing #billingNoticeLine,
  html.tracks-open #billingNoticeLine,
  html body.tracks-locked-closed:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-locked:not(.tracks-open):not(.tracks-closing) #billingNoticeLine,
  html body.tracks-zoom-lock-pending:not(.tracks-open):not(.tracks-closing) #billingNoticeLine{
    top: auto !important;
    bottom: calc(var(--tracks-bottom) + var(--safe-b) + var(--tracks-btn-h) + 8px) !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
  }
}



/* v137.53.140 mobile-like deposit: use absolute clone for billing notice */
html.billing-notice-clone-active #billingNoticeLine,
body.billing-notice-clone-active #billingNoticeLine,
#billingNoticeLine.billing-notice-source-hidden{
  display: none !important;
}

#billingNoticeLineClone.billing-notice-clone{
  display: block !important;
}



/* v137.53.149 BAG search freeze keeps original billing notice pinned in place on mobile-like viewport */
html.bag-search-freeze-active #billingNoticeLine,
body.bag-search-freeze-active #billingNoticeLine,
#billingNoticeLine.bag-search-frozen-original{
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  transition: none !important;
  animation: none !important;
}



/* v137.53.150 reinforce fixed-position freeze for billing notice during BAG search */
#billingNoticeLine.bag-search-frozen-original{
  position: fixed !important;
  transform: none !important;
  -webkit-transform: none !important;
}



/* v137.53.151 BAG search viewport lock: keep billing notice stable while keyboard opens */
#billingNoticeLine.bag-search-frozen-original{
  position: absolute !important;
}



/* v137.53.152 BAG search freeze re-parents original billing notice to body and pins it fixed */
#billingNoticeLine.bag-search-frozen-original{
  position: fixed !important;
  transform: none !important;
  -webkit-transform: none !important;
  margin: 0 !important;
}



/* v137.53.153 BAG search freeze: billing notice uses separate clone id so old billing rules cannot move it */
html.bag-search-freeze-active #billingNoticeLine.bag-search-billing-source-hidden,
body.bag-search-freeze-active #billingNoticeLine.bag-search-billing-source-hidden{
  display: none !important;
}

#billingNoticeLineSearchFreezeClone.billing-notice-search-freeze-clone{
  display: block !important;
}


/* 53.290: lift long multiline notice text higher so it does not overlap the Content List button. */
#noticeLine{
  --notice-auto-lift: 0px;
}

#noticeLine.notice-multiline{
  transform: translateX(-50%) translateY(calc(-1 * var(--notice-auto-lift, 0px))) !important;
  -webkit-transform: translateX(-50%) translateY(calc(-1 * var(--notice-auto-lift, 0px))) !important;
}

body.theme-animating #noticeLine.notice-multiline,
body.theme-freeze #noticeLine.notice-multiline,
.theme-transition-clone #noticeLine.notice-multiline{
  transform: translateX(-50%) translateY(calc(-1 * var(--notice-auto-lift, 0px))) !important;
  -webkit-transform: translateX(-50%) translateY(calc(-1 * var(--notice-auto-lift, 0px))) !important;
}


/* v137.53.291 desktop: anchor the whole billing notice above Content List; multiline EN/RU text grows upward instead of overlapping the button. */
@media (min-width: 768px){
  html.billing-notice-positioned body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line{
    position: fixed !important;
    top: auto !important;
    bottom: calc(var(--tracks-bottom) + var(--safe-b) + var(--tracks-btn-h) + 12px) !important;
    left: 50% !important;
    right: auto !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
  }
}


/* v137.53.292 desktop browsers: billing notice follows the real Content List position under Ctrl+/Ctrl- browser zoom. */
html.desktop-billing-contentlist-anchored:not(.tg-desktop-miniapp) body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line,
html.desktop-billing-contentlist-anchored:not(.tg-desktop-miniapp) body.theme-animating:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line,
html.desktop-billing-contentlist-anchored:not(.tg-desktop-miniapp) body.theme-freeze:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line{
  position: fixed !important;
  top: calc(var(--desktop-content-list-top) - 12px) !important;
  bottom: auto !important;
  left: 50% !important;
  right: auto !important;
  margin: 0 !important;
  transform: translate(-50%, -100%) !important;
  -webkit-transform: translate(-50%, -100%) !important;
  transition: none !important;
  will-change: auto !important;
}

/* v22.75 Desktop Telegram classic WebView first-paint/F5 stability:
   Content List is hard-locked to top:700px on desktop in contentlistbtn.css.
   v22.75 also applies the same anchor through an early head bootstrap class before deferred JS runs,
   so cached billing text cannot render one transient frame at the generic desktop position. */
@media (min-width: 768px){
  html.jukebox-desktop-webview-notice-boot body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line,
  html.jukebox-desktop-webview-notice-boot.billing-notice-positioned body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line,
  html.jukebox-theme-desktop-webview-host body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line,
  html.jukebox-theme-desktop-webview-host.billing-notice-positioned body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line,
  html.jukebox-theme-desktop-webview-host.desktop-billing-contentlist-anchored body:not(.tracks-open):not(.tracks-closing) #billingNoticeLine.billing-notice-line{
    position: fixed !important;
    top: 688px !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    margin: 0 !important;
    transform: translate(-50%, -100%) !important;
    -webkit-transform: translate(-50%, -100%) !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }
}



/* v22.76 desktop cached billing notice boot hold:
   Hide only the billing/subscription line until deferred environment classification is complete.
   This prevents Desktop Telegram classic WebView from painting one transient F5 frame at the
   generic desktop position before jukebox-theme-desktop-webview-host is available. */
@media (min-width: 768px){
  html.billing-notice-desktop-boot-hold #billingNoticeLine.billing-notice-line,
  html.billing-notice-desktop-boot-hold.billing-notice-positioned #billingNoticeLine.billing-notice-line,
  html.billing-notice-desktop-boot-hold.jukebox-desktop-webview-notice-boot #billingNoticeLine.billing-notice-line,
  html.billing-notice-desktop-boot-hold.jukebox-theme-desktop-webview-host #billingNoticeLine.billing-notice-line{
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: none !important;
    animation: none !important;
  }
}