/* ====== переменные ====== */
@font-face{
  font-family:"Russo One";
  src:url("./bgicons/RussoOne-Regular.ttf") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:block;
}

/* Final override: landscape TV popup must fill the viewport and stay free of the narrow popup layout. */
.modal:has(.streams-popup.streams-popup--landscape-lite) .modal__content{
  display:grid !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  padding:0 !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-popup{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  gap:0 !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-card{
  width:100% !important;
  height:100% !important;
  min-height:min(var(--app-h, 100svh), 100svh) !important;
}

:root{
  --bg:#0f1115;
  --text:#e7eaf0;
  --accent:#FF7300;
  --chip:#D9D9D9;
  --radius-card:16px;
  --radius-field:16px;
  --radius-btn-secondary:14px;
  --radius-pill:999px;
  --radius-chip:10px;
  --popup-bg:rgba(221,221,221,.25);
  --shadow:0 8px 16px rgba(0,0,0,.25);
  --sky: #001B47; /* цвет неба сверху для пиксельной полосы */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --tg-top-ui-gap: 70px;
  --tg-bottom-ui-gap: 24px;
  --plam-modal-safe-top: max(var(--safe-top), var(--tg-top-ui-gap));
  --plam-modal-safe-bottom: max(var(--safe-bottom), var(--tg-bottom-ui-gap));
  --faq-modal-safe-top: calc(var(--safe-top) + 70px);
  --faq-modal-safe-bottom: max(var(--safe-bottom), 24px);

  /* ...твои переменные... */
  --tv-ar-m: 257 / 198;  /* w/h из макета для medium */
  --tv-ar-s: 226 / 174;  /* small */
  --tv-ar-l: 257 / 198;  /* large */

  /* ===== TV (телевизор как отдельный слой) ===== */
--tv-x-m:200;  --tv-y-m:375;   --tv-w-m:257; --tv-h-m:198;
--tv-x-s:190;  --tv-y-s:295;   --tv-w-s:226; --tv-h-s:174;
--tv-x-l:400;    --tv-y-l:540; --tv-w-l:420; --tv-h-l:323;

  /* ===== photohereru (текст у пенька) ===== */
  --photohereru-x-m:283.5;  --photohereru-y-m:565;   --photohereru-w-m:76;  --photohereru-h-m:70;
  --photohereru-x-s:270;    --photohereru-y-s:465; --photohereru-w-s:65;  --photohereru-h-s:60;
  --photohereru-x-l:560;  --photohereru-y-l:877.5; --photohereru-w-l:110; --photohereru-h-l:102;

  /* ===== wintable (листочек на телевизор) 
  --wintable-x-m:322.5;  --wintable-y-m:372;   --wintable-w-m:77;  --wintable-h-m:108;
  --wintable-x-s:300;    --wintable-y-s:290;   --wintable-w-s:52;  --wintable-h-s:74;
  --wintable-x-l:590;    --wintable-y-l:535; --wintable-w-l:94;  --wintable-h-l:133; ===== */

  /* дизайн-холсты */
  --mw:393; --mh:853;      /* medium */
  --sw:375; --sh:667;      /* small  (обновлено) */
  --lw:834; --lh:1194;     /* large  */

  /* ПЕНЁК — координаты центра и размеры (в пикселях макета) */
  --stump-x-m:300; --stump-y-m:540; --stump-w-m:170; --stump-h-m:142;
  --stump-x-s:285; --stump-y-s:442; --stump-w-s:145; --stump-h-s:121;   /* обновлено */
  --stump-x-l:580; --stump-y-l:790; --stump-w-l:238; --stump-h-l:198;

  /* Плюс-облако (иконка выведена слоем ::before) */
  --plus-x-m:290; --plus-y-m:135; --plus-w-m:185; --plus-h-m:88;
  --plus-x-s:277; --plus-y-s:100; --plus-w-s:176; --plus-h-s:68;       /* обновлено */
  --plus-x-l:640; --plus-y-l:145; --plus-w-l:305; --plus-h-l:128;

  /* Положение звездного бейджа (между FAQ и плюс-облаком) */
--stars-x-m: 186; --stars-y-m: 136;   /* medium */
--stars-x-s: 180; --stars-y-s: 100;   /* small */
--stars-x-l: 470; --stars-y-l: 145;   /* large */

  
  /* Текст + иконка валюты внутри облака */
  --plus-font-m:16px;
  --plus-icon-m:20px;
  --plus-gap-m:0px;
  --plus-padleft-m:50px;

  /* Подарок */
  --gift-x-m:305; --gift-y-m:760; --gift-w-m:115; --gift-h-m:120;
  --gift-x-s:291; --gift-y-s:590; --gift-w-s:98; --gift-h-s:102;       /* обновлено */
  --gift-x-l:680; --gift-y-l:1070; --gift-w-l:162; --gift-h-l:168;

  /* Дневник */
  --notebook-x-m:110; --notebook-y-m:760; --notebook-w-m:157; --notebook-h-m:123;
  --notebook-x-s:105; --notebook-y-s:590; --notebook-w-s:135; --notebook-h-s:106; /* обновлено */
  --notebook-x-l:160; --notebook-y-l:1070; --notebook-w-l:225; --notebook-h-l:177;

  /* FAQ-облако (часть фона, слева от плюс-облака) — подгони размеры/координаты под макет */
  --faq-x-m: 80;  --faq-y-m: 135;  --faq-w-m: 130; --faq-h-m: 85;   /* medium */
  --faq-x-s: 80;  --faq-y-s: 100;  --faq-w-s: 127; --faq-h-s: 69;   /* small  (обновлено) */
  --faq-x-l: 140;  --faq-y-l: 145;  --faq-w-l: 220; --faq-h-l: 120;  /* large  */

  /* Хотспот «Действия» (центр-координаты) */
  --actions-x-m: 110;  --actions-y-m: 530;  --actions-w-m: 198; --actions-h-m: 272;
  --actions-x-s: 95;   --actions-y-s: 400;    --actions-w-s: 158; --actions-h-s: 217;
  --actions-x-l: 245;   --actions-y-l: 755;    --actions-w-l: 302; --actions-h-l: 416;


  /* самолет */

  --plane-y-m: 100;  --plane-w-m: 393;  --plane-h-m: 263.94;
  --plane-y-s: 70;  --plane-w-s: 375;  --plane-h-s: 251.85;
  --plane-y-l: 50;  --plane-w-l: 834; --plane-h-l: 560.11;
  
}

/* ====== базовая сцена ====== */
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
}

html.is-android-webapp{
  --tg-top-ui-gap: 86px;
}
button,
a,
input,
textarea,
select,
summary,
[role="button"],
[tabindex]{
  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
}
html,body{
  height:100%;
  min-height: 100%;
  overflow:hidden;
  overscroll-behavior: none;
  background:var(--sky);
  color:var(--text);
  font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
}

/* Только для запуска с иконки (PWA), чтобы не было нижней "дыры" */
html.is-pwa-standalone,
html.is-pwa-standalone body{
  min-height: 100lvh;
  height: 100lvh;
  overflow: hidden;
  background: var(--sky);
}
/* фон подложки = цвет неба */
/* фон подложки = цвет неба */
.scene{
  /* уже есть */
  position: relative;
  display: grid;
  place-items: end center;
  width: 100vw;
  height: var(--app-h, 100vh);   /* fallback */
  height: var(--app-h, 100dvh);  /* iOS/modern viewport */
  height: max(var(--app-h, 100dvh), 100lvh);
  min-height: 100svh;
  min-height: 100lvh;
  overflow: hidden;

  /* НОВОЕ: один универсальный фон */
  background-color: var(--sky);                  /* базовый цвет под картинку */
  background-image: url("./bgicons/bg-master.png?v=4"); /* <-- ваш большой фон */
  background-size: cover;                        /* закрыть весь экран */
  background-repeat: no-repeat;
  background-position: 50% 100%;
}


/* Сцена — размер задаёт картинка */
.stage{
  position: relative;
  display: block;         /* можно и inline-block, но block надёжнее */
  width: 100vw;
  height: var(--app-h, 100vh);   /* fallback */
  height: var(--app-h, 100dvh);  /* iOS/modern viewport */
  min-height: 100svh;
  min-height: 100lvh;
  overflow: visible;

  /* как и было — «дизайн-холсты» для пересчёта координат */
  --design-w: var(--mw);
  --design-h: var(--mh);
}

html.is-pwa-standalone .scene,
html.is-pwa-standalone .stage{
  min-height: 100lvh;
  height: 100lvh;
}
html.is-pwa-standalone .scene{
  position: fixed;
  inset: 0;
  width: 100vw;
}

@supports (height: 100dvh){
  .scene,
  .stage{
    min-height: 100dvh;
  }
}

@supports (width: 100dvw){
  .scene,
  .stage{
    width: 100dvw;
  }
}

html.is-telegram-webapp .scene,
html.is-telegram-webapp .stage{
  height: var(--app-h, 100vh);
  min-height: var(--app-h, 100vh);
}

html.is-telegram-webapp .hotspot::before{
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* SMALL: маленький холст */
@media (max-width:375px){
  .stage{ --design-w: var(--sw); --design-h: var(--sh); }
}

/* LARGE: большой холст */
@media (min-width:768px){
  .stage{ --design-w: var(--lw); --design-h: var(--lh); }
  :root{
    --plus-font-m:26px;
    --plus-icon-m:28px;
    --plus-gap-m:0px;
    --plus-padleft-m:60px;
  }
}

/* Любые кнопки внутри сцены без системного фона */
.scene button{
  background:transparent;
  border:0;
  box-shadow:none;
}

/* Полный reset для кликабельных зон */
.hotspot{
  position: absolute;
  z-index: 20;

  /* центрирование + собственный слой (одним свойством!) */
  transform: translate3d(-50%, -50%, 0);

  backface-visibility: hidden;
  will-change: transform;

  /* UX */
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;

  /* reset — оставляю твои */
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  box-shadow: none;
  outline: 0;
  cursor: pointer;
}

/* Хотспот «Действия» */
.hotspot--actions{
  left:  calc(var(--actions-x-m)/var(--design-w)*100%);
  top:   calc(var(--actions-y-m)/var(--design-h)*100%);
  width: calc(var(--actions-w-m)/var(--design-w)*100%);
  height:calc(var(--actions-h-m)/var(--design-h)*100%);
  z-index: 30;
}

/* Иконка «Действия» поверх фона сцены */
.hotspot--actions::before{
  content:"";
  position:absolute;
  inset:0;
  background:center / contain no-repeat;
  background-image:url("./bgicons/plam.PNG"); /* один ресурс (без @2x) */
  pointer-events:none; /* чтобы клики шли в кнопку */
  filter: drop-shadow(0 5px 1px rgba(0,0,0,.35)); /* мягкая тень (опционально) */
}

/* легкий «отклик» по нажатию — по желанию */
.hotspot--actions:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}

@media (max-width:375px){
  .hotspot--actions{
    left:  calc(var(--actions-x-s)/var(--design-w)*100%);
    top:   calc(var(--actions-y-s)/var(--design-h)*100%);
    width: calc(var(--actions-w-s)/var(--design-w)*100%);
    height:calc(var(--actions-h-s)/var(--design-h)*100%);
  }
}
@media (min-width:768px){
  .hotspot--actions{
    left:  calc(var(--actions-x-l)/var(--design-w)*100%);
    top:   calc(var(--actions-y-l)/var(--design-h)*100%);
    width: calc(var(--actions-w-l)/var(--design-w)*100%);
    height:calc(var(--actions-h-l)/var(--design-h)*100%);
  }
}

/* общий класс-якорь */
.anchor{
  position:absolute;
  transform: translate(-50%, -50%);
}

/* base (medium) */
.anchor--tv{
  left:  calc(var(--tv-x-m)/var(--design-w)*100%);
  top:   calc(var(--tv-y-m)/var(--design-h)*100%);
  width: calc(var(--tv-w-m)/var(--design-w)*100%);
  /* было: height: calc(...); — УДАЛИТЬ */
  aspect-ratio: var(--tv-ar-m);
  z-index:24;
  container-type: size;
  isolation: isolate;
}

/* слой экрана телевизора (под рамкой) */
.anchor--tv::after{
  content:"";
  position:absolute; inset:0;
  background: center / contain no-repeat;
  background-image: url("./bgicons/tv-background.png");
  pointer-events:none;
  z-index:1;
}

/* TV underlay must stay visible at all times; lite content is rendered above it. */
.anchor--tv.is-lite-ready::after{
  opacity:1;
}

.anchor--tv .tv-lite-host{
  position:absolute;
  /* Экран телевизора без ножки (по маске tv-background.png: 904x557 в 1000x783) */
  inset: 5.15% 5.13% 24.35% 5.37%;
  pointer-events:none;
  overflow:hidden;
  z-index:2;
}

.anchor--tv .tv-lite-layer{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  overflow:hidden;
  opacity:0;
  transition:opacity .18s linear;
  contain:layout paint size;
}

.anchor--tv .tv-lite-layer.is-visible{
  opacity:1;
}

.anchor--tv .tv-lite-stage{
  position:absolute;
  left:0;
  top:0;
  width:800px;
  height:420px;
  overflow:hidden;
  transform-origin:top left;
  background:transparent;
  -webkit-text-size-adjust:none;
  text-size-adjust:none;
}

.anchor--tv .tv-lite-chat{
  position:absolute;
  left:0.47%;
  top:9.08%;
  width:36%;
  height:80%;
  overflow:hidden;
  color:#fff;
  font-size:13px;
  line-height:1.14;
  text-shadow:0 0 6px rgba(0,0,0,.75);
  z-index:50;
}

.anchor--tv .tv-lite-chat-lines{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  box-sizing:border-box;
  padding:2px 4px 5px 0;
  overflow:hidden;
}

.anchor--tv .tv-lite-chat-row{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  font-size:13px;
  line-height:1.14;
  font-weight:400;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.anchor--tv .tv-lite-chat-author{
  color:#fff;
  font-weight:800;
}

.anchor--tv .tv-lite-tiles{
  position:absolute;
  inset:0;
  z-index:10;
}

.anchor--tv .tv-lite-tiles[data-count="0"]{
  display:none;
}

.anchor--tv .tv-lite-photo{
  position:absolute;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:0;
  box-shadow:none;
  background:transparent;
}

.anchor--tv .tv-lite-caption{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  overflow:hidden;
  padding:1px 8px;
  background:rgba(255,255,255,.97);
  color:#000;
  font-size:10px;
  line-height:1;
  font-weight:700;
  text-align:center;
  word-break:break-word;
  overflow-wrap:anywhere;
  z-index:12;
}

.anchor--tv .tv-lite-leaderboard{
  position:absolute;
  left:38.84%;
  top:52.9%;
  width:19.3%;
  height:35.5%;
  border-radius:10px;
  background:linear-gradient(180deg, rgba(8,15,30,.886) 0%, rgba(4,6,13,.839) 100%);
  border:1px solid rgba(255,231,152,.62);
  box-shadow:0 0 16px rgba(0,0,0,.52);
  overflow:hidden;
  display:grid;
  grid-template-rows:auto auto 1fr;
  padding:5px 7px;
  z-index:30;
}

.anchor--tv .tv-lite-leaderboard-head{
  display:grid;
  justify-items:center;
  gap:0;
  margin-bottom:1px;
}

.anchor--tv .tv-lite-leaderboard-head span{
  line-height:1.1;
  text-shadow:none;
}

.anchor--tv [data-tv-lite-leaderboard-title]{
  color:rgba(255,231,152,1);
  font-size:9px;
  font-weight:800;
}

.anchor--tv [data-tv-lite-leaderboard-game]{
  color:rgba(184,224,255,.863);
  font-size:10px;
  font-weight:700;
  margin-top:1px;
}

.anchor--tv .tv-lite-leaderboard-cols,
.anchor--tv .tv-lite-leaderboard-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:4px;
}

.anchor--tv .tv-lite-leaderboard-cols span{
  color:rgba(255,255,255,.863);
  font-size:6px;
  font-weight:700;
  line-height:1.1;
}

.anchor--tv .tv-lite-leaderboard-rows{
  display:grid;
  align-content:stretch;
  grid-auto-rows:minmax(0, 1fr);
  overflow:hidden;
  margin-top:1px;
}

.anchor--tv .tv-lite-leaderboard-row span{
  min-width:0;
  font-size:7.5px;
  font-weight:650;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.anchor--tv .tv-lite-leaderboard-rank,
.anchor--tv .tv-lite-leaderboard-name{
  color:rgba(255,255,255,.96);
}

.anchor--tv .tv-lite-leaderboard-score{
  color:rgba(255,231,152,.96);
  text-align:right;
  font-variant-numeric:tabular-nums;
}

.anchor--tv .tv-lite-ad-banner{
  position:absolute;
  left:38.84%;
  top:81.69%;
  width:19.3%;
  height:17.28%;
  border-radius:12px;
  object-fit:fill;
  display:block;
  pointer-events:none;
  z-index:25;
}

/* слой рамки телевизора (поверх экрана) */
.anchor--tv::before{
  content:"";
  position:absolute; inset:0;
  background: center / contain no-repeat;
  background-image: url("./bgicons/tv.png");
  pointer-events:none;
  filter: drop-shadow(0 5px 1px rgba(0,0,0,.35));
  z-index:3;
}

.anchor--tv::before,
.anchor--tv::after,
.anchor--tv .tv-lite-host{
  transition: transform .09s ease;
  transform-origin: center center;
}

.anchor--tv.is-pressed::before,
.anchor--tv.is-pressed::after,
.anchor--tv.is-pressed .tv-lite-host{
  transform: scale(.985);
}

/* small */
@media (max-width:375px){
  .anchor--tv{
    left:  calc(var(--tv-x-s)/var(--design-w)*100%);
    top:   calc(var(--tv-y-s)/var(--design-h)*100%);
    width: calc(var(--tv-w-s)/var(--design-w)*100%);
    /* было: height: calc(...); — УДАЛИТЬ */
    aspect-ratio: var(--tv-ar-s);
  }
}

/* large */
@media (min-width:768px){
  .anchor--tv{
    left:  calc(var(--tv-x-l)/var(--design-w)*100%);
    top:   calc(var(--tv-y-l)/var(--design-h)*100%);
    width: calc(var(--tv-w-l)/var(--design-w)*100%);
    /* было: height: calc(...); — УДАЛИТЬ */
    aspect-ratio: var(--tv-ar-l);
  }
}

/* Листочек на ТВ — внутри якоря (проценты пересчитаны из твоих координат) */
.anchor--tv .hotspot--wintable{
  position:absolute;
  left: 96.304%;
  top:  41.414%;
  width: 29.961%;
  height:54.545%;
  transform: translate3d(-50%, -50%, 0);
  z-index:32; /* поверх тв */
}

.anchor--tv .hotspot--tv-streams{
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:100%;
  transform: translate3d(-50%, -50%, 0);
  z-index:4; /* над ТВ-слоями, но под листочком-лидерами */
}
/* Когда телевизор маленький (≈226px ширины) — SMALL */
@container (max-width: 240px){
  .anchor--tv .hotspot--wintable{
    left: 96.239%;
    top:  47.126%;
    width: 23.009%;
    height:42.529%;
  }
}

/* Когда телевизор большой (≈420px ширины) — LARGE */
@container (min-width: 550px){
  .anchor--tv .hotspot--wintable{
    left: 92.857%;
    top:  45.356%;
    width: 22.381%;
    height:41.176%;
  }
}


/* ФОЛБЭК, если @container не поддерживается */
@supports not (container-type: size){
 @media (max-width:375px){
    .anchor--tv .hotspot--wintable{
      left: 96.239%;
      top:  47.126%;
      width:23.009%;
      height:42.529%;
    }
  }
 @media (min-width:768px){
    .anchor--tv .hotspot--wintable{
      left: 92.857%;
      top:  45.356%;
      width:22.381%;
      height:41.176%;
    }
  }
}

/* === ПЕНЬ (якорь) — по твоим stump-переменным === */
.anchor--stump{
  left:  calc(var(--stump-x-m)/var(--design-w)*100%);
  top:   calc(var(--stump-y-m)/var(--design-h)*100%);
  width: calc(var(--stump-w-m)/var(--design-w)*100%);
  height:calc(var(--stump-h-m)/var(--design-h)*100%);
  z-index:30;
  container-type: size;
  isolation: isolate;
}

/* сам пень (кнопка) занимает якорь целиком, иконка у неё уже в ::before */
.anchor--stump .hotspot--stump{
  position:absolute;
  left:50%; top:50%;
  width:100%; height:100%;
  transform: translate(-50%, -50%);
}

/* надпись у пенька — внутри якоря; проценты пересчитаны */
.anchor--stump .decal--photohereru{
  position:absolute;
  left: 40.294%;
  top:  67.606%;
  width: 44.706%;
  height:49.296%;
  transform: translate(-50%, -50%);
  pointer-events:none;
  z-index:31; /* над пнём, но не ловит клики */
  display:flex;
  align-items:center;
  justify-content:center;
}

.anchor--stump .decal--photohereru .photohereru-content{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  width:max-content;
  max-width:140%;
  min-width:0;
  transform:translate(-1px, 5px) rotate(10deg);
  transform-origin:center center;
}

.anchor--stump .decal--photohereru .photohereru-label,
.anchor--stump .decal--photohereru .photohereru-remaining{
  display:block;
  min-width:0;
  margin:0;
  padding:0;
  text-align: center;
  white-space: nowrap;
  text-rendering:optimizeLegibility;
  color:#B97923;
  -webkit-text-stroke:1.5px rgba(70, 39, 12, 0.55);
  text-shadow:
    0 1px 0 rgba(70, 39, 12, 0.325),
    0 2px 4px rgba(0, 0, 0, 0.175);
}

.anchor--stump .decal--photohereru .photohereru-label{
  font-family:"Russo One","Arial Black",system-ui,sans-serif;
  font-size:clamp(16px, 4.7vw, 41px);
  line-height:1.5;
  letter-spacing:.5px;
  text-transform:uppercase;
  white-space:pre-line;
  transform:translateY(-2px);
}

.anchor--stump .decal--photohereru .photohereru-remaining{
  display:none;
}

/* small */
@media (max-width:375px){
  .anchor--stump{
    left:  calc(var(--stump-x-s)/var(--design-w)*100%);
    top:   calc(var(--stump-y-s)/var(--design-h)*100%);
    width: calc(var(--stump-w-s)/var(--design-w)*100%);
    height:calc(var(--stump-h-s)/var(--design-h)*100%);
  }
  .anchor--stump .decal--photohereru{
    left: 39.655%;
    top:  67.355%;
    width:44.828%;
    height:49.587%;
  }
  .anchor--stump .decal--photohereru .photohereru-content{
    transform:translate(-1px, 3px) rotate(10deg);
  }
}

@media (min-width:376px) and (max-width:767px){
  .anchor--stump .decal--photohereru .photohereru-content{
    transform:translate(-1px, 2px) rotate(10deg);
  }
  .anchor--stump .decal--photohereru .photohereru-label{
    font-size:19px;
    font-weight:800;
  }
}

/* large */
@media (min-width:768px){
  .anchor--stump{
    left:  calc(var(--stump-x-l)/var(--design-w)*100%);
    top:   calc(var(--stump-y-l)/var(--design-h)*100%);
    width: calc(var(--stump-w-l)/var(--design-w)*100%);
    height:calc(var(--stump-h-l)/var(--design-h)*100%);
  }
  .anchor--stump .decal--photohereru{
    left: 41.597%;
    top:  68.939%;
    width:46.218%;
    height:51.515%;
  }
  .anchor--stump .decal--photohereru .photohereru-content{
    gap:2px;
    transform:translate(-1px, 3px) rotate(10deg);
  }
  .anchor--stump .decal--photohereru .photohereru-label{
    font-size:28px;
    font-weight:800;
    transform:translateY(-1px);
  }
}

  /* Иконка «листочек на телевизоре» поверх зоны клика */
.hotspot--wintable::before{
  content:"";
  position:absolute;
  inset:0;
  background: center / contain no-repeat;
  /* если есть ретина-ресурс */
  background-image: 
    url("./bgicons/wintable.png");
  pointer-events: none;                     /* клики идут в кнопку */
  filter: drop-shadow(0 5px 1px rgba(0,0,0,.35)); /* мягкая тень */
}
  /* легкий «отклик» по нажатию — по желанию */
.hotspot--wintable:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}


/* Иконка пня как фон у хотспота (APNG) */
.hotspot--stump::before{
  content:"";
  position:absolute;
  inset:0;                              /* ровно по размеру хотспота */
  background:center/contain no-repeat;
  /* если есть retina-файл stump@2x.png — оставь image-set,
     если нет @2x — можешь заменить на обычный url("stump-v3.png") */
  background-image:
    url("./bgicons/stump-v3.png");
 
  /* ТЕНЬ ВОКРУГ СИЛУЭТА */
  filter: drop-shadow(0 5px 1px rgba(0,0,0,.35));
  will-change: filter;
  pointer-events:none;
  z-index:1; 
}

/* легкий «отклик» по нажатию — по желанию */
.hotspot--stump:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}


/* подарок */
.hotspot--gift{
  left:calc(var(--gift-x-m)/var(--design-w)*100%); top:calc(var(--gift-y-m)/var(--design-h)*100%);
  width:calc(var(--gift-w-m)/var(--design-w)*100%); height:calc(var(--gift-h-m)/var(--design-h)*100%);
  z-index:30;
}
/* Иконка подарка внутри кликабельной зоны */
.hotspot--gift::before{
  content:"";
  position:absolute;
  inset:0;
  background:center/contain no-repeat;
  background-image: url("./bgicons/gift.png"); /* без @2x — ок */
  
  /* ТЕНЬ ВОКРУГ СИЛУЭТА */
  filter: drop-shadow(0 5px 1px rgba(0,0,0,.35));
  will-change: filter;
  pointer-events:none;
  z-index:1; 
}
/* легкий «отклик» по нажатию — по желанию */
.hotspot--gift:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}


/* дневник */
.hotspot--notebook{
  left:calc(var(--notebook-x-m)/var(--design-w)*100%); top:calc(var(--notebook-y-m)/var(--design-h)*100%);
  width:calc(var(--notebook-w-m)/var(--design-w)*100%); height:calc(var(--notebook-h-m)/var(--design-h)*100%);
  z-index:30;
}

/* Иконка «дневник/профиль» в зоне клика */
.hotspot--notebook::before{
  content:"";
  position:absolute;
  inset:0;
  background: center / contain no-repeat;
  background-image: url("./bgicons/notebook.png"); /* один ресурс (без @2x) */
  pointer-events: none;                              /* клики идут в кнопку */
  filter: drop-shadow(0 5px 1px rgba(0,0,0,.35));   /* тень как у других */
}

/* лёгкий отклик по нажатию — по желанию */
.hotspot--notebook:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}


/* плюс-облако как отдельный слой (фон картинкой) */
.hotspot--plus{
  left:  calc(var(--plus-x-m) / var(--design-w, 393) * 100%);
  top:   calc(var(--plus-y-m) / var(--design-h, 853) * 100%);
  width: calc(var(--plus-w-m) / var(--design-w, 393) * 100%);
  height:calc(var(--plus-h-m) / var(--design-h, 853) * 100%);
  z-index:22;
}

/* фон облака — на 0-м уровне */
.hotspot--plus::before{
  content:"";
  position:absolute; inset:0;
  background:center/contain no-repeat;
  background-image:image-set(
    url("./bgicons/cloud-plus-v3.png") 1x,
    url("./bgicons/cloud-plus-v3.png") 2x
  );
  pointer-events:none;
  z-index:0;                 /* было -1 — могло уехать «под» сцену */
}
  /* легкий «отклик» по нажатию — по желанию */
.hotspot--plus:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}

/* контент внутри облака — поверх фона */
.hotspot--plus .plus-ui{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  padding-left: var(--plus-padleft-m);
  pointer-events:none;
  z-index:1;
}

.hotspot--plus .plus-value{
  color:#F6E3A8;
  font-weight:800;
  font-size:var(--plus-font-m);
  line-height:1; letter-spacing:.5px;
  text-shadow:0 2px 4px rgba(0,0,0,.25);
}
.hotspot--plus .plus-currency{
  width:var(--plus-icon-m); height:var(--plus-icon-m);
  flex:0 0 auto; filter:drop-shadow(0 2px 2px rgba(0,0,0,.25));
  margin-left:2px;
}

/* ====== small ====== */
@media (max-width:375px){
  .stage{--design-w:var(--sw); --design-h:var(--sh)}
  .hotspot--plus{
    left:calc(var(--plus-x-s)/var(--design-w)*100%); top:calc(var(--plus-y-s)/var(--design-h)*100%);
    width:calc(var(--plus-w-s)/var(--design-w)*100%); height:calc(var(--plus-h-s)/var(--design-h)*100%);
  }
  .hotspot--gift{
    left:calc(var(--gift-x-s)/var(--design-w)*100%); top:calc(var(--gift-y-s)/var(--design-h)*100%);
    width:calc(var(--gift-w-s)/var(--design-w)*100%); height:calc(var(--gift-h-s)/var(--design-h)*100%);
  }
  .hotspot--notebook{
    left:calc(var(--notebook-x-s)/var(--design-w)*100%); top:calc(var(--notebook-y-s)/var(--design-h)*100%);
    width:calc(var(--notebook-w-s)/var(--design-w)*100%); height:calc(var(--notebook-h-s)/var(--design-h)*100%);
  }

  :root{
    --plus-font-m:14px;
    --plus-icon-m:16px;
    --plus-gap-m:0px;
    --plus-padleft-m:40px;
  }
}

/* Typography for plus cloud on <=375 */
@media (max-width:375px){
  :root{
    --plus-font-m:14px;
    --plus-icon-m:16px;
  }
}

/* Extra small */
@media (max-width:340px){
  :root{
    --plus-font-m:12px;
    --plus-icon-m:14px;
  }
}

/* ====== large ====== */
@media (min-width:768px){
  .stage{--design-w:var(--lw); --design-h:var(--lh)}
  .hotspot--plus{
    left:calc(var(--plus-x-l)/var(--design-w)*100%); top:calc(var(--plus-y-l)/var(--design-h)*100%);
    width:calc(var(--plus-w-l)/var(--design-w)*100%); height:calc(var(--plus-h-l)/var(--design-h)*100%);
  }
  .hotspot--gift{
    left:calc(var(--gift-x-l)/var(--design-w)*100%); top:calc(var(--gift-y-l)/var(--design-h)*100%);
    width:calc(var(--gift-w-l)/var(--design-w)*100%); height:calc(var(--gift-h-l)/var(--design-h)*100%);
  }
  .hotspot--notebook{
    left:calc(var(--notebook-x-l)/var(--design-w)*100%); top:calc(var(--notebook-y-l)/var(--design-h)*100%);
    width:calc(var(--notebook-w-l)/var(--design-w)*100%); height:calc(var(--notebook-h-l)/var(--design-h)*100%);
  }

  :root{
    --plus-font-m:26px;
    --plus-icon-m:28px;
    --plus-gap-m:0px;
    --plus-padleft-m:60px;
  }
}

/* убираем системный tap-highlight и фокус-обводку */
.hotspot,
.hotspot:active,
.hotspot:focus,
.hotspot:focus-visible{
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

/* на тач-устройствах фокус не нужен — оставим его только для клавиатуры */
@media (hover: none) and (pointer: coarse) {
  .hotspot:focus,
  .hotspot:focus-visible { outline: none; }
}

/* псевдо-слой фона облака не перехватывает события и не мигает */
.hotspot--plus::before {
  pointer-events: none;
  backface-visibility: hidden;
  
}

/* FAQ хотспот  */
.hotspot--faq{
  left:  calc(var(--faq-x-m)/var(--design-w, 393)*100%);
  top:   calc(var(--faq-y-m)/var(--design-h, 853)*100%);
  width: calc(var(--faq-w-m)/var(--design-w, 393)*100%);
  height:calc(var(--faq-h-m)/var(--design-h, 853)*100%);
  z-index:25;
}

/* Иконка FAQ поверх фона сцены */
.hotspot--faq::before{
  content:"";
  position:absolute;
  inset:0;
  background:center / contain no-repeat;
  /* fallback для браузеров без image-set */
  background-image:url("./bgicons/faq.png");
  /* ретина-ресурсы */
  background-image:image-set(
    url("./bgicons/faq.png") 1x,
    url("./bgicons/faq@2x.png") 2x
  );
  pointer-events:none;                 /* чтобы клики шли в кнопку */
}
  /* легкий «отклик» по нажатию — по желанию */
.hotspot--faq:active{
  transform: translate3d(-50%, -50%, 0) scale(.98);
}


/* small */
@media (max-width:375px){
  .hotspot--faq{
    left:  calc(var(--faq-x-s)/var(--design-w)*100%);
    top:   calc(var(--faq-y-s)/var(--design-h)*100%);
    width: calc(var(--faq-w-s)/var(--design-w)*100%);
    height:calc(var(--faq-h-s)/var(--design-h)*100%);
  }
}

/* large */
@media (min-width:768px){
  .hotspot--faq{
    left:  calc(var(--faq-x-l)/var(--design-w)*100%);
    top:   calc(var(--faq-y-l)/var(--design-h)*100%);
    width: calc(var(--faq-w-l)/var(--design-w)*100%);
    height:calc(var(--faq-h-l)/var(--design-h)*100%);
  }
}

/* 3) iOS rounding fix – заставим WebKit рисовать слой чётче */
@supports (-webkit-touch-callout: none) {
  .stage__img{ transform: translateZ(0); will-change: transform; }
}

/* ====== модалка ====== */
.modal{position:fixed; top:0; left:0; right:0; bottom:auto; height:var(--app-h, 100dvh); z-index:1000; display:grid; place-items:center}
.modal[hidden]{ display:none }
.modal__backdrop{position:absolute; inset:0; background:rgba(0,0,0,.5)}
.modal__dialog{
  position:relative; width:min(560px,calc(100vw - 24px)); max-width:560px;
  border-radius:var(--radius-card); background:var(--popup-bg); box-shadow:var(--shadow); padding:36px 16px 22px;
}
.modal__content{
  max-height: none;    /* снимем ограничение высоты */
  overflow: visible;   /* ничего не обрезаем и не скроллим */
}

/* Крестик в кружке — идеальное центрирование на мобилках */
.modal__close{
  position:absolute;
  top:10px;
  right:12px;
  left:auto;

  width:26px;
  height:26px;
  border-radius:999px;

  background: rgba(0,0,0,.55);   /* темно-серый кружок */
  border:0;
  padding:0;

  display:flex;
  align-items:center;
  justify-content:center;

  /* прячем текстовый символ ×, чтобы он не влиял */
  color: transparent;
  font-size: 0;
  line-height: 0;

  cursor:pointer;
  -webkit-tap-highlight-color: transparent;
}

.modal__close::before,
.modal__close::after{
  content:"";
  position:absolute;
  width:12px;
  height:2px;
  background:#fff;              /* белый крестик */
  border-radius:2px;
}

.modal__close::before{ transform: rotate(45deg); }
.modal__close::after { transform: rotate(-45deg); }


.modal__close:active{
  transform: translateY(1px);
}

/* второй слой поверх основной модалки */
.modal--stack{ z-index: 1101; }

/* FAQ: делаем диалог сплошным (без прозрачности) */
.modal__dialog:has(.faq-popup){
  background: var(--chip);      /* сплошная заливка */
}

/* (опционально) чтобы не было «карточка на карточке» */
.modal__dialog:has(.faq-popup) .chip{
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* крестик на светлом фоне — тёмный */
.modal__dialog:has(.faq-popup) .modal__close{
  color:#000;
}

/* Декоративные наклейки поверх фона, под хотспотами */
.decal{
  position:absolute;
  transform: translate3d(-50%, -50%, 0); /* используем центр-координаты */
  pointer-events:none;                   /* не перехватывают клики */
  z-index:18;                            /* ниже хотспотов (20–30), выше фона */
  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;               /* сохраняем пропорции */
}


/* PHOTOHERERU (текст у пенька) — medium */
.decal--photohereru{
  z-index:31;
}
  

/* ====== попапы: общие ====== */
.popup{display:grid; gap:12px; justify-items:center; width:100%; max-width:420px; margin-inline:auto}

.u-center{
  display: flex;
  justify-content: center;
  align-items: center;     /* можно добавить, не повредит */
  width: 100%;
}
.chip{background:var(--chip); border:1px solid rgba(0,0,0,.06); border-radius:var(--radius-card)}

/* ====== попап 1: загрузка ====== */

/* Полноэкранная модалка с прокруткой для Правил */
.policy-popup{
  width:100%;
  max-width:520px;          /* как у других попапов */
  display:flex;
  flex-direction:column;
  gap:12px;
}
.policy-body{
  max-height:60vh;
  overflow:auto;
  padding:8px 0 12px;
  line-height:1.45;
}
.policy-check{
  display:flex; gap:8px; align-items:center;
}

/* Чтоб заголовок не «подлезал» под крестик */
.policy-popup .modal__title{
  padding-right: 48px;
}


.btn-pick,.btn-submit{
  display:inline-flex; align-items:center; justify-content:center;
  width:clamp(206px,90%,360px); height:56px; border-radius:var(--radius-pill);
  font-size:18px; font-weight:700; border:0; cursor:pointer;
}
.btn-pick{background:var(--chip); color:#000}
.btn-submit{background:var(--accent); color:#fff; box-shadow:0 6px 14px rgba(255,115,0,.25)}
/* неактивная */
.btn-submit:disabled{
  background:#777;
  color:#D9D9D9;
  box-shadow:none;
  cursor:not-allowed;
}
.card{width:100%; background:var(--chip); border-radius:var(--radius-card); padding:12px; border:1px solid rgba(0,0,0,.06)}
.slider-card{padding:14px}
.slider-card .slider-title{
  margin-bottom: 8px;
  color:#000;
  font-weight:500;
  font-size:14px;
  text-align:center;
  line-height:1.2;
}
.slider-row{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px}
.label{color:#000; font-weight:700; opacity:.75}
.range{-webkit-appearance:none; appearance:none; width:100%; height:16px; border-radius:200px; background:#D0D0D0; outline:none}
.range::-webkit-slider-thumb{-webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--accent); border:1px solid #fff; cursor:pointer}
.range::-moz-range-thumb{width:18px; height:18px; border-radius:50%; background:var(--accent); border:1px solid #fff; cursor:pointer}
.form-card{display:grid; gap:10px; padding:14px}
.form-card .form-note{
  font-weight: 800;
  text-align: center;
  margin: 6px 0 10px;
  color: #2b2b2b; /* тот же, что в тексте карточек */
  font-size: 14px;
  line-height: 1.25;
}
@media (max-width:375px),(max-height:667px){
  .form-card .form-note{ font-size: 13px; }
}

.field{width:100%; padding:14px 16px; border-radius:var(--radius-field); border:1px solid rgba(0,0,0,.08); background:#fff; color:#111; font:16px/1.4 inherit}
.field,
.promo-input,
textarea,
input {
  caret-color: var(--accent);
}
.field::placeholder{color:#9aa3b2; opacity:.8}
.field:focus{outline:2px solid rgba(255,115,0,.35)}
.field-wrap{ display:grid; gap:6px; }
.field-counter{
  font-size:12px; line-height:1; color:#000; opacity:.55;
  text-align:right;
}
.field:invalid{ outline:2px solid rgba(255,0,0,.35); }
/* Ряд: кнопка + круглый "!" */
.pick-row{
  position: relative;
  display: grid;
  grid-template-columns: 1fr 50px; /* кнопка растягивается, справа фикс 50px */
  gap: 8px;
  align-items: center;
}

/* круглый "!" справа от кнопки */
.btn-info{
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 0;
  cursor: pointer;
  background: #D9D9D9;
  color: #FF7300;
  font-weight: 800;
  font-size: 26px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 10px rgba(0,0,0,.12);
  -webkit-tap-highlight-color: transparent;
}
.btn-info:active{ transform: translateY(1px); }

/* overlay инпута — перекрывает ТОЛЬКО область левой кнопки */
.file-input-overlay{
  position: absolute;
  left: 0;
  top: 0;
  right: calc(50px + 8px);  /* ширина .btn-info + gap */
  bottom: 0;
  opacity: 0;
  cursor: pointer;
  /* для iOS/Android, чтобы клик точно попадал */
  -webkit-appearance: none;
  appearance: none;
}


/* ====== попап 2: магазин ====== */
.shop-header{width:100%; min-height:150px; display:grid; place-items:center; gap:4px; padding:14px 12px; margin-top: 8px; position:relative;}
.shop-header__icon{width:56px; height:auto; display:block}
.shop-title{margin:4px 0 0; font-size:22px; font-weight:800; color:#000}
.shop-subtitle{margin:0; font-size:14px; color:#000; opacity:.75}
.shop-topbar{
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  align-items:center;
}
.shop-topbar-spacer{
  display:none;
}
.shop-tabs{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:min(100%, 190px);
  min-height:34px;
  padding:4px;
  border-radius:999px;
  background:rgba(0,0,0,.08);
  justify-self:center;
}
.shop-top-close{
  position:absolute;
  top:12px;
  right:12px;
  width:30px;
  height:30px;
  border-radius:999px;
  border:0;
  padding:0;
  background:rgba(0,0,0,.55);
  color:transparent;
  font-size:0;
  line-height:0;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.shop-top-close::before,
.shop-top-close::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:2px;
  background:#fff;
  border-radius:2px;
}
.shop-top-close::before{ transform:translate(-50%, -50%) rotate(45deg); }
.shop-top-close::after{ transform:translate(-50%, -50%) rotate(-45deg); }
.shop-top-close:active{ transform:translateY(1px); }
.shop-tab{
  flex:1 1 0;
  height:28px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#000;
  font-size:13px;
  font-weight:900;
  line-height:1;
  -webkit-appearance:none;
  appearance:none;
}
.shop-tab.is-active{
  background:#fff;
  box-shadow:0 3px 8px rgba(0,0,0,.14);
}
.shop-panel{
  width:100%;
  display:grid;
  gap:10px;
}
.shop-panel[hidden],
.shop-popup [data-shop-panel][hidden]{
  display:none !important;
}
.shop-list{display:grid; width:100%; gap:10px}
.shop-item{
  width:100%; display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px;
  padding:12px 14px; border:0; background:var(--chip); border-radius:var(--radius-card); cursor:pointer;
}
.shop-item__left{display:flex; align-items:center; gap:10px; color:#000; font-weight:700}
.shop-item__left img{width:20px}
.shop-item__left .shop-ton-symbol{width:22px; height:22px}
.shop-item__right{display:flex; align-items:center; gap:8px; color:#000; font-weight:800}
.shop-item__right img{width:22px}
.shop-num{min-width:36px; text-align:right}
.shop-item--ton{
  cursor:default;
}
.shop-item--ton[aria-disabled="true"]{
  opacity:1;
  filter:none;
}
.shop-item:hover{filter:brightness(.98)}
@media (max-width:375px){
  .shop-header{min-height:100px; padding:10px 8px}
  .shop-header__icon{width:40px}
  .shop-title{font-size:18px}
  .shop-subtitle{font-size:12px}
  .shop-tabs{min-height:32px}
  .shop-tab{height:26px; font-size:12px}
  .shop-item{padding:10px 12px}
  .shop-item__left img,.shop-item__right img{width:18px}
}


/* ====== попап 3: призы ====== */
.prizes-popup{width:100%; max-width:420px; display:grid; gap:14px}

/* Сетка призов: всегда 3 колонки */
.prize-grid{
  display: grid;
  grid-template-columns: repeat(3, 100px);
  gap: 12px;
  justify-content: center;
}

/* Ровно 1 приз — строго по центру (2-я колонка) */
.prize-grid > .prize-item:only-child{
  grid-column: 2;
  justify-self: center;
}

/* Если внутри сетки один элемент, но это НЕ .prize-item (например "Пока нет призов") — центрируем */
.prize-grid > :only-child:not(.prize-item){
  grid-column: 1 / -1;     /* занять все 3 колонки */
  justify-self: center;    /* по центру */
  text-align: center;      /* текст по центру */
}


/* Элемент списка: чекбокс + квадрат 100x100 */ 
.prize-item{ 
  display: inline-flex; 
  flex-direction: column; 
  align-items: center; 
  gap: 8px; cursor: pointer; 
} 
/* Подсветка выбранного приза (рамка по периметру) */ 
.prize-item.is-selected .prize-card{ 
  box-shadow: inset 0 0 0 2px #FF7300, 0 0 0 1px rgba(0,0,0,.04);
} 
/* Квадрат под подарок (контейнер 100x100, скругление 12) */ 
.prize-card{ 
  width: 100px; 
  height: 100px; 
  border-radius: 12px; 
  background: #D9D9D9 center / cover no-repeat; 
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  transition: box-shadow .15s ease; /* приятнее подсветка */ 
} 
.prize-body{
  color:#000; opacity:.75; 
  font-size:12px
} 
.prize-title{
  font-weight:700;
  margin-bottom:4px; 
  opacity:.9
} 
.prize-sub{font-size:11px}

.btn-pay{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:220px; padding:0 18px; height:56px; border-radius:var(--radius-pill);
  border:0; cursor:pointer; background:#FF7300; color:#fff; font-weight:800; font-size:18px;
  box-shadow:0 6px 14px rgba(255,115,0,.25);
}
.btn-pay:disabled{background:#D9D9D9; color:#777; box-shadow:none; cursor:not-allowed}
.pay-note{margin:0; padding:0 4px 4px; text-align:center; color:#fff; opacity:.8; font-size:11px; line-height:1.3}

/* ====== попап 4: профиль ====== */
.profile-popup{width:100%; max-width:420px; display:grid; gap:14px}

/* ===== ШАПКА ПРОФИЛЯ: аватар слева, справа — ник и кнопка ===== */
.chip.profile-header{
  width:100%;
  background:transparent;
  border:0;
  padding:12px 14px 8px;

  display:grid;
  grid-template-columns:100px 1fr;   /* 1: аватар, 2: правая колонка */
  grid-auto-rows:min-content;
  column-gap:10px;                   /* ближе к аватару */
  row-gap:8px;                       /* маленький зазор ник↔кнопка */
  align-items:start;
}

/* Аватар — «липнет» к левому краю и занимает 2 строки */
.profile-header .avatar{
  grid-column:1;
  grid-row:1 / span 2;
  position:relative;
  width:100px; height:100px;
  border-radius:50%;
  background:#bbb center/cover no-repeat;
  overflow:visible;
}

.profile-header .avatar.is-clickable{
  cursor:pointer;
  box-shadow: inset 0 0 0 2px rgba(255,115,0,.55);
}

.profile-header .avatar.is-clickable:active{
  transform: scale(.99);
}

.profile-header .avatar.is-uploading{
  opacity:.72;
  filter: saturate(.9);
}

/* Корона (подстрой при желании top/left/width) */
.profile-header .avatar.has-crown::before{
  content:'';
  position:absolute;
  top:-50px; left:24px;
  width:100px; aspect-ratio:1.45;
  background:center/contain no-repeat;
  background-image:image-set(
    url('./bgicons/crown.png') 1x,
    url('./bgicons/crown@2x.png') 2x
  );
  pointer-events:none;
  z-index:2;
}

/* СБРОС старых areas, чтобы ничего не тянулось под всю шапку */
.profile-header .profile-id,
.profile-header .btn-premium{ grid-area:unset; }

/* Плашка ника — занимает всю ширину правой колонки, по правому краю */
.profile-header .profile-id{
  grid-column:2; grid-row:1;
  justify-self:stretch;               /* ширина = ширине колонки */
  background:#D9D9D9;
  border-radius:12px;
  padding:10px 14px;
  color:#000; font-weight:700; line-height:1.2; text-align:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Кнопка — под ником, выровнена по правому краю. */
.profile-header .btn-premium{
  grid-column:2; grid-row:2;
  justify-self:start;
  max-width:calc(100% - 58px);
  position:relative;
  display:flex; align-items:center; justify-content:center; text-align:center;

  padding:10px 18px;
  border-radius:var(--radius-pill); border:0; cursor:pointer;
  background:#FF7300; color:#fff; font-weight:800; font-size:15px; line-height:1.1;
}

/* «?» ОТДЕЛЬНО от кнопки, в выделенном справа месте (gap 8px) */
.profile-header .btn-premium::after{
  content:'?';
  position:absolute;
  left:100%;
  top:50%;
  transform:translate(8px,-50%);     /* gap = 8px */
  width:50px; 
  height:50px; 
  border-radius:50%;
  background:#D9D9D9; 
  color:#FF7300; 
  font-weight:800; 
  font-size:26px;
  display:flex; 
  align-items:center; 
  justify-content:center;
  pointer-events:none;
}

/* Состояния */
.btn-premium[disabled]{
  background:#D9D9D9; color:#777; cursor:not-allowed;
}

/* Когда премиум активен — плашка тоже с «?» */
.btn-premium.is-owned{
  justify-self:start;
  max-width:calc(100% - 58px);           
  background:#14AE5C; 
  color:#fff; 
  cursor:default;
  padding:10px 18px;
}

@media (max-width: 340px){
  .profile-header .btn-premium,
  .btn-premium.is-owned{
    font-size: 11px;
  }
}

:root {
--popup-bg: rgba(221, 221, 221, 0.25);
--chip-bg: #D9D9D9; /* уже используется внутри приложения для чипов */
--radius-xxl: 42px; /* скругления попапов по ТЗ */
}


.lang-switch {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
background: var(--popup-bg);
border-radius: var(--radius-xxl);
padding: 8px 16px;
margin: 16px auto 0; /* отступ сверху от плашки "Время показа фото" */
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
/* Центрирование внизу секции попапа */
position: relative;
left: 50%;
transform: translateX(-50%);
}


.lang-switch__divider {
opacity: 0.6;
}


.lang-switch__btn {
appearance: none;
-webkit-appearance: none;
border: 0;
background: #D9D9D9; /* фон самого попапа — как просили */
color: inherit;
font: inherit;
padding: 6px 10px;
border-radius: calc(var(--radius-xxl) - 12px);
line-height: 1;
cursor: pointer;
transition: transform .12s ease;
touch-action: manipulation;
-webkit-tap-highlight-color: transparent;
}
.lang-switch__btn:active { transform: scale(0.98); }


.lang-switch__btn.is-active {
background: #FF7300; /* оранжевый активный */
color:#fff;
}

.profile-account-entry{
  appearance:none;
  border:0;
  border-radius:var(--radius-xxl);
  min-height:44px;
  min-width:134px;
  padding:8px 16px;
  background:#FF7300;
  color:#fff;
  font-weight:800;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.profile-account-entry:active{
  transform:scale(.98);
}


/* Небольшая адаптация для очень узких экранов */
@media (max-width: 360px) {
.lang-switch { gap: 8px; padding: 6px 12px; }
.lang-switch__btn { padding: 5px 8px; }
}

/* ===== Премиум: сравнительная таблица ===== */
.premium-compare{width:100%; max-width:420px;}
.pc-title{
  font-size:18px;
  font-weight:800;
  text-align:center;
  color:#000;
  margin: 6px 0 16px;    }

.pc-table{
  display:grid;
  grid-template-columns: 1fr 96px 96px; /* название + 2 колонки планов */
  gap:10px 8px;
  align-items:center;
}

.pc-head{
  font-size:11px; text-transform:uppercase; letter-spacing:.02em;
  opacity:.6; font-weight:800; text-align:center;
  color:#555;
}
.pc-head:first-child{
  text-align:left;  
}
.pc-head.is-premium{
  color:#FF7300;
  opacity:1;
}

.pc-row{ display:contents; } /* чтобы строки заносили ячейки напрямую в grid */

.pc-name{
  font-size: 14px;                    /* было крупнее — сделали компактнее */
  font-weight: 600;                   /* было 700 — сделали тоньше */
  line-height: 1.25;
  color:#000;                         /* чёткий чёрный */
  opacity:.9;
}

.pc-val{
  text-align:center; padding:6px 8px; border-radius:10px;
  background:rgba(255,115,0,.08); font-weight:800;
  color:#FF7300;
  box-shadow:inset 0 0 0 1px rgba(255,115,0,.15);
}
.pc-val.is-premium{
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
  color:#000;
}
.pc-badge{ font-size:16px; }

.pc-val.is-premium.pc-badge{
  color:var(--plam-green) !important;
}

.premium-compare .pc-row:last-child .pc-val.is-premium{
  color:var(--plam-green) !important;
}

.pc-note{
  text-align:center;
  margin: 18px 0 22px;                /* ↑ больше зазор над таблицей и перед кнопкой */
  color:#2b2b2b;                      /* темнее для читаемости */
  opacity:.95;                        /* почти без прозрачности */
  font-size:12.5px;
  line-height:1.4;
}

@media (max-width:360px){
  .pc-table{ grid-template-columns: 1fr 84px 84px; }
  .pc-title{ font-size:17px; }
}





/* Карточки профиля */
.profile-card{width:100%; background:var(--chip); border-radius:var(--radius-card); padding:12px; display:grid; gap:8px; border:1px solid rgba(0,0,0,.06)}
.row{display:flex; align-items:center; justify-content:space-between; gap:10px}
.label-left{color:#000; font-weight:700}
.val-right{color:#000; font-weight:800}
.pill{min-width:28px; height:28px; padding:0 10px; display:inline-flex; align-items:center; justify-content:center; border-radius:14px; color:#fff; font-weight:800; font-size:14px}
.pill-orange{background:#FF7300}
.pill-green{background:#14AE5C}
.hint{
  color:#000; 
  opacity:.75; 
  font-size:12px;
  white-space: pre-line;
}

.profile-account-popup,
.profile-password-popup{
  width:100%;
  max-width:420px;
  display:grid;
  gap:12px;
  min-height: var(--profile-stack-base-h, 0px);
  align-content: stretch;
}

.profile-password-popup{
  --password-art-left:-30px;
  --password-art-bottom:-38px;
  --password-art-width:min(calc((100% + 34px) * 0.8), 346px);
  position:relative;
  min-height:0;
  padding-bottom:clamp(170px, 45vw, 208px);
  overflow:visible;
}

.profile-password-popup::after{
  content:"";
  position:absolute;
  left:var(--password-art-left);
  bottom:var(--password-art-bottom);
  width:var(--password-art-width);
  aspect-ratio:1355 / 1101;
  background:url("./bgicons/password-safety.png?v=20260525h") left bottom / contain no-repeat;
  pointer-events:none;
  z-index:0;
}

.profile-password-bubble{
  --password-bubble-center-x:67.93%;
  --password-bubble-copy-top:11.8%;
  --password-bubble-copy-height:34.8%;
  position:absolute;
  left:var(--password-art-left);
  bottom:var(--password-art-bottom);
  width:var(--password-art-width);
  aspect-ratio:1355 / 1101;
  pointer-events:none;
  z-index:2;
}

.profile-password-bubble-copy{
  position:absolute;
  left:var(--password-bubble-center-x);
  top:var(--password-bubble-copy-top);
  height:var(--password-bubble-copy-height);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  color:#111;
  text-align:center;
  font-size:18px;
  line-height:1.04;
  font-weight:800;
  letter-spacing:-0.03em;
  word-break:break-word;
  white-space:pre-line;
  transform:translateX(-50%);
}

.profile-password-bubble-copy.is-default{
  width:58%;
  font-size:20px;
  line-height:1.03;
}

.profile-password-bubble-copy.is-alt{
  width:60%;
  font-size:15px;
  line-height:1.04;
  letter-spacing:-0.02em;
  padding:8px 12px;
}

.profile-account-card{
  width:100%;
  background:var(--chip);
  border-radius:16px;
  padding:14px;
  border:1px solid rgba(0,0,0,.06);
  display:grid;
  gap:10px;
}

.profile-account-popup .profile-account-card,
.profile-password-popup .profile-account-card{
  min-height: 100%;
}

.profile-password-popup .profile-account-card{
  min-height:auto;
  align-content:start;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.06);
  position:relative;
  overflow:visible;
  z-index:1;
}

.profile-account-row{
  display:grid;
  gap:6px;
}

.profile-password-popup .profile-account-row{
  gap:0;
}

.profile-account-box{
  position:relative;
}

.profile-account-box--color{
  min-height:146px;
  border-radius:12px;
  border:2px solid #FF7300;
  background:#d9d9d9;
  overflow:visible;
}

.profile-account-color{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
  padding:0;
  border:0;
  background:transparent;
}

.profile-account-color::-webkit-color-swatch-wrapper{
  padding:0;
}

.profile-account-color::-webkit-color-swatch{
  border:3px solid rgba(0,0,0,.18);
  border-radius:50%;
}

.profile-chat-color-panel{
  width:100%;
  min-height:100%;
  padding:12px 28px 16px;
  display:grid;
  grid-template-columns: 116px 116px;
  justify-content:center;
  gap:18px;
  align-items:center;
}

.profile-chat-color-swatches{
  display:grid;
  grid-template-columns:repeat(2, 42px);
  gap:12px;
  width:96px;
  justify-self:center;
  transform:none;
}

.profile-chat-color-swatch{
  position:relative;
  width:100%;
  aspect-ratio:1 / 1;
  border:0;
  border-radius:50%;
  background:transparent;
  box-shadow:none;
}

.profile-chat-color-swatch::before{
  content:"";
  position:absolute;
  inset:2px;
  border-radius:50%;
  background: var(--profile-color, #ffffff);
  box-shadow:
    0 0 0 2px rgba(255,255,255,.92),
    0 0 0 4px rgba(0,0,0,.14),
    inset 0 1px 1px rgba(255,255,255,.55);
}

.profile-chat-color-swatch.is-active{
  box-shadow: 0 0 0 3px rgba(20,174,92,.95), 0 6px 12px rgba(0,0,0,.18);
}

.profile-chat-color-custom{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.profile-chat-color-custom.is-disabled{
  opacity:.78;
}

.profile-chat-color-custom__button{
  width:110px;
  height:110px;
  border:0;
  border-radius:50%;
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.56));
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.08), 0 8px 18px rgba(0,0,0,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.profile-chat-color-custom__swatch{
  width:82px;
  height:82px;
  border-radius:50%;
  background: var(--profile-current-color, #ffffff);
  box-shadow:
    0 0 0 3px rgba(255,255,255,.92),
    0 0 0 6px rgba(0,0,0,.14),
    inset 0 1px 1px rgba(255,255,255,.55);
}

.profile-chat-color-custom__lock{
  position:absolute;
  inset:50% auto auto 50%;
  width:110px;
  height:110px;
  transform:translate(-50%, -50%);
  border-radius:50%;
  background:linear-gradient(180deg, rgba(217,217,217,.08), rgba(217,217,217,.38));
  backdrop-filter: blur(2px);
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.08);
  pointer-events:none;
}

.profile-chat-color-custom__lock::after{
  content:"";
  position:absolute;
  inset:34px;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.35) 0 28%, transparent 29%),
    linear-gradient(135deg, rgba(255,115,0,.92), rgba(255,190,64,.92));
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.52);
}

.profile-chat-color-picker{
  position:fixed;
  inset:0;
  z-index:1600;
  display:grid;
  place-items:center;
  padding:24px;
}

.profile-chat-color-picker[hidden]{
  display:none !important;
}

.profile-chat-color-picker__backdrop{
  position:absolute;
  inset:0;
  border:0;
  background:rgba(4, 12, 33, .58);
  padding:0;
}

.profile-chat-color-picker__sheet{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:18px 18px 20px;
  border-radius:28px;
  border:2px solid #ff7300;
  background:linear-gradient(180deg, #e0e0e0 0%, #cfcfcf 100%);
  box-shadow:0 16px 34px rgba(0,0,0,.28);
}

.profile-chat-color-picker__close{
  top:10px;
  right:10px;
}

.profile-chat-color-picker__wheel-wrap{
  position:relative;
  width:260px;
  height:260px;
  padding:10px;
  border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.42), rgba(255,255,255,.12) 62%, rgba(0,0,0,.10) 100%);
  box-shadow:
    inset 0 0 0 4px var(--profile-wheel-active-color, #ffffff),
    0 10px 20px rgba(0,0,0,.16);
}

.profile-chat-color-picker__wheel{
  width:100%;
  height:100%;
  display:block;
  border-radius:50%;
  touch-action:none;
  user-select:none;
  filter:saturate(1.08) blur(.35px);
}

.profile-chat-color-picker__marker{
  position:absolute;
  top:50%;
  left:50%;
  width:18px;
  height:18px;
  margin:-9px 0 0 -9px;
  border-radius:50%;
  background:var(--profile-wheel-active-color, transparent);
  box-shadow:
    0 0 0 3px rgba(255,255,255,.98),
    0 0 0 5px rgba(0,0,0,.26),
    0 6px 12px rgba(0,0,0,.22);
  pointer-events:none;
}

.profile-chat-color-picker__apply{
  min-width:150px;
  height:48px;
  border:0;
  border-radius:var(--radius-pill);
  padding:0 26px;
  background:linear-gradient(180deg, #ff8a1f 0%, #ff7300 100%);
  box-shadow:0 8px 18px rgba(255,115,0,.28);
  color:#fff;
  font-size:15px;
  font-weight:800;
  line-height:1.1;
}

html:not([data-theme]) .profile-chat-color-picker__sheet,
html[data-theme="dark"] .profile-chat-color-picker__sheet{
  border-color: var(--plam-orange);
  background: var(--plam-shell-bg);
  box-shadow: 0 16px 34px rgba(0,0,0,.34);
}

html:not([data-theme]) .profile-chat-color-picker__wheel-wrap,
html[data-theme="dark"] .profile-chat-color-picker__wheel-wrap{
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.14), rgba(255,255,255,.04) 62%, rgba(0,0,0,.24) 100%);
}

@media (max-width:390px){
  .profile-chat-color-panel{
    padding:12px 22px 14px;
    grid-template-columns: 104px 104px;
    justify-content:center;
    gap:12px;
  }
  .profile-chat-color-swatches{
    grid-template-columns:repeat(2, 38px);
    width:88px;
    gap:10px;
    justify-self:center;
    transform:none;
  }
  .profile-chat-color-custom__button{
    width:94px;
    height:94px;
  }
  .profile-chat-color-custom__swatch{
    width:70px;
    height:70px;
  }
  .profile-chat-color-custom__lock{
    width:94px;
    height:94px;
  }
  .profile-chat-color-custom__lock::after{
    inset:28px;
  }
  .profile-chat-color-picker{
    padding:18px;
  }
  .profile-chat-color-picker__sheet{
    gap:14px;
    padding:14px 14px 18px;
    border-radius:24px;
  }
  .profile-chat-color-picker__close{
    top:8px;
    right:8px;
  }
  .profile-chat-color-picker__wheel-wrap{
    width:224px;
    height:224px;
    padding:9px;
  }
  .profile-chat-color-picker__marker{
    width:16px;
    height:16px;
    margin:-8px 0 0 -8px;
  }
  .profile-chat-color-picker__apply{
    min-width:136px;
    height:44px;
    font-size:15px;
  }
}

@media (max-width:375px){
  .profile-password-bubble-copy{
    font-size:16px;
  }
  .profile-password-bubble-copy.is-default{
    font-size:18px;
  }
  .profile-password-bubble-copy.is-alt{
    font-size:14px;
  }
}

.profile-account-input{
  width:100%;
  height:56px;
  border-radius:12px;
  border:2px solid #FF7300;
  background:#d9d9d9;
  padding:0 12px;
  color:#000;
  font-size:15px;
  font-weight:700;
  line-height:56px;
  text-align:center;
}
.password-field{
  position:relative;
}
.password-field .profile-account-input{
  padding-left:18px;
  padding-right:58px;
  text-align-last:center;
  direction:ltr;
}
.password-field .plam-web-auth-input{
  padding-right:44px;
}
.password-toggle{
  appearance:none;
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#2d3748;
  font-size:15px;
  line-height:1;
  cursor:pointer;
  user-select:none;
  outline:none;
  box-shadow:none;
  -webkit-tap-highlight-color: transparent;
}
.password-toggle:active{
  transform:translateY(-50%) scale(0.96);
}
.password-toggle:focus,
.password-toggle:focus-visible{
  outline:none;
  box-shadow:none;
}
.password-toggle:disabled{
  opacity:.55;
  cursor:default;
}

.profile-account-input[readonly]{
  background:#d9d9d9;
  color:#222;
}

.profile-account-corner{
  position:absolute;
  left:50%;
  bottom:2px;
  font-size:9px;
  font-weight:800;
  color:#fff;
  letter-spacing:.02em;
  line-height:1;
  text-transform:uppercase;
  pointer-events:none;
  background:#FF7300;
  border-radius:999px;
  padding:4px 8px 3px;
  max-width:calc(100% - 16px);
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transform:translateX(-50%);
  z-index:2;
}

.profile-account-corner--green{
  background:#14AE5C;
}

.profile-account-popup .profile-account-card{
  gap:14px;
}

.profile-account-popup .profile-account-row{
  gap:0;
}

.profile-account-popup .profile-account-box{
  display:grid;
  gap:8px;
}

.profile-account-popup .profile-account-box > .profile-account-corner{
  order:1;
  position:static;
  left:auto;
  bottom:auto;
  transform:none;
  display:block;
  max-width:none;
  padding:0;
  background:transparent;
  color:#5f5f5f;
  font-size:12px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:0;
  text-align:left;
  text-transform:none;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  pointer-events:none;
  margin:0;
}

.profile-account-popup .profile-account-box > .profile-account-input,
.profile-account-popup .profile-account-box > .password-field,
.profile-account-popup .profile-account-box > .profile-chat-color-panel,
.profile-account-popup .profile-account-box > .profile-chat-color-picker{
  order:2;
}

.profile-account-popup .profile-account-input{
  height:60px;
  border:0;
  border-radius:var(--radius-field);
  background:#f2f2f2;
  padding:0 16px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  color:#111;
  font-size:15px;
  font-weight:700;
  line-height:60px;
  text-align:center;
}

.profile-account-popup .profile-account-input[readonly]{
  background:#f2f2f2;
  color:#222;
}

.profile-account-popup .profile-account-box--color{
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}

.profile-account-popup .profile-account-box--color .profile-account-corner{
  margin-bottom:0;
}

.profile-account-popup .profile-chat-color-panel{
  background:#f2f2f2;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  border-radius:var(--radius-card);
  min-height:0;
  padding:14px 16px 16px;
  grid-template-columns:100px 100px;
  gap:14px;
}

.profile-account-popup .profile-chat-color-swatches{
  grid-template-columns:repeat(2, 38px);
  width:88px;
  gap:10px;
}

.profile-account-popup .profile-chat-color-custom__button{
  width:96px;
  height:96px;
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.62));
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), 0 6px 14px rgba(0,0,0,.08);
}

.profile-account-popup .profile-chat-color-custom__swatch{
  width:72px;
  height:72px;
}

.profile-account-popup .profile-chat-color-custom__lock{
  width:96px;
  height:96px;
}

.profile-account-popup .profile-chat-color-custom__lock::after{
  inset:30px;
}

.profile-account-box--color .profile-account-corner{
  bottom:-9px;
}

.profile-account-actions{
  display:flex;
  gap:8px;
  margin-top:8px;
}

.profile-account-actions--single{
  justify-content:flex-end;
}

.profile-password-popup .profile-account-actions--single{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.profile-account-btn--back{
  background:#c7c4c4;
  color:#000;
}

.modal--stack:has(.profile-password-popup) .modal__dialog{
  overflow:hidden;
}

.modal--stack:has(.profile-password-popup) .modal__content{
  max-height:none;
  overflow:visible;
}

.modal--stack.stack--password-kb:has(.profile-password-popup) .modal__dialog{
  overflow: visible;
}

.modal--stack.stack--password-kb:has(.profile-password-popup) .modal__content{
  max-height: calc(var(--app-h, 100svh) - 92px - var(--kb, 0px));
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-bottom: 0;
}

.modal--stack.stack--password-kb:has(.profile-password-popup) .profile-password-popup{
  padding-bottom: clamp(248px, 66vw, 304px);
}

.profile-account-btn{
  appearance:none;
  border:0;
  border-radius:var(--radius-pill);
  height:44px;
  cursor:pointer;
  font-weight:800;
  font-size:15px;
  line-height:1.1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  background:#ff7300;
  color:#fff;
}

.profile-account-btn--change{
  flex:2;
}

.profile-account-btn--save{
  flex:1;
}

.profile-account-popup .profile-account-actions{
  gap:10px;
  margin-top:2px;
}

.profile-account-popup .profile-account-btn{
  height:48px;
  border-radius:var(--radius-pill);
  font-size:15px;
  box-shadow:0 8px 16px rgba(0,0,0,.10);
}

.profile-account-popup .profile-account-btn--change{
  background:#ff7300;
  color:#fff;
  box-shadow:0 8px 16px rgba(0,0,0,.10);
}

.profile-account-popup .profile-account-btn--save{
  background:#14AE5C;
  color:#fff;
}

.profile-password-popup .profile-account-card{
  gap:14px;
}

.profile-password-popup .profile-account-row{
  gap:0;
}

.profile-password-popup .profile-account-box{
  display:grid;
  gap:8px;
  padding-bottom:0;
}

.profile-password-popup .profile-account-box > .profile-account-corner{
  order:1;
  position:static;
  left:auto;
  bottom:auto;
  transform:none;
  display:block;
  max-width:none;
  padding:0;
  background:transparent;
  color:#5f5f5f;
  font-size:12px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:0;
  text-align:left;
  text-transform:none;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  pointer-events:none;
  margin:0;
}

.profile-password-popup .profile-account-box > .password-field,
.profile-password-popup .profile-account-box > .profile-account-input{
  order:2;
}

.profile-password-popup .profile-account-input{
  height:60px;
  border:0;
  border-radius:18px;
  background:#f2f2f2;
  padding:0 16px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  color:#111;
  font-size:15px;
  font-weight:700;
  line-height:60px;
  text-align:center;
}

.profile-password-popup .password-field .profile-account-input{
  padding-left:18px;
  padding-right:58px;
}

.profile-password-popup .password-toggle{
  right:14px;
}

.profile-password-popup .profile-account-actions{
  gap:10px;
  margin-top:2px;
}

.profile-password-popup .profile-account-btn{
  width:100%;
  height:48px;
  border-radius:var(--radius-pill);
  font-size:15px;
  box-shadow:0 8px 16px rgba(0,0,0,.10);
}

.profile-password-popup .profile-account-btn--back{
  background:#ff7300;
  color:#fff;
}

.profile-password-popup .profile-account-btn--save{
  background:#14AE5C;
  color:#fff;
}

.profile-account-btn:disabled{
  opacity:.6;
  cursor:default;
}

/* подтверждение */
.confirm-card{width:100%; max-width:420px; padding:16px; background:var(--chip); border-radius:var(--radius-card); display:grid; gap:12px}
.confirm-text{text-align:center; color:#000; font-weight:700}
.confirm-actions{display:flex; gap:12px; justify-content:center}
.btn-confirm{min-width:120px; height:44px; border-radius:var(--radius-pill); border:0; cursor:pointer; font-weight:800; font-size:16px}
.btn-confirm.yes{background:#FF7300; color:#fff}
.btn-confirm.no{background:#C7C4C4; color:#000}

/* ====== Попап таймера премиума ====== */
.timer-popup{width:100%; max-width:420px; display:grid; gap:14px}

.timer-card{
  width:100%;
  background:var(--chip);
  border-radius:16px;
  padding:16px;
  display:grid;
  gap:12px;
  border:1px solid rgba(0,0,0,.06);
}

.timer-title{
  margin:0;
  text-align:center;
  color:#000;
  font-weight:800;
  font-size:18px;
}

.timer-remaining{
  text-align:center;
  color:#000;
  font-weight:900;
  font-size:28px;
  line-height:1;
}

.timer-note{
  margin:0;
  text-align:center;
  color:#000;
  opacity:.75;
  font-size:12px;
}

.btn-close-timer{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:160px;
  height:44px;
  border-radius:var(--radius-pill);
  border:0;
  cursor:pointer;
  background:#FF7300;
  color:#fff;
  font-weight:800;
  font-size:16px;
}

/* ====== ОПАКОВЫЕ попапы (таймер и подтверждение) поверх профиля ====== */
/* сам диалог в верхнем слое — сплошной фон */
.modal--stack .modal__dialog{
  background: var(--chip);
}

/* фон подложки можно сделать чуть темнее, чтобы читалось */
.modal--stack .modal__backdrop{
  background: rgba(0,0,0,.6);
}

/* убираем внутренние «карточки» — они становятся прозрачными (без рамки) */
.modal--stack .chip{
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* крестик на светлом фоне должен быть тёмным */
.modal--stack .modal__close{ color:#000; }
/* Reset-cooldown: крестик снова белый */
.modal--stack .reset-popup ~ .modal__close,
.modal--stack:has(.reset-popup) .modal__close{
  color:#fff;
}


/* Прокрутка контента в верхнем слое модалки (стек) */
.modal--stack .modal__content{
  max-height: calc(100svh - 140px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* КНОПКИ внутри оставляем как есть (оранжевые) — ничего менять не нужно */

/* --- универсальный фолбэк (если вдруг откроешь в обычной модалке) --- */
.modal__dialog:has(.timer-popup),
.modal__dialog:has(.confirm-popup){
  background: var(--chip);
}
/* и выключаем «плашки» внутри */
.modal__dialog:has(.timer-popup) .chip,
.modal__dialog:has(.confirm-popup) .chip{
  background: transparent;
  border: 0;
  box-shadow: none;
}
/* крестик на светлом фоне */
.modal__dialog:has(.timer-popup) .modal__close,
.modal__dialog:has(.confirm-popup) .modal__close{
  color:#000;
}

/* ===== Попап обязательной подписки ===== */
.subs-popup{width:100%; max-width:420px; display:grid; gap:14px}
.subs-card{width:100%; background:var(--chip); border-radius:var(--radius-card); padding:16px; display:grid; gap:12px; border:1px solid rgba(0,0,0,.06)}
.subs-title{margin:0; text-align:center; color:#000; font-weight:800; font-size:18px}
.subs-sub{margin:0; text-align:center; color:#000; opacity:.85; font-size:14px}
.subs-links{display:grid; gap:10px}
.btn-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:100%; height:44px; border-radius:var(--radius-btn-secondary); text-decoration:none;
  background:#fff; color:#000; font-weight:800; border:1px solid rgba(0,0,0,.08);
}
.btn-check{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:200px; height:44px; border-radius:var(--radius-pill); border:0; cursor:pointer;
  background:#FF7300; color:#fff; font-weight:800; font-size:16px;
}
.btn-check.is-ok{ background:#14ae5c; } /* зелёная после успешной проверки */
.subs-note{margin:0; text-align:center; color:#000; opacity:.7; font-size:12px}

/* ===== Попап трансляций ===== */
.streams-popup{width:100%; max-width:420px; display:grid; gap:14px; position:relative}
:root{
  --tv-frame-ratio: 1.277139;
  --tv-popup-frame-ratio: 1.777778;
}
.streams-card{
  width:100%;
  background:rgba(8, 18, 36, .62);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius:16px;
  padding:12px 0 10px;
  display:grid;
  gap:10px;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
  overflow:hidden;
}
.streams-title{margin:0; text-align:center; color:#000; font-weight:800; font-size:18px}
.streams-sub{margin:0; text-align:center; color:#fff; opacity:.82; font-size:12px; padding:0 12px}
.streams-links{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:8px;
  padding:0 12px;
}
.streams-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:42px;
  border-radius:var(--radius-pill);
  border:1px solid rgba(0,0,0,.18);
  text-decoration:none;
  cursor:pointer;
  padding:8px 10px;
  background:#FF7300;
  color:#fff;
  font-weight:800;
  font-size:14px;
  line-height:1.15;
  text-align:center;
}
.streams-btn.is-active{
  background:#e66100;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.22);
}
.streams-btn:active{ transform: translateY(1px); }
.streams-screen{
  position:relative;
  container-type:inline-size;
  width:100%;
  margin-top:10px;
  aspect-ratio:16 / 9;
  height:min(56vw, 240px);
  min-height:170px;
  max-height:260px;
  border-radius:0;
  overflow:hidden;
  background:rgba(0,0,0,.52);
  border-top:1px solid rgba(255,255,255,.12);
  border-bottom:1px solid rgba(255,255,255,.12);
  isolation:isolate;
  touch-action:manipulation;
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;
}
.streams-screen *{
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
}
.streams-screen img{
  -webkit-user-drag:none;
  user-drag:none;
}
.streams-data-layer{
  position:absolute;
  inset:0;
  z-index:20;
  pointer-events:none;
  display:none;
  background:transparent;
  -webkit-text-size-adjust:none;
  text-size-adjust:none;
}
.streams-data-stage{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  overflow:hidden;
  z-index:20;
}
.streams-popup--data-mode .streams-data-layer{
  display:block;
}
.streams-data-chat{
  position:absolute;
  left:0.47%;
  top:9.08%;
  width:36%;
  height:80%;
  overflow:hidden;
  color:#fff;
  font-size:13px !important;
  line-height:1.14 !important;
  -webkit-text-size-adjust:none;
  text-size-adjust:none;
  text-shadow:0 0 6px rgba(0,0,0,.75);
  z-index:50;
}
.streams-data-chat-logo{
  display:none;
}
.streams-data-chat-lines{
  position:absolute;
  left:0;
  right:0;
  top:0;
  bottom:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  box-sizing:border-box;
  padding:2px 4px 5px 0;
  overflow:hidden;
  transform:none;
}
.streams-data-chat-row{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  font-size:13px !important;
  line-height:1.14 !important;
  font-weight:400;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:break-word;
  overflow-wrap:anywhere;
}
.streams-data-chat-author{
  min-width:0;
  font-size:13px !important;
  line-height:1.14 !important;
  color:#fff;
  font-weight:800;
}
.streams-data-chat-message{
  min-width:0;
  font-size:13px !important;
  line-height:1.14 !important;
  white-space:normal;
  word-break:break-word;
  overflow-wrap:anywhere;
}
.streams-data-tiles{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
}
.streams-data-tiles[data-count="0"]{
  display:none;
}
.streams-data-photo{
  position:absolute;
  display:block;
  object-fit:contain;
  object-position:center center;
  border:0;
  box-shadow:none;
  transition:none;
  background:transparent;
}
.streams-data-tile-caption{
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:0;
  background:rgba(255,255,255,.97);
  color:#000;
  font-weight:600;
  text-align:center;
  padding:0;
  margin:0;
  border:0;
  box-shadow:none;
  white-space:normal;
  overflow:hidden;
  text-overflow:clip;
  z-index:2;
  pointer-events:none;
  text-shadow:none;
}
.streams-data-tile-caption-text{
  display:block;
  margin:0;
  text-align:center;
}
.streams-data-leaderboard{
  position:absolute;
  left:38.84%;
  top:52.9%;
  width:19.3%;
  height:50.0%;
  border-radius:10px;
  background:linear-gradient(180deg, rgba(8,15,30,.886) 0%, rgba(4,6,13,.839) 100%);
  border:1px solid rgba(255,231,152,.62);
  box-shadow:0 0 16px rgba(0,0,0,.52);
  overflow:hidden;
  display:grid;
  grid-template-rows:auto auto 1fr;
  padding:5px 7px;
}
.streams-data-leaderboard-head{
  display:grid;
  justify-items:center;
  gap:0;
  margin-bottom:1px;
}
.streams-data-leaderboard-head span{
  line-height:1.1;
  text-shadow:none;
}
.streams-data-leaderboard-head [data-streams-data-leaderboard-title]{
  color:rgba(255,231,152,1);
  font-size:9px;
  font-weight:800;
  letter-spacing:0;
}
.streams-data-leaderboard-head [data-streams-data-leaderboard-game]{
  color:rgba(184,224,255,.863);
  font-size:10px;
  font-weight:700;
  margin-top:1px;
}
.streams-data-leaderboard-cols{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:end;
  gap:4px;
  margin-top:4px;
}
.streams-data-leaderboard-col-rank,
.streams-data-leaderboard-col-name,
.streams-data-leaderboard-col-score{
  color:rgba(255,255,255,.863);
  font-size:6px;
  font-weight:700;
  line-height:1.1;
}
.streams-data-leaderboard-col-rank{
  margin:0 3px 2px 0;
}
.streams-data-leaderboard-col-name{
  margin:0 3px 2px 0;
}
.streams-data-leaderboard-col-score{
  margin:0 0 2px 3px;
  text-align:right;
}
.streams-data-leaderboard-rows{
  display:grid;
  align-content:stretch;
  gap:0;
  grid-auto-rows:minmax(0, 1fr);
  overflow:hidden;
  margin-top:1px;
}
.streams-data-leaderboard-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  min-height:0;
  gap:4px;
}
.streams-data-leaderboard-rank{
  color:rgba(255,255,255,.922);
  font-size:7.5px;
  font-weight:600;
  line-height:1.1;
  margin:0 2px 0 0;
  text-align:left;
}
.streams-data-leaderboard-name{
  color:rgba(255,255,255,.961);
  font-size:7.5px;
  font-weight:600;
  line-height:1.1;
  margin:0 2px 0 0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.streams-data-leaderboard-score{
  color:rgba(255,231,152,.961);
  font-size:7.5px;
  font-weight:700;
  line-height:1.1;
  margin:0 0 0 2px;
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.streams-data-ad-banner{
  position:absolute;
  left:38.84%;
  top:81.69%;
  width:19.3%;
  height:17.28%;
  border-radius:12px;
  object-fit:fill;
  display:block;
  pointer-events:none;
}
.streams-chat{
  display:grid;
  gap:8px;
  margin-top:10px;
  padding:0 12px 2px;
}
.streams-reaction-hint{
  margin:6px 4px 1px;
  color:rgba(236,245,255,.82);
  font-size:15px;
  font-weight:800;
  line-height:1.15;
  text-align:center;
  text-shadow:0 1px 2px rgba(0,0,0,.28);
}
.streams-chat-list{
  min-height:180px;
  max-height:240px;
  overflow:auto;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(3,10,20,.48);
  padding:8px 9px;
  display:grid;
  align-content:start;
  gap:6px;
}
.streams-chat-empty{
  margin:0;
  color:rgba(236,245,255,.74);
  font-size:12px;
  text-align:center;
  padding:8px 0;
}
.streams-chat-item{
  display:grid;
  gap:2px;
}
.streams-chat-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.streams-chat-author{
  color:#9cd3ff;
  font-size:12px;
  font-weight:800;
  line-height:1.2;
}
.streams-chat-time{
  color:rgba(236,245,255,.62);
  font-size:10px;
  line-height:1.2;
}
.streams-chat-text{
  color:#f3f8ff;
  font-size:12px;
  line-height:1.35;
  word-break:break-word;
  white-space:pre-wrap;
}
.streams-chat-input-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
}
.streams-chat-input{
  width:100%;
  min-height:38px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:#091321;
  color:#f8fcff;
  font-size:13px;
  padding:8px 10px;
  outline:none;
}
.streams-chat-input::placeholder{
  color:rgba(230,240,255,.55);
}
.streams-chat-input:focus{
  border-color:rgba(255,115,0,.7);
  box-shadow:0 0 0 2px rgba(255,115,0,.18);
}
.streams-chat-send{
  min-height:38px;
  border:1px solid rgba(0,0,0,.18);
  border-radius:var(--radius-pill);
  background:#FF7300;
  color:#fff;
  font-weight:800;
  font-size:13px;
  padding:0 14px;
  cursor:pointer;
  box-shadow:none;
}
.streams-chat-send:disabled{
  opacity:.52;
  cursor:not-allowed;
}
.streams-react-layer{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
}
.streams-photo-highlight{
  position:absolute;
  left:0;
  top:0;
  box-sizing:border-box;
  border-radius:10px;
  border:2px solid rgba(255, 200, 72, .94);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.28) inset,
    0 0 0 0 rgba(255, 200, 72, .42),
    0 10px 24px rgba(0,0,0,.35);
  opacity:0;
  transform:scale(.985);
  transform-origin:center center;
  transition:none;
  pointer-events:none;
}
.streams-photo-highlight.is-active{
  animation:streamsPhotoHighlightPulse .62s ease-out forwards;
}
@keyframes streamsPhotoHighlightPulse{
  0%{
    opacity:0;
    transform:scale(.982);
    box-shadow:
      0 0 0 1px rgba(0,0,0,.28) inset,
      0 0 0 0 rgba(255, 200, 72, .40),
      0 8px 20px rgba(0,0,0,.28);
  }
  28%{
    opacity:1;
    transform:scale(1);
    box-shadow:
      0 0 0 1px rgba(0,0,0,.28) inset,
      0 0 0 9px rgba(255, 200, 72, .18),
      0 12px 28px rgba(0,0,0,.35);
  }
  100%{
    opacity:0;
    transform:scale(1.01);
    box-shadow:
      0 0 0 1px rgba(0,0,0,.20) inset,
      0 0 0 15px rgba(255, 200, 72, 0),
      0 12px 26px rgba(0,0,0,.24);
  }
}
.streams-reaction-badge{
  position:absolute;
  left:0;
  top:0;
  transform:translate(-50%, -50%);
  min-width:34px;
  height:34px;
  border-radius:999px;
  padding:0 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:19px;
  line-height:1;
  background:rgba(6, 20, 38, .68);
  border:1px solid rgba(255,255,255,.26);
  box-shadow:0 8px 18px rgba(0,0,0,.3);
  animation:streamsReactionPop .8s ease forwards;
}
@keyframes streamsReactionPop{
  0%{ opacity:0; transform:translate(-50%, -42%) scale(.72); }
  20%{ opacity:1; transform:translate(-50%, -58%) scale(1); }
  100%{ opacity:0; transform:translate(-50%, -102%) scale(1.05); }
}
.streams-chat-fab{
  display:none;
  position:absolute;
  left:50%;
  bottom:calc(10px + var(--safe-bottom));
  transform:translateX(-50%);
  z-index:8;
  min-height:38px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.26);
  background:rgba(7, 25, 45, .48);
  color:#f6fbff;
  font-size:13px;
  font-weight:800;
  line-height:1;
  padding:0 18px;
  cursor:pointer;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.streams-reaction-picker{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  display:none;
  align-items:center;
  gap:6px;
  padding:7px 8px;
  border-radius:999px;
  background:rgba(6, 20, 36, .78);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 8px 20px rgba(0,0,0,.3);
  z-index:10;
  max-width:calc(100% - 12px);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.streams-reaction-picker.is-active{
  display:flex;
}
.streams-reaction-picker__column{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.streams-reaction-picker__column--premium{
  margin-top:10px;
}
.streams-reaction-chip{
  width:34px;
  height:34px;
  min-width:34px;
  border-radius:50%;
  border:1px solid transparent;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}
.streams-reaction-chip--premium.is-locked{
  opacity:.44;
  filter:grayscale(.2) brightness(.82);
}
.streams-reaction-chip.is-active{
  border-color:rgba(255,255,255,.5);
  background:rgba(255,255,255,.16);
}
.streams-reaction-toggle{
  position:absolute;
  top:0;
  left:0;
  right:auto;
  min-width:138px;
  min-height:42px;
  padding:0 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(7, 25, 45, .68);
  color:#f6fbff;
  display:none;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:800;
  line-height:1.1;
  text-align:center;
  z-index:120;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 10px 22px rgba(0,0,0,.28);
}
.streams-reaction-toggle.is-active{
  border-color:rgba(255,255,255,.42);
  background:rgba(14, 34, 60, .82);
}

.streams-popup--immersive{
  width:min(100vw - 8px, 980px);
  max-width:980px;
}
.streams-popup--immersive .streams-card{
  position:relative;
  display:grid;
  justify-items:center;
  align-content:center;
  height:min(calc(var(--app-h, 100svh) - 18px), calc(100svh - 18px));
  max-height:min(calc(var(--app-h, 100svh) - 18px), calc(100svh - 18px));
  padding:0;
  gap:0;
  border-radius:18px;
}
.streams-popup--immersive .streams-sub,
.streams-popup--immersive .streams-links,
.streams-popup--immersive .streams-reaction-hint{
  display:none;
}
.streams-popup--immersive .streams-screen{
  position:absolute;
  inset:0;
  margin:0;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  flex:1 1 auto;
  min-height:0;
  aspect-ratio:auto;
  border:0;
  touch-action:none;
}
.streams-popup--immersive .streams-chat{
  position:absolute;
  left:10px;
  right:10px;
  bottom:calc(10px + var(--safe-bottom));
  margin:0;
  padding:0;
  z-index:8;
  pointer-events:none;
}
.streams-popup--immersive .streams-chat-list{
  display:none;
}
.streams-popup--immersive .streams-chat-input-row{
  opacity:0;
  transform:translateY(12px);
  transition:opacity .18s ease, transform .2s ease;
  pointer-events:none;
  grid-template-columns:minmax(0,1fr) auto;
}
.streams-popup--immersive.is-chat-open .streams-chat-input-row{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.streams-popup--immersive .streams-chat-input{
  background:rgba(4, 16, 30, .64);
}
.streams-popup--immersive .streams-chat-send{
  background:rgba(255, 115, 0, .9);
}
.streams-popup--immersive .streams-chat-fab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.streams-popup--immersive.is-chat-open .streams-chat-fab{
  opacity:0;
  pointer-events:none;
  transform:translate(-50%, 8px);
}

.streams-popup--landscape-lite,
.streams-popup--force-landscape{
  position:relative !important;
}

.streams-popup--landscape-lite{
  width:100%;
  max-width:none;
}

.streams-popup--landscape-lite .streams-head,
.streams-popup--landscape-lite .streams-sub,
.streams-popup--landscape-lite .streams-links,
.streams-popup--landscape-lite .streams-toolbar,
.streams-popup--landscape-lite .streams-rotate-note,
.streams-popup--landscape-lite .streams-reaction-hint,
.streams-popup--landscape-lite .streams-chat,
.streams-popup--landscape-lite .streams-chat-fab{
  display:none !important;
}

.streams-popup--landscape-lite .streams-card{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  max-width:none;
  min-height:min(var(--app-h, 100svh), 100svh);
  padding:0;
  gap:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.streams-popup--landscape-lite .streams-tv-shell{
  position:relative;
  width:min(calc(100vw - 24px), calc((min(var(--app-h, 100svh), 100svh) - 24px) * var(--tv-popup-frame-ratio)));
  max-width:calc(100vw - 24px);
  aspect-ratio:var(--tv-popup-frame-ratio);
  padding:0;
  gap:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}

.streams-popup--landscape-lite .streams-tv-shell::after{
  content:"";
  position:absolute;
  inset:0;
  background:center / cover no-repeat;
  background-image:url("./bgicons/tv-screen-background.png");
  pointer-events:none;
  z-index:1;
}

.streams-popup--landscape-lite .streams-tv-shell::before{
  content:"";
  position:absolute;
  inset:0;
  background:center / contain no-repeat;
  background-image:url("./bgicons/tv-frame.png");
  filter:drop-shadow(0 5px 1px rgba(0,0,0,.35));
  pointer-events:none;
  z-index:3;
}

.streams-popup--landscape-lite .streams-screen{
  position:absolute !important;
  inset:4% 3.5% 11.5% 3.5% !important;
  width:auto !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  aspect-ratio:auto !important;
  border:0 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:transparent !important;
  z-index:2 !important;
}

.streams-popup--landscape-lite .streams-screen::before{
  content:none;
}

.streams-popup--landscape-lite .streams-popup-lite-host{
  position:absolute;
  inset:0;
  z-index:2;
  overflow:hidden;
  pointer-events:none;
}

/* TV streams popup: без внешней полупрозрачной обертки, крестик внутри карточки */
.modal__dialog:has(.streams-popup){
  width: min(420px, calc(100vw - 24px));
  max-width: 420px;
  padding: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 16px;
  position: relative;
}

.modal__dialog:has(.streams-popup) .modal__close{
  top: 10px;
  right: 12px;
  z-index: 20;
  pointer-events: auto;
}
.modal[data-modal-kind="tv-streams"] .modal__dialog{
  width:min(420px, calc(100vw - 24px));
  max-width:420px;
}
.modal[data-modal-kind="tv-streams"] .modal__content{
  padding:0;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .modal__dialog{
  align-self:end;
  display:flex;
  align-items:flex-end;
  height:100%;
  max-height:100%;
  margin:0;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .modal__content{
  display:flex;
  max-height:100%;
  min-height:0;
  overflow:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-popup,
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-card{
  max-height:100%;
  min-height:0;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-popup{
  display:flex;
  flex-direction:column;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-card{
  height:min(720px, calc(var(--tv-streams-visible-height, var(--stream-vvh, var(--app-h, 100dvh))) - 6px));
  max-height:calc(var(--tv-streams-visible-height, var(--stream-vvh, var(--app-h, 100dvh))) - 6px);
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-chat{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-chat-list{
  flex:1 1 auto;
  min-height:0;
  height:auto !important;
  overflow-y:auto;
  overscroll-behavior:contain;
}
.modal[data-modal-kind="tv-streams"].tv-streams-keyboard-open .streams-chat-input-row{
  flex:0 0 auto;
  min-height:52px;
}
.modal:has(.streams-popup.streams-popup--immersive) .modal__dialog{
  width:min(100vw - 8px, 980px);
  max-width:980px;
  padding:0;
}
.modal:has(.streams-popup.streams-popup--landscape-lite) .modal__dialog{
  width:100vw;
  max-width:none;
  height:min(var(--app-h, 100svh), 100svh);
  padding:0;
  background:transparent;
  box-shadow:none;
  border:0;
  border-radius:0;
}
@media (orientation: landscape){
  .modal[data-modal-kind="tv-streams"] .modal__dialog{
    width:100vw;
    max-width:none;
    height:min(var(--app-h, 100svh), 100svh);
    padding:0;
    background:transparent;
    box-shadow:none;
    border:0;
    border-radius:0;
    display:grid;
    place-items:center;
  }
  .modal[data-modal-kind="tv-streams"] .modal__close{
    top:14px;
    right:14px;
  }
}

/* TV streams popup refresh */
.streams-popup{
  max-width:428px;
  gap:12px;
}

.streams-card{
  padding:18px 14px 14px;
  gap:12px;
  border-radius:28px;
  background:
    radial-gradient(circle at top, rgba(255,115,0,.16), transparent 32%),
    linear-gradient(180deg, rgba(8,18,36,.92), rgba(4,10,22,.9));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 22px 44px rgba(0,0,0,.34);
}

.streams-head{
  display:grid;
  gap:4px;
  padding:2px 44px 0 2px;
}

.streams-title{
  margin:0;
  color:#f7fbff;
  font-size:24px;
  line-height:1.05;
  font-weight:900;
  letter-spacing:-0.02em;
}

.streams-sub{
  padding:0 44px 0 2px;
  text-align:left;
  color:rgba(235,244,255,.82);
  font-size:13px;
  line-height:1.38;
}

.streams-links,
.streams-reaction-hint{
  display:none !important;
}

.streams-toolbar{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  width:100%;
  max-width:100%;
  padding-right:var(--stream-close-safe-zone);
  box-sizing:border-box;
  align-self:stretch;
}

.streams-rotate-note{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(16,34,58,.96), rgba(9,22,40,.92));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:transform .14s ease, border-color .14s ease, background .14s ease;
}

.streams-rotate-note:focus-visible{
  outline:2px solid rgba(255,255,255,.42);
  outline-offset:2px;
}

.streams-rotate-note:active{
  transform:scale(.992);
  border-color:rgba(255,255,255,.2);
  background:linear-gradient(180deg, rgba(19,40,68,.98), rgba(10,25,44,.94));
}

.streams-rotate-note__icon{
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.08);
  color:#f8fbff;
  font-size:18px;
  font-weight:800;
}

.streams-rotate-note__text{
  margin:0;
  color:#f5f9ff;
  font-size:13px;
  line-height:1.35;
  font-weight:700;
}

.streams-rotate-note__accent{
  color:#ff7300;
}

.streams-tv-shell{
  display:grid;
  gap:10px;
  padding:10px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(7,18,33,.94), rgba(6,13,25,.9));
  border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.streams-screen{
  margin-top:0;
  min-height:200px;
  height:min(64vw, 292px);
  max-height:292px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.38);
}

.streams-platform-btn{
  width:56px;
  height:56px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(18,35,56,.96), rgba(10,20,35,.96));
  color:#f5f9ff;
  display:grid;
  place-items:center;
  text-decoration:none;
  box-shadow:0 10px 22px rgba(0,0,0,.2);
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background-color .18s ease;
}

.streams-platform-btn:hover{
  transform:translateY(-1px);
}

.streams-platform-btn:active{
  transform:translateY(1px) scale(.98);
}

.streams-platform-btn__glyph{
  width:24px;
  height:24px;
  fill:currentColor;
}

.streams-platform-btn--youtube{
  color:#ff5c49;
}

.streams-platform-btn--twitch{
  color:#c7b1ff;
}

.streams-platform-btn.is-active{
  border-color:rgba(255,115,0,.64);
  box-shadow:
    0 0 0 1px rgba(255,115,0,.22),
    0 12px 24px rgba(0,0,0,.22);
  transform:translateY(-1px) scale(1.02);
}

.streams-brand{
  min-height:56px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 12px;
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.08);
  color:#f7fbff;
  text-align:center;
}

.streams-brand__word{
  font-size:15px;
  font-weight:900;
  letter-spacing:.08em;
}

.streams-brand__globe{
  font-size:18px;
  line-height:1;
}

.streams-chat{
  margin-top:0;
  padding:0;
  gap:0;
}

.streams-chat-list[hidden]{
  display:none !important;
}

.streams-chat-input-row{
  gap:10px;
}

.streams-chat-input{
  min-height:46px;
  border-radius:16px;
  background:rgba(8,19,34,.96);
  padding:10px 14px;
  font-size:14px;
}

.streams-chat-send{
  min-height:46px;
  padding:0 18px;
  border-radius:16px;
  box-shadow:0 10px 20px rgba(255,115,0,.22);
}

.streams-data-chat{
  left:4.1%;
  top:7.6%;
  width:39%;
  height:73%;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  gap:8px;
  padding:0;
  text-shadow:0 1px 4px rgba(0,0,0,.55);
}

.streams-data-chat-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
  padding:0 2px 4px;
  border-bottom:1px solid rgba(255,255,255,.12);
}

.streams-data-chat-live{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(255,115,0,.18);
  border:1px solid rgba(255,115,0,.36);
  color:#ffd2b3;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
}

.streams-data-chat-count{
  min-width:0;
  color:rgba(240,247,255,.94);
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.streams-data-chat-lines{
  position:relative;
  left:auto;
  right:auto;
  top:auto !important;
  bottom:auto;
  min-height:0;
  padding:0 4px 0 0;
}

.streams-data-chat-row,
.streams-data-chat-author,
.streams-data-chat-message{
  font-size:12px !important;
  line-height:1.24 !important;
}

.streams-data-leaderboard{
  left:50.2%;
  top:78.6%;
  width:44.6%;
  height:17.2%;
  border-radius:16px;
  padding:8px 10px;
  background:linear-gradient(180deg, rgba(9,18,33,.96), rgba(6,11,22,.92));
  border:1px solid rgba(255,231,152,.35);
  box-shadow:0 10px 24px rgba(0,0,0,.3);
}

.streams-data-leaderboard-head{
  justify-items:start;
  gap:1px;
  margin-bottom:4px;
}

.streams-data-leaderboard-head [data-streams-data-leaderboard-title]{
  font-size:8px;
  letter-spacing:.12em;
}

.streams-data-leaderboard-head [data-streams-data-leaderboard-game]{
  font-size:9px;
}

.streams-data-leaderboard-cols{
  display:none;
}

.streams-data-leaderboard-rows{
  gap:1px;
}

.streams-data-leaderboard-rank,
.streams-data-leaderboard-name,
.streams-data-leaderboard-score{
  font-size:8px;
  line-height:1.08;
}

.streams-data-ad-banner{
  display:none !important;
}

.modal__dialog:has(.streams-popup){
  width:min(428px, calc(100vw - 24px));
  max-width:428px;
  border-radius:28px;
}

.modal__dialog:has(.streams-popup) .modal__close{
  top:16px;
  right:16px;
  width:34px;
  height:34px;
  border-radius:12px;
  background:rgba(9,20,34,.78);
  border:1px solid rgba(255,255,255,.1);
}

.modal[data-modal-kind="tv-streams"] .modal__dialog{
  width:min(428px, calc(100vw - 24px));
  max-width:428px;
}

.streams-popup--immersive .streams-head,
.streams-popup--immersive .streams-sub,
.streams-popup--immersive .streams-rotate-note,
.streams-popup--immersive .streams-toolbar{
  display:none !important;
}

.streams-popup--immersive .streams-card{
  padding:0;
  border-radius:18px;
}

.streams-popup--immersive .streams-tv-shell{
  padding:0;
  gap:0;
  border:0;
  border-radius:18px;
  background:transparent;
  box-shadow:none;
}

.streams-popup--immersive .streams-screen{
  border-radius:18px;
  max-height:min(calc(var(--app-h, 100svh) - 18px), calc(100svh - 18px));
}

.streams-popup--landscape-lite .streams-head,
.streams-popup--landscape-lite .streams-sub,
.streams-popup--landscape-lite .streams-rotate-note,
.streams-popup--landscape-lite .streams-toolbar{
  display:none !important;
}

.streams-popup--landscape-lite .streams-card{
  padding:0;
  border-radius:0;
}

.streams-popup--landscape-lite .streams-tv-shell{
  position:relative;
  overflow:visible;
  padding:0;
  gap:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.streams-popup--landscape-lite .streams-reaction-toggle,
.streams-popup--force-landscape .streams-reaction-toggle{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  display:inline-flex !important;
  align-self:auto !important;
  justify-self:auto !important;
  margin:0 !important;
  white-space:nowrap;
  pointer-events:auto;
}
.streams-popup--landscape-lite .streams-reaction-controls,
.streams-popup--force-landscape .streams-reaction-controls{
  position:absolute !important;
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  z-index:9999 !important;
  pointer-events:none !important;
  overflow:visible !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  inset:auto !important;
  transform:none !important;
}
.streams-popup--landscape-lite .streams-reaction-controls{
  position:absolute !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  z-index:9999 !important;
  pointer-events:none !important;
  overflow:visible !important;
  inset:auto !important;
  left:auto !important;
  top:auto !important;
  right:70px !important;
  bottom:8px !important;
  transform:none !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
}
.streams-popup--force-landscape .streams-reaction-controls{
  position:absolute !important;
  display:block !important;
  z-index:9999 !important;
  pointer-events:none !important;
  overflow:visible !important;
  inset:auto !important;
  left:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
  width:0 !important;
  height:0 !important;
  margin:0 !important;
}
.streams-popup--landscape-lite .streams-reaction-controls .streams-reaction-toggle,
.streams-popup--force-landscape .streams-reaction-controls .streams-reaction-toggle{
  pointer-events:auto !important;
  position:relative !important;
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  left:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin:0 !important;
  white-space:nowrap !important;
}
.streams-popup--force-landscape .streams-reaction-controls .streams-reaction-toggle.streams-reaction-toggle--force-rotated{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  right:auto !important;
  bottom:auto !important;
  transform:translate(-50%, -50%) rotate(90deg) !important;
  transform-origin:center center !important;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel{
  left:0;
  top:0;
  right:auto;
  transform:none;
  display:none;
  align-items:flex-start;
  gap:10px;
  padding:12px;
  border-radius:20px;
  background:rgba(6, 20, 36, .88);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 18px 34px rgba(0,0,0,.34);
  max-width:none;
  overflow:visible;
  z-index:121;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel .streams-reaction-picker__column{
  gap:10px;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel .streams-reaction-picker__column--standard{
  margin-top:26px;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel .streams-reaction-picker__column--premium{
  margin-top:0;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel.is-active{
  display:flex;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel .streams-reaction-chip{
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:13px;
  background:rgba(10, 22, 40, .55);
  border:1px solid transparent;
  font-size:22px;
}
.streams-popup--landscape-lite .streams-reaction-picker.is-landscape-panel .streams-reaction-chip.is-active{
  border-color:rgba(255,255,255,.48);
  background:rgba(255,255,255,.14);
}
@media (max-width:390px){
  .streams-card{
    padding:16px 12px 12px;
    border-radius:24px;
  }

  .streams-title{
    font-size:21px;
  }

  .streams-sub,
  .streams-head{
    padding-right:38px;
  }

  .streams-screen{
    min-height:184px;
  }

  .streams-platform-btn{
    width:52px;
    height:52px;
    border-radius:16px;
  }

  .streams-brand{
    min-height:52px;
    padding:0 10px;
  }

  .streams-brand__word{
    font-size:13px;
  }
}

/* TV streams popup approved layout */
.streams-tv-shell{
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  gap:0;
}

.streams-popup .streams-head,
.streams-popup .streams-sub,
.streams-popup .streams-links{
  display:none !important;
}

.streams-screen{
  height:clamp(248px, 31vh, 330px);
  min-height:248px;
  max-height:none;
  aspect-ratio:auto;
  position:relative;
  padding:0;
  border-radius:0;
  border:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}

.watch-tv-layout,
.streams-live-layout{
  position:absolute;
  inset:0;
  display:block;
  padding:0;
  box-sizing:border-box;
  pointer-events:auto;
}

.watch-tv-top{
  display:grid;
  grid-template-columns:minmax(0, .95fr) minmax(0, 1.25fr);
  gap:8px;
  align-items:stretch;
  min-height:0;
  height:100%;
}

.watch-tv-left{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
  min-height:0;
}

.watch-tv-photo-area{
  position:relative;
  min-width:0;
  min-height:0;
  display:flex;
  height:100%;
  overflow:hidden;
}

.watch-tv-chat-head,
.streams-data-chat-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:nowrap;
  margin-bottom:10px;
  padding:0 0 10px;
  border-bottom:1px solid rgba(255,255,255,.12);
}

.watch-tv-chat-bottom,
.streams-live-chat{
  position:relative;
  min-width:0;
  min-height:0;
  height:var(--watch-tv-chat-height);
  max-height:none;
  width:100%;
  display:flex;
  flex-direction:column;
  gap:0;
  padding:12px;
  border-radius:18px;
  background:rgba(8,18,36,.72);
  border:1px solid rgba(255,255,255,.10);
  overflow:hidden;
  flex:0 0 var(--watch-tv-chat-height);
}

.streams-data-chat{
  position:relative;
  left:auto;
  top:auto;
  width:auto;
  height:auto;
  text-shadow:none;
}

.streams-data-chat-live{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:24px;
  padding:0;
  border-radius:0;
  background:transparent;
  border:0;
  color:#f7fbff;
  font-size:13px;
  font-weight:900;
  letter-spacing:.01em;
}

.streams-data-chat-live::before{
  content:"";
  width:16px;
  height:16px;
  border-radius:50%;
  background:#ff3030;
  box-shadow:0 0 12px rgba(255,48,48,.6);
  flex:0 0 auto;
}

.streams-data-chat-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(17,30,56,.9);
  border:1px solid rgba(255,255,255,.12);
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  color:#f6fbff;
}

.streams-live-chat-list,
.streams-data-chat-lines{
  flex:1 1 auto;
  min-height:0;
  max-height:none;
  overflow-y:auto;
  overflow-x:hidden;
  display:flex;
  flex-direction:column;
  align-content:stretch;
  gap:7px;
  padding:0 4px 0 0;
  scrollbar-width:none;
}

.streams-live-chat-list::-webkit-scrollbar,
.streams-data-chat-lines::-webkit-scrollbar{
  width:0;
  height:0;
}

.streams-data-chat-row{
  font-size:clamp(12px, 2.5vw, 16px) !important;
  line-height:1.35 !important;
}

.streams-data-chat-author{
  font-size:clamp(12px, 2.5vw, 16px) !important;
  line-height:1.35 !important;
}

.streams-data-chat-message{
  font-size:clamp(12px, 2.5vw, 16px) !important;
  line-height:1.35 !important;
}

.watch-tv-photo-grid,
.streams-live-photo-grid,
.streams-data-tiles{
  position:relative;
  left:auto;
  top:auto;
  width:100%;
  height:100%;
  min-height:0;
  display:block;
  flex:1 1 auto;
  overflow:hidden;
}

.watch-tv-photo-grid.count-0,
.streams-live-photo-grid.count-0{
  display:none;
}

.watch-tv-photo-grid.count-1,
.streams-live-photo-grid.count-1{
  height:100%;
}

.watch-tv-photo-area .watch-tv-photo-grid.count-1,
.watch-tv-photo-area .streams-live-photo-grid.count-1{
  align-content:stretch;
}

.watch-tv-photo-grid.count-1 .watch-tv-photo-tile,
.streams-live-photo-grid.count-1 .streams-live-photo-tile{
  min-height:100%;
  height:100%;
  aspect-ratio:auto;
}

.watch-tv-photo-grid.count-2,
.streams-live-photo-grid.count-2,
.watch-tv-photo-grid.count-4,
.streams-live-photo-grid.count-4{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.watch-tv-photo-grid.count-3,
.streams-live-photo-grid.count-3{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.watch-tv-photo-grid.count-3 .watch-tv-photo-tile:first-child,
.streams-live-photo-grid.count-3 .streams-live-photo-tile:first-child{
  grid-column:auto;
  aspect-ratio:auto;
}

.watch-tv-photo-tile,
.streams-live-photo-tile{
  position:absolute;
  min-width:0;
  min-height:0;
  border-radius:16px;
  overflow:hidden;
  aspect-ratio:auto;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}

.streams-live-photo-img,
.streams-data-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}

.streams-live-photo-caption,
.streams-data-tile-caption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  width:auto;
  height:auto;
  min-height:34px;
  padding:7px 10px;
  background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.66));
  color:#fff;
  border-radius:0;
}

.streams-data-tile-caption-text{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  font-size:11px;
  line-height:1.2;
}

.watch-tv-rating,
.streams-live-rating,
.streams-data-leaderboard{
  position:relative;
  left:auto;
  top:auto;
  width:100%;
  min-height:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  padding:8px 8px 6px;
  border-radius:16px;
  background:rgba(8,18,36,.72);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:none;
  font-size:clamp(9px, 2vw, 11px);
}

.streams-data-leaderboard-head{
  display:grid;
  justify-items:start;
  gap:1px;
  margin-bottom:4px;
}

.streams-data-leaderboard-head [data-streams-data-leaderboard-title]{
  font-size:8px;
  line-height:1.05;
  letter-spacing:.04em;
}

.streams-data-leaderboard-head [data-streams-data-leaderboard-game]{
  font-size:11px;
  line-height:1.05;
  font-weight:700;
}

.watch-tv-rating-viewport{
  position:relative;
  overflow:hidden;
  flex:1 1 auto;
  min-height:0;
  max-height:none;
}

.watch-tv-rating-scroll{
  display:flex;
  flex-direction:column;
  will-change:transform;
}

.streams-data-leaderboard-rows{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  row-gap:4px;
  margin-top:0;
}

.streams-data-leaderboard-row{
  display:flex;
  align-items:center;
  gap:4px;
}

.streams-data-leaderboard-rank,
.streams-data-leaderboard-name,
.streams-data-leaderboard-score{
  font-size:8.5px;
  line-height:1.05;
  margin:0;
}

.streams-data-leaderboard-name{
  min-width:0;
  flex:1 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.streams-data-leaderboard-score{
  flex:0 0 auto;
  margin-left:auto;
  text-align:right;
}

.watch-tv-platform-row,
.streams-live-platform-row{
  display:grid;
  grid-template-columns:48px minmax(0, 1fr) 48px;
  gap:8px;
  align-items:center;
  width:100%;
  min-height:48px;
  flex:0 0 auto;
}

.streams-live-platform-row .streams-platform-btn{
  width:48px;
  height:48px;
  border-radius:14px;
}

.watch-tv-brand,
.streams-live-platform-row .streams-brand{
  min-width:0;
  min-height:48px;
  padding:0 8px;
  border-radius:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:clip;
}

.watch-tv-brand .streams-brand__word,
.streams-live-platform-row .streams-brand__word{
  font-size:15px;
}

.streams-popup .streams-chat{
  margin-top:12px;
  padding:0;
  gap:0;
  background:transparent;
  border:0;
  box-shadow:none;
}

.streams-popup .streams-chat-input-row{
  gap:12px;
}

.streams-popup-lite-host{
  position:absolute;
  inset:0;
  z-index:2;
  display:none;
  overflow:hidden;
  pointer-events:none;
}

.streams-popup-lite-host .tv-lite-layer{
  position:absolute;
  inset:0;
  overflow:hidden;
  opacity:0;
  transition:opacity .18s linear;
  contain:layout paint size;
}

.streams-popup-lite-host .tv-lite-layer.is-visible{
  opacity:1;
}

.streams-popup-lite-host .tv-lite-stage{
  position:absolute;
  left:0;
  top:0;
  width:800px;
  height:420px;
  overflow:hidden;
  transform-origin:top left;
  background:transparent;
  -webkit-text-size-adjust:none;
  text-size-adjust:none;
}

.streams-popup-lite-host .tv-lite-chat{
  position:absolute;
  left:.47%;
  top:9.08%;
  width:36%;
  height:80%;
  overflow:hidden;
  color:#fff;
  font-size:13px;
  line-height:1.14;
  text-shadow:0 0 6px rgba(0,0,0,.75);
  z-index:50;
}

.streams-popup-lite-host .tv-lite-chat-lines{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  box-sizing:border-box;
  padding:2px 4px 5px 0;
  overflow:hidden;
}

.streams-popup-lite-host .tv-lite-chat-row{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  font-size:13px;
  line-height:1.14;
  font-weight:400;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.streams-popup-lite-host .tv-lite-chat-author{
  color:#fff;
  font-weight:800;
}

.streams-popup-lite-host .tv-lite-tiles{
  position:absolute;
  inset:0;
  z-index:10;
}

.streams-popup-lite-host .tv-lite-tiles[data-count="0"]{
  display:none;
}

.streams-popup-lite-host .tv-lite-photo{
  position:absolute;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:0;
  box-shadow:none;
  background:transparent;
}

.streams-popup-lite-host .tv-lite-caption{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  overflow:hidden;
  padding:1px 8px;
  background:rgba(255,255,255,.97);
  color:#000;
  font-size:10px;
  line-height:1;
  font-weight:700;
  text-align:center;
  word-break:break-word;
  overflow-wrap:anywhere;
  z-index:12;
}

.streams-popup-lite-host .tv-lite-leaderboard{
  position:absolute;
  left:38.84%;
  top:52.9%;
  width:19.3%;
  height:35.5%;
  border-radius:10px;
  background:linear-gradient(180deg, rgba(8,15,30,.886) 0%, rgba(4,6,13,.839) 100%);
  border:1px solid rgba(255,231,152,.62);
  box-shadow:0 0 16px rgba(0,0,0,.52);
  overflow:hidden;
  display:grid;
  grid-template-rows:auto auto 1fr;
  padding:5px 7px;
  z-index:30;
}

.streams-popup-lite-host .tv-lite-leaderboard-head{
  display:grid;
  justify-items:center;
  gap:0;
  margin-bottom:1px;
}

.streams-popup-lite-host .tv-lite-leaderboard-head span{
  line-height:1.1;
  text-shadow:none;
}

.streams-popup-lite-host [data-tv-lite-leaderboard-title]{
  color:rgba(255,231,152,1);
  font-size:9px;
  font-weight:800;
}

.streams-popup-lite-host [data-tv-lite-leaderboard-game]{
  color:rgba(184,224,255,.863);
  font-size:10px;
  font-weight:700;
  margin-top:1px;
}

.streams-popup-lite-host .tv-lite-leaderboard-cols,
.streams-popup-lite-host .tv-lite-leaderboard-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:4px;
}

.streams-popup-lite-host .tv-lite-leaderboard-cols span{
  color:rgba(255,255,255,.863);
  font-size:6px;
  font-weight:700;
  line-height:1.1;
}

.streams-popup-lite-host .tv-lite-leaderboard-rows{
  display:grid;
  align-content:stretch;
  grid-auto-rows:minmax(0, 1fr);
  overflow:hidden;
  margin-top:1px;
}

.streams-popup-lite-host .tv-lite-leaderboard-row span{
  min-width:0;
  font-size:7.5px;
  font-weight:650;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.streams-popup-lite-host .tv-lite-leaderboard-rank,
.streams-popup-lite-host .tv-lite-leaderboard-name{
  color:rgba(255,255,255,.96);
}

.streams-popup-lite-host .tv-lite-leaderboard-score{
  color:rgba(255,231,152,.96);
  text-align:right;
  font-variant-numeric:tabular-nums;
}

.streams-popup-lite-host .tv-lite-ad-banner{
  position:absolute;
  left:38.84%;
  top:81.69%;
  width:19.3%;
  height:17.28%;
  border-radius:12px;
  object-fit:fill;
  display:block;
  pointer-events:none;
  z-index:25;
}

.tv-photo-preview{
  position:fixed;
  inset:0;
  z-index:1300;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom)) 16px;
  background:rgba(0,0,0,.72);
  opacity:0;
  transition:opacity .18s ease;
  pointer-events:none;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

.tv-photo-preview.is-open{
  opacity:1;
}

.tv-photo-preview__card{
  max-width:min(92vw, 520px);
  max-height:78vh;
  width:auto;
  height:auto;
  transform:scale(.975);
  transition:transform .18s ease;
}

.tv-photo-preview.is-open .tv-photo-preview__card{
  transform:scale(1);
}

.tv-photo-preview__img{
  display:block;
  max-width:min(92vw, 520px);
  max-height:78vh;
  width:auto;
  height:auto;
  object-fit:contain;
  object-position:center center;
  border-radius:18px;
  box-shadow:0 18px 60px rgba(0,0,0,.45);
}

@media (max-width:390px){
  .streams-screen{
    height:clamp(400px, 52vh, 560px);
    min-height:400px;
    padding:0;
  }

  .streams-live-layout{
    gap:8px;
    padding:0;
  }

  .watch-tv-top{
    gap:8px;
    grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  }

  .streams-live-chat{
    min-height:176px;
    max-height:220px;
    padding:10px 10px 9px;
  }

  .streams-data-chat-count{
    min-height:30px;
    padding:0 10px;
    font-size:11px;
  }

  .streams-data-chat-row,
  .streams-data-chat-author,
  .streams-data-chat-message{
    font-size:clamp(11px, 2.5vw, 13px) !important;
  }

  .streams-live-photo-grid,
  .streams-data-tiles{
    gap:6px;
  }

  .streams-live-rating,
  .streams-data-leaderboard{
    padding:9px 9px 8px;
  }

  .streams-data-leaderboard-rank,
  .streams-data-leaderboard-name,
  .streams-data-leaderboard-score{
    font-size:9px;
  }

  .watch-tv-rating-viewport{
    min-height:0;
    max-height:none;
  }

  .watch-tv-layout,
  .streams-live-layout{
    --watch-tv-chat-height:clamp(176px, 39%, 216px);
  }

  .watch-tv-platform-row,
  .streams-live-platform-row{
    grid-template-columns:42px minmax(0, 1fr) 42px;
    gap:6px;
  }

  .streams-live-platform-row .streams-platform-btn{
    width:42px;
    height:42px;
  }

  .watch-tv-brand .streams-brand__word,
  .streams-live-platform-row .streams-brand__word{
    font-size:13px;
  }
}

.modal[data-modal-kind="tv-streams"] .modal__content{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:
    calc(env(safe-area-inset-top, 0px) + 16px)
    max(10px, env(safe-area-inset-right, 0px))
    calc(env(safe-area-inset-bottom, 0px) + 16px)
    max(10px, env(safe-area-inset-left, 0px));
  box-sizing:border-box;
}

.modal__dialog:has(.streams-popup),
.modal[data-modal-kind="tv-streams"] .modal__dialog{
  max-height:calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 32px);
}

.modal__dialog:has(.streams-popup) .modal__close{
  top:16px;
  right:16px;
  width:44px;
  height:44px;
  border-radius:50%;
  background:var(--plam-close-bg);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 18px rgba(0,0,0,.16);
  z-index:50;
  pointer-events:auto;
}

.modal__dialog:has(.streams-popup) .modal__close::before,
.modal__dialog:has(.streams-popup) .modal__close::after{
  width:14px;
  height:2.5px;
  background:var(--plam-close-fg);
}

.modal[data-modal-kind="tv-streams"] > .modal__dialog > .modal__close{
  top:18px !important;
  right:18px !important;
  width:44px !important;
  height:44px !important;
  border-radius:50% !important;
  background:var(--plam-close-bg) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 10px 18px rgba(0,0,0,.16) !important;
}

.modal[data-modal-kind="tv-streams"] > .modal__dialog > .modal__close::before,
.modal[data-modal-kind="tv-streams"] > .modal__dialog > .modal__close::after{
  width:14px !important;
  height:2.5px !important;
  background:var(--plam-close-fg) !important;
}

.streams-popup{
  width:min(428px, calc(100vw - 20px));
  max-width:428px;
  max-height:inherit;
}

.streams-card{
  display:flex;
  flex-direction:column;
  min-height:0;
  height:min(720px, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 32px));
  max-height:calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 32px);
  padding:18px 14px 14px;
  gap:6px;
  overflow:hidden;
}

.streams-rotate-note{
  flex:0 0 auto;
  grid-template-columns:auto minmax(0, 1fr);
  gap:10px;
  padding:10px 12px;
  border-radius:16px;
}

.streams-rotate-note__icon{
  width:30px;
  height:30px;
  border-radius:10px;
  font-size:17px;
}

.streams-rotate-note__text{
  font-size:12px;
  line-height:1.32;
}

.streams-chat-mention-notice{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  padding:8px 10px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(13,30,49,.96), rgba(8,21,38,.94));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  color:#f7fbff;
  text-align:left;
}

.streams-chat-mention-notice[hidden]{
  display:none !important;
}

.streams-chat-mention-notice__body{
  display:grid;
  gap:2px;
  min-width:0;
}

.streams-chat-mention-notice__title{
  font-size:11px;
  line-height:1.15;
  font-weight:900;
  color:#f8fbff;
}

.streams-chat-mention-notice__text{
  min-width:0;
  font-size:11px;
  line-height:1.3;
  color:rgba(236,245,255,.84);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.streams-chat-mention-notice__action{
  flex:0 0 auto;
  color:#ff9a4a;
  font-size:11px;
  font-weight:900;
}

.streams-tv-shell{
  flex:0 0 auto;
  min-height:0;
}

.streams-screen{
  flex:0 0 auto;
  width:100%;
  height:clamp(220px, 27vh, 286px);
  min-height:220px;
}

.watch-tv-layout,
.streams-live-layout{
  gap:0;
}

.watch-tv-top{
  grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);
  gap:8px;
}

.watch-tv-left{
  gap:6px;
}

.watch-tv-photo-area{
  min-height:0;
  height:100%;
}

.watch-tv-chat-bottom,
.streams-live-chat{
  padding:12px 12px 10px;
  border-radius:16px;
}

.streams-data-chat-head{
  margin-bottom:8px;
  padding:0 0 8px;
}

.streams-data-chat-toggle,
.streams-chat-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(17,30,56,.9);
  color:#f7fbff;
  font-size:12px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}

.streams-data-chat-toggle{
  min-width:0;
}

.streams-data-chat-count{
  min-height:32px;
}

.watch-tv-rating,
.streams-live-rating,
.streams-data-leaderboard{
  flex:1 1 auto;
  min-height:0;
  min-block-size:100%;
  padding:7px 8px 6px;
  border-radius:16px;
  overflow:hidden;
}

.watch-tv-rating-viewport{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}

.watch-tv-rating-scroll{
  width:100%;
}

.streams-data-leaderboard-rows{
  row-gap:2px;
  grid-auto-rows:auto;
}

.streams-data-leaderboard-row{
  min-height:auto;
}

.streams-live-platform-row .streams-platform-btn{
  overflow:visible;
}

.streams-platform-btn__glyph{
  width:26px;
  height:26px;
  flex:0 0 auto;
}

.streams-platform-btn--youtube .streams-platform-btn__glyph{
  width:28px;
  height:28px;
}

.streams-popup .streams-chat{
  display:grid;
  grid-template-rows:auto auto minmax(0, 1fr) auto;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}

.streams-chat-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex:0 0 auto;
  margin-bottom:8px;
  padding:0 0 8px;
  border-bottom:1px solid rgba(255,255,255,.12);
}

.streams-popup .streams-chat-list{
  min-height:0;
  max-height:none;
  height:100%;
  flex:1 1 auto;
}

.streams-popup:not(.streams-popup--landscape-lite) .streams-data-leaderboard{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
  min-height:100% !important;
  min-block-size:100% !important;
  overflow:hidden !important;
}

.streams-popup:not(.streams-popup--landscape-lite) .watch-tv-rating-viewport{
  flex:1 1 auto !important;
  height:100% !important;
  min-height:0 !important;
}

.streams-chat-author--button,
.streams-data-chat-author--button{
  appearance:none;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
  text-align:left;
}

.streams-chat-author--button:active,
.streams-data-chat-author--button:active{
  transform:translateY(1px);
}

.streams-chat-item.is-mention-target{
  border-radius:12px;
  box-shadow:0 0 0 1px rgba(255,154,74,.38) inset, 0 0 22px rgba(255,154,74,.14);
}

.streams-popup--chat-expanded .streams-rotate-note,
.streams-popup--chat-expanded .streams-chat-mention-notice,
.streams-popup--chat-expanded .streams-tv-shell{
  display:none !important;
}

.streams-popup--chat-expanded .streams-chat{
  flex:1 1 auto;
  margin-top:0;
}

@media (max-width:390px){
  .modal[data-modal-kind="tv-streams"] .modal__content{
    padding-top:calc(env(safe-area-inset-top, 0px) + 12px);
  }

  .streams-card{
    min-height:0;
    height:min(690px, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px));
    padding:54px 12px 12px;
  }

  .streams-data-chat-toggle,
  .streams-chat-toggle{
    min-height:30px;
    padding:0 10px;
    font-size:11px;
  }

  .streams-chat-mention-notice{
    padding:9px 11px;
  }

  .streams-chat-mention-notice__title,
  .streams-chat-mention-notice__text,
  .streams-chat-mention-notice__action{
    font-size:11px;
  }

  .streams-screen{
    height:clamp(214px, 26vh, 272px);
    min-height:214px;
  }
}

.modal[data-modal-kind="tv-streams"] > .modal__dialog > .modal__close{
  display:none !important;
}

.streams-popup{
  --stream-close-size:44px;
  --stream-close-gap:12px;
  --stream-close-safe-zone:calc(var(--stream-close-size) + var(--stream-close-gap) * 2);
  --tv-streams-keyboard-height:0px;
  --tv-streams-visible-height:var(--app-h, 100dvh);
  width:min(428px, calc(100vw - 20px));
  max-width:428px;
  max-height:inherit;
}

.streams-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:0;
  height:min(720px, calc(var(--tv-streams-visible-height, var(--app-h, 100dvh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 32px));
  max-height:calc(var(--tv-streams-visible-height, var(--app-h, 100dvh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 32px);
  padding:56px 14px 14px;
  gap:8px;
  overflow:hidden;
}

.streams-popup-close{
  position:absolute;
  top:var(--stream-close-gap);
  right:var(--stream-close-gap);
  width:var(--stream-close-size);
  height:var(--stream-close-size);
  z-index:100;
  pointer-events:auto;
}

.streams-popup:not(.streams-popup--landscape-lite) .streams-toolbar{
  display:none !important;
}

.streams-popup:not(.streams-popup--landscape-lite){
  --stream-close-size:40px;
  --stream-close-gap:8px;
}

.streams-popup:not(.streams-popup--landscape-lite) .streams-card{
  padding-top:60px;
}

.streams-popup:not(.streams-popup--landscape-lite) :is(.watch-tv-layout, .streams-live-layout){
  padding-top:18px;
}

.streams-popup:not(.streams-popup--landscape-lite) .watch-tv-left{
  display:flex !important;
  flex-direction:column !important;
  gap:4px !important;
  height:100% !important;
  min-height:0 !important;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-brand-block{
  flex:0 0 auto;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:6px 10px;
  border-radius:14px;
  background:rgba(12, 25, 45, 0.72);
  border:1px solid rgba(160, 190, 255, 0.18);
  box-sizing:border-box;
  overflow:hidden;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-brand-block .streams-brand{
  width:100%;
  max-width:100%;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  gap:4px;
  white-space:nowrap;
  overflow:hidden;
  justify-content:center;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-brand-block .streams-brand__word{
  font-size:clamp(15px, 3.4vw, 21px);
  font-weight:800;
  line-height:1;
  letter-spacing:.04em;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-brand-block .streams-brand__globe{
  font-size:clamp(15px, 3vw, 20px);
  line-height:1;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  width:100%;
  min-width:0;
  align-items:stretch;
  margin-top:0;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row > *{
  min-width:0;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row .streams-platform-btn{
  width:100%;
  min-width:0;
  min-height:36px;
  height:36px;
  border-radius:12px;
  padding:0 6px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  justify-self:stretch;
  box-sizing:border-box;
  box-shadow:none;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row .streams-platform-btn--youtube{
  background:rgba(10, 22, 40, 0.62);
  border:1px solid rgba(255, 80, 80, 0.35);
  box-shadow:inset 0 0 14px rgba(255, 60, 60, 0.08);
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row .streams-platform-btn--twitch{
  background:rgba(10, 22, 40, 0.62);
  border:1px solid rgba(150, 90, 255, 0.35);
  box-shadow:inset 0 0 14px rgba(140, 80, 255, 0.08);
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row .streams-platform-btn__glyph{
  width:18px;
  height:18px;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-platform-row .streams-platform-btn--youtube .streams-platform-btn__glyph{
  width:20px;
  height:20px;
}

.streams-popup:not(.streams-popup--landscape-lite) .plamtv-rating-card{
  flex:1 1 auto !important;
  min-height:0 !important;
  margin-top:0;
  overflow:hidden !important;
}

.streams-toolbar{
  display:grid;
  grid-template-columns:var(--stream-close-safe-zone) minmax(0, 1fr) var(--stream-close-safe-zone);
  align-items:center;
  min-height:48px;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  align-self:stretch;
  margin-bottom:2px;
}

.streams-toolbar > .watch-tv-platform-row,
.streams-toolbar > .streams-live-platform-row{
  grid-column:2;
  justify-self:center;
  width:100%;
  max-width:100%;
}

.streams-screen{
  flex:0 0 auto;
  width:100%;
  height:clamp(205px, 24dvh, 245px);
  min-height:205px;
  max-height:245px;
  overflow:hidden;
  border-radius:18px;
}

.watch-tv-top{
  grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);
  gap:8px;
}

.watch-tv-left{
  gap:8px;
}

.watch-tv-photo-area{
  border-radius:16px;
}

.streams-popup:not(.streams-popup--landscape-lite) .streams-live-photo-img,
.streams-popup:not(.streams-popup--landscape-lite) .streams-data-photo{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  display:block !important;
  object-fit:contain !important;
  object-position:center center !important;
}

.watch-tv-rating,
.streams-live-rating,
.streams-data-leaderboard{
  padding:5px 6px 4px;
  border-radius:15px;
}

.watch-tv-rating-viewport{
  overflow:hidden;
}

.streams-data-leaderboard-head{
  gap:1px;
  margin-bottom:1px;
}

.streams-data-leaderboard-head [data-streams-data-leaderboard-title]{
  font-size:7px;
  line-height:1.05;
}

.streams-data-leaderboard-head [data-streams-data-leaderboard-game]{
  font-size:8.5px;
  line-height:1.05;
}

.streams-data-leaderboard-rows{
  row-gap:0;
  grid-auto-rows:minmax(0, 1fr);
}

.streams-data-leaderboard-row{
  gap:3px;
  min-height:0;
}

.streams-data-leaderboard-rank,
.streams-data-leaderboard-name,
.streams-data-leaderboard-score{
  font-size:7.25px;
  line-height:1.02;
}

.streams-popup .streams-chat{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  margin-top:0;
  overflow:hidden;
}

.streams-chat-head{
  flex:0 0 auto;
  margin-bottom:8px;
  padding:0 0 8px;
}

.streams-rotate-note{
  flex:0 0 auto;
  padding:9px 11px;
  border-radius:16px;
  margin-bottom:8px;
}

.streams-chat-mention-notice{
  flex:0 0 auto;
  margin:0 0 8px;
}

.streams-popup .streams-chat-list{
  flex:1 1 auto;
  min-height:0;
  max-height:none;
  height:auto;
  overflow-y:auto;
}

.streams-chat-input-row{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  min-height:52px;
  margin-top:10px;
}

.streams-popup .streams-chat-input{
  height:52px;
  min-height:52px;
  max-height:52px;
  padding:0 14px;
}

.streams-popup .streams-chat-send{
  height:52px;
  min-height:52px;
  padding:0 18px;
}

.streams-popup--chat-expanded .streams-toolbar,
.streams-popup--chat-expanded .streams-tv-shell,
.streams-popup--chat-expanded .streams-rotate-note,
.streams-popup--chat-expanded .streams-chat-mention-notice{
  display:none !important;
}

.streams-popup--chat-expanded .streams-chat{
  flex:1 1 auto;
  min-height:0;
}

.streams-popup--chat-expanded .streams-chat-list{
  flex:1 1 auto;
  min-height:0;
}

.streams-popup--chat-expanded .streams-chat-head{
  min-height:44px;
  padding-right:60px;
}

html.stream-keyboard-open .modal[data-modal-kind="tv-streams"],
body.stream-keyboard-open .modal[data-modal-kind="tv-streams"]{
  top:var(--stream-vv-top, 0px);
  bottom:auto;
  height:var(--stream-vvh, var(--app-h, 100dvh));
  padding:
    0
    max(10px, env(safe-area-inset-right, 0px))
    6px
    max(10px, env(safe-area-inset-left, 0px));
  place-items:end center;
  overflow:hidden;
}

html.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .modal__dialog,
body.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .modal__dialog{
  align-self:end;
  max-height:100%;
  margin:0;
}

html.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .modal__content,
body.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .modal__content{
  max-height:100%;
  min-height:0;
  overflow:hidden;
}

html.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .streams-popup,
body.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .streams-popup{
  max-height:calc(var(--stream-vvh, var(--app-h, 100dvh)) - 6px);
  min-height:0;
  display:flex;
  flex-direction:column;
}

html.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .streams-card,
body.stream-keyboard-open .modal[data-modal-kind="tv-streams"] .streams-card{
  min-height:0;
  height:auto;
  max-height:100%;
  overflow:hidden;
}

html.keyboard-open .modal[data-modal-kind="tv-streams"] .streams-popup,
body.keyboard-open .modal[data-modal-kind="tv-streams"] .streams-popup{
  max-height:100%;
}

html.keyboard-open .modal[data-modal-kind="tv-streams"] .streams-card,
body.keyboard-open .modal[data-modal-kind="tv-streams"] .streams-card{
  height:auto;
  max-height:100%;
}

@media (max-width:390px){
  .streams-card{
    height:min(690px, calc(var(--tv-streams-visible-height, var(--app-h, 100dvh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px));
    max-height:calc(var(--tv-streams-visible-height, var(--app-h, 100dvh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px);
    padding:54px 12px 12px;
  }

  .streams-popup:not(.streams-popup--landscape-lite) .streams-card{
    padding-top:60px;
  }

  .streams-screen{
    height:clamp(188px, 23dvh, 228px);
    min-height:188px;
    max-height:228px;
  }

  .streams-toolbar{
    width:100%;
    max-width:100%;
    grid-template-columns:calc(var(--stream-close-safe-zone) - 10px) minmax(0, 1fr) calc(var(--stream-close-safe-zone) - 10px);
  }
}

/* предпросмотр выбранного фото */
.picked-box{
  width: 100%;
  display: grid;
  place-items: center;
  margin: 2px 0 6px;  /* было: 4px 0 6px */
}

.picked-empty{
  color:#fff; opacity:.7; font-size:12px;
}
.picked-item{
  position: relative;
  width: 80px;           /* фикс ширины */
  height: 80px;          /* фикс высоты */
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 14px rgba(0,0,0,.18);
  /* УДАЛИ, если было: aspect-ratio: 1; и width: var(--picked-size); */
}

.picked-item img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.picked-remove{
  position:absolute; top:6px; right:6px;
  width:28px; height:28px; border-radius:50%;
  border:0; cursor:pointer;
  background:#fff; color:#000; font-weight:800; line-height:1;
  box-shadow:0 2px 6px rgba(0,0,0,.2);
}
/* Центрированная обёртка под кнопку выбора файла */
.pick-wrap{
  position: relative;
  display: block;
  width: clamp(206px, 90%, 360px); /* такая же логика ширины, как у кнопки */
  margin-inline: auto;             /* по центру */
}

/* Кнопка внутри обёртки всегда на всю её ширину */
.pick-wrap .btn-pick{
  width: 100%;
}


/* Оверлей, блокирующий приложение в альбомной ориентации */
.orientation-lock{
  position:fixed;
  inset:0;
  z-index:2000;                /* выше модалок/стека */
  display:none;                /* показываем только в ландшафте */
  background:center/cover no-repeat;
  /* картинка предупреждения */
  background-image:image-set(
    url("./bgicons/rotate-warning.png") 1x,
    url("./bgicons/rotate-warning@2x.png") 2x
  );
  /* подложка на всякий случай, если картинка с прозрачностью */
  background-color:#0f1115;
}

.orientation-lock.is-active{ display:block; }

/* ===== Orientation lock: hard fallback to prevent landscape flash ===== */

/* на всякий: если у тебя уже есть display-логика через .is-active — это не ломает,
   а просто гарантирует показ в landscape */
@media (orientation: landscape) {
  #orientationLock{
    display: flex !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* блокируем прокрутку, чтобы не дергало layout */
  html, body{
    overflow: hidden !important;
  }

  /* чтобы не было "вспышки" интерфейса под заглушкой */
  .scene{
    visibility: hidden !important;
  }
}

/* Разрешаем landscape только для TV popup */
@media (orientation: landscape) {
  html.tv-streams-landscape-enabled #orientationLock{
    display:none !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
  html.tv-streams-landscape-enabled .scene{
    visibility:visible !important;
  }
}


/* --- Upload popup: writing mode --- */

/* по умолчанию как было */
.upload-popup .picked-box{
  transition: max-height .18s ease, opacity .12s ease, margin .18s ease, transform .18s ease;
}


/* небольшая «подкладка» снизу, когда открыта клавиатура (ставим из JS) */
.modal__content.has-kb-padding{
  /* padding-bottom выставляем из JS в px */
}

/* Карточка FAQ внутри попапа */
.faq-card{
  width:100%;
  max-width:420px;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
  gap:12px;
  max-height:calc(100svh - 96px);
  min-height:0;
}

/* Скроллируемая колонка с контентом */
.faq-scroll{
  min-height:0;
  max-height:none;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  color:#000;
  font-size:14px;
  line-height:1.45;
}

.faq-scroll::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}

.modal__content.modal__content--faq{
  overflow:hidden;
}

/* Заголовок */
.faq-title{
  margin:0;
  text-align:center;
  color:#000;
  font-weight:800;
  font-size:22px;
}

.faq-content{
  display:grid;
  gap:10px;
  padding:2px 2px 10px;
}

.faq-intro{
  position:relative;
  overflow:visible;
  display:grid;
  gap:12px;
  padding:16px;
  border-radius:22px;
  background:linear-gradient(160deg, #fffaf5 0%, #ffffff 44%, #f3f3f3 100%);
  border:1px solid rgba(255,115,0,.18);
  box-shadow:0 10px 24px rgba(0,0,0,.07);
}

.faq-intro::before{
  content:none;
}

.faq-intro::after{
  content:none;
}

.faq-intro__title{
  position:relative;
  z-index:1;
  margin:0;
  text-align:center;
  color:#111;
  font-size:19px;
  font-weight:900;
  line-height:1.2;
}

.faq-intro__text{
  position:relative;
  z-index:1;
  padding:13px 15px;
  border-radius:16px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(0,0,0,.06);
  color:#2f2f2f;
  font-size:14px;
  line-height:1.45;
  box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.faq-block-title{
  margin:0 2px;
  color:rgba(0,0,0,.58);
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.faq-accordion-block{
  display:grid;
  gap:8px;
}

.faq-steps{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:9px;
}

.faq-step{
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:11px 10px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(244,244,244,.98));
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 8px 18px rgba(0,0,0,.05);
  color:#111;
  font-size:14px;
  font-weight:800;
  line-height:1.25;
  text-align:center;
}

.faq-accordion__item{
  border:1px solid rgba(0,0,0,.1);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,248,248,.96));
  box-shadow:0 8px 18px rgba(0,0,0,.05);
  overflow:hidden;
}

.faq-accordion__summary{
  list-style:none;
  position:relative;
  padding:16px 56px 16px 16px;
  display:flex;
  align-items:center;
  cursor:pointer;
  font-size:15px;
  font-weight:800;
  line-height:1.3;
  color:#111;
  user-select:none;
}

.faq-accordion__summary::-webkit-details-marker{
  display:none;
}

.faq-accordion__summary-text{
  display:block;
  flex:1 1 auto;
  padding-right:6px;
}

.faq-accordion__chevron{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#fff1e6;
  box-shadow:inset 0 0 0 1px rgba(255,115,0,.12);
  transition:transform .18s ease, background-color .18s ease;
}

.faq-accordion__chevron::before{
  content:"";
  width:8px;
  height:8px;
  border-right:2px solid #FF7300;
  border-bottom:2px solid #FF7300;
  transform:translateY(-1px) rotate(45deg);
}

.faq-accordion__item[open] .faq-accordion__summary{
  background:rgba(255,115,0,.06);
}

.faq-accordion__item[open] .faq-accordion__chevron{
  transform:translateY(-50%) rotate(180deg);
}

.faq-accordion__panel{
  padding:0 16px 14px;
  color:#000;
}

.faq-accordion__panel > :first-child{
  margin-top:0;
}

.faq-accordion__panel > :last-child{
  margin-bottom:0;
}

.faq-accordion__panel p,
.faq-accordion__panel ul,
.faq-accordion__panel ol,
.faq-accordion__panel .u-center{
  margin:0 0 12px;
}

.faq-note{
  padding:12px 14px;
  border-radius:14px;
  background:#fff3e8;
  border:1px solid rgba(255,115,0,.22);
  color:#5c3920;
  font-size:13px;
  line-height:1.4;
}

.faq-note strong{
  color:#d65d00;
}

.faq-utility-card{
  padding:15px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 8px 18px rgba(0,0,0,.05);
  color:#222;
}

.faq-utility-card__title{
  margin:0 0 8px;
  color:#111;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
}

.faq-utility-card p{
  margin:0;
  font-size:14px;
  line-height:1.45;
}

.faq-action-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:46px;
  margin-top:12px;
  padding:12px 16px;
  border-radius:999px;
  background:#FF7300;
  color:#fff;
  text-decoration:none;
  font-size:15px;
  font-weight:900;
  line-height:1.1;
  box-shadow:0 8px 18px rgba(255,115,0,.24);
}

.faq-action-btn:active{
  transform:translateY(1px);
}

.faq-utility-card--training{
  background:
    radial-gradient(circle at top right, rgba(255,115,0,.14), transparent 34%),
    rgba(255,255,255,.96);
}

.faq-docs-block{
  display:grid;
}

.faq-accordion__item--docs{
  box-shadow:0 6px 16px rgba(0,0,0,.045);
}

.faq-accordion__panel--docs{
  padding-top:2px;
}

.faq-docs{
  display:grid;
  gap:8px;
}

.faq-docs__link{
  display:block;
  padding:11px 12px;
  border-radius:14px;
  background:#f5f5f5;
  color:#111;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  line-height:1.3;
  border:1px solid rgba(0,0,0,.06);
}

.faq-docs__link:active{
  transform:translateY(1px);
}

/* Плейсхолдеры под картинки */
.faq-img{
  width:100%;
  height:140px;                 /* можно заменить на aspect-ratio: 16/9; */
  border-radius:12px;
  background: #eee;
  border: 2px dashed rgba(0,0,0,.15);
  box-shadow: 0 2px 8px rgba(0,0,0,.06) inset;
  margin:10px 0;
}

@media (max-width:375px){
  .faq-steps{
    grid-template-columns:1fr;
  }
  .faq-intro__title{
    font-size:17px;
  }
  .faq-accordion__summary{
    padding:15px 54px 15px 15px;
  }
}

/* FAQ: крестик нужен как и в остальных окнах */
.modal__dialog:has(.faq-popup) .modal__close{
  display: flex;
}

/* Сделать карточку диалога сплошной как в FAQ */
.modal--opaque .modal__dialog{
  background: var(--chip);
}

/* Включить реальный скролл у длинного попапа */
.modal__content.is-scrollable{
  max-height: calc(100svh - 140px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 8px; /* небольшой запас под «липкую» кнопку */
}

/* Лидерборд: работаем через реальные контейнеры модалки, а не через общий modal */
#leadersModal{
  place-items:center;
  padding:
    var(--plam-modal-safe-top)
    12px
    var(--plam-modal-safe-bottom);
  box-sizing:border-box;
}

#leadersModal .modal__dialog{
  width:min(420px, calc(100vw - 24px));
  max-width:420px;
  margin-top:0;
  padding:0;
  background:transparent;
  box-shadow:none;
  border-radius:18px;
  overflow:visible;
  align-self:center;
}

/* Карточка списка: реальное скругление и небольшой зазор перед кнопкой */
#leadersModal .lb-list.card{
  border-radius:16px;
  margin-bottom:8px;
  min-height:0;
  height:auto;
  max-height:min(420px, calc(100svh - env(safe-area-inset-top, 0px) - 430px));
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  transition:opacity .14s ease;
}

/* Контейнер попапа */
#leadersModal .leaderboard-popup{
  width:100%;
  max-width:420px;
  margin-inline:auto;
  display:grid;
  gap:8px;
  align-content:start;
  position:relative;
}

.lb-list.card.is-locked{
  position: relative;
  isolation: isolate;
}

.lb-list.card.is-locked::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:16px;
  z-index:20;
  background: rgba(5,14,29,.22);
  backdrop-filter: blur(8px) saturate(.6);
  -webkit-backdrop-filter: blur(8px) saturate(.6);
}

.lb-lock-banner{
  position:absolute;
  z-index:50;
  box-sizing:border-box;
  text-align:center;
  pointer-events:auto;
  padding:22px 18px;
  border-radius:24px;
  color:var(--plam-text-main);
  background:var(--plam-card-bg-strong);
  border:1px solid var(--plam-card-border);
  box-shadow:none;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display:grid;
  align-content:center;
  justify-items:center;
  gap:14px;
  overflow:hidden;
}

.lb-lock-banner[hidden]{
  display:none !important;
}

.lb-lock-title{
  font-weight:900;
  font-size:clamp(17px, 4.6vw, 22px);
  line-height:1.28;
  margin:0;
  color:var(--plam-text-main);
}

.lb-lock-progress{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:0;
  transform:none;
}

.lb-lock-progress-digits{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  font-weight:900;
  font-size:clamp(30px, 8vw, 44px);
  line-height:1;
  letter-spacing:-0.03em;
  color:var(--plam-text-main);
}

.lb-lock-progress-slash{
  width:auto;
  height:auto;
  display:block;
  background:none;
  transform:none;
  font-weight:800;
  font-size:clamp(24px, 6vw, 34px);
  line-height:1;
  color:var(--plam-text-soft);
}

.lb-lock-progress-slash::before{
  content:"/";
}

.lb-lock-action{
  border:0;
  border-radius:999px;
  background:var(--plam-orange);
  color:#fff;
  font-weight:900;
  font-size:16px;
  line-height:1;
  padding:12px 20px;
  min-width:190px;
  box-shadow:none;
  cursor:pointer;
  margin-top:0;
}

.lb-lock-action:active{
  transform:translateY(1px);
}

html[data-theme="light"] .lb-list.card.is-locked::before{
  background: rgba(255,255,255,.28);
  backdrop-filter: blur(8px) saturate(.8);
  -webkit-backdrop-filter: blur(8px) saturate(.8);
}

html[data-theme="light"] .lb-lock-banner{
  background:var(--plam-card-bg-strong);
  border-color:var(--plam-card-border);
  color:var(--plam-text-main);
}

html[data-theme="light"] .lb-lock-title,
html[data-theme="light"] .lb-lock-progress-digits{
  color:var(--plam-text-main);
}

html[data-theme="light"] .lb-lock-progress-slash{
  color:var(--plam-text-soft);
}

/* Шапка с пьедесталом */
#leadersModal .lb-header{
  padding:12px 10px 10px;
  display:grid;
  gap:5px;
  justify-items:center;
  color:#000;
  position:relative;
}
.lb-topbar{
  width:100%;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}
.lb-topbar-spacer{
  display:none;
}
#leadersModal .lb-title{
  margin:-4px 0 0;
  font-weight:800;
  font-size:20px;
  line-height:1.1;
  text-align:center;
}
#leadersModal .lb-sub{
  margin:0;
  font-weight:500;
  font-size:13px;
  opacity:.85;
  text-align:center;
}
#leadersModal .lb-tabs{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:min(100%, 190px);
  min-height:32px;
  padding:4px;
  border-radius:999px;
  background:rgba(0,0,0,.08);
  justify-self:center;
  margin-top:2px;
}
#leadersModal .lb-top-close{
  position:absolute;
  top:12px;
  right:12px;
  width:30px;
  height:30px;
  border-radius:999px;
  border:0;
  padding:0;
  background: rgba(0,0,0,.55);
  color: transparent;
  font-size: 0;
  line-height: 0;
  cursor:pointer;
  -webkit-tap-highlight-color: transparent;
}
.lb-top-close::before,
.lb-top-close::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:2px;
  background:#fff;
  border-radius:2px;
}
.lb-top-close::before{ transform: translate(-50%, -50%) rotate(45deg); }
.lb-top-close::after{ transform: translate(-50%, -50%) rotate(-45deg); }
.lb-top-close:active{
  transform: translateY(1px);
}
.lb-tab{
  flex:1 1 0;
  border:0;
  border-radius:999px;
  height:28px;
  padding:0 12px;
  background:transparent;
  color:#000;
  font-weight:900;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  -webkit-appearance:none;
  appearance:none;
}
.lb-tab.is-active{
  background:#fff;
  box-shadow:0 3px 8px rgba(0,0,0,.14);
}
.lb-tab:active{
  transform: translateY(1px);
}
.lb-tab:focus-visible{
  outline:2px solid rgba(0,0,0,.35);
  outline-offset:2px;
}

/* === Герой-блок в шапке: картинка пьедестала + слоты над ней === */

/* базовый размер слотов (средние экраны) */
#leadersModal .lb-hero{ --lb-slot: 62px; }

#leadersModal .lb-hero{
  position: relative;
  width: 296px;
  margin: calc(var(--lb-slot) + 2px) auto 0;
  transform: translateY(-10px);
}

/* Картинка пьедестала */
.lb-podium-img{
  width: 100%;
  aspect-ratio: 280 / 138;      /* сохранены прежние размеры блока */
  background: center / contain no-repeat;
  background-image: url("./bgicons/podiumv2.png?v=1");
}

/* Пустые квадраты над картинкой (под будущие иконки/аватарки) */
.lb-slot{
  position: absolute;
  top: calc(-1 * (var(--lb-slot) + 8px)); /* над верхом картинки */
  width: calc(var(--lb-slot) * 1.5);
  height: calc(var(--lb-slot) * 1.5);
  transform: translateX(-50%);
  border-radius: 12px;
  background: center / contain no-repeat;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,.22));
  /* если нужна видимая сетка-ориентир — раскомментируй:
  outline: 1px dashed rgba(0,0,0,.25);
  */
  pointer-events: none;
}

/* позиционирование по горизонтали:
   2 — слева, 1 — центр, 3 — справа */
.lb-slot--2{ left: 25%; }
.lb-slot--1{ left: 50%; }
.lb-slot--3{ left: 75%; }

/* Точная ручная подгонка:
   left/top сохранены по твоим значениям */
.lb-slot--2{
  left: calc(25% - 33px);
  top: calc(-1 * (var(--lb-slot) + 8px) + 62px);
}
.lb-slot--1{
  top: calc(-1 * (var(--lb-slot) + 8px) + 20px);
}
.lb-slot--3{
  left: calc(75% + 27px);
  top: calc(-1 * (var(--lb-slot) + 8px) + 78px);
}

/* Маленькие экраны (как в проекте) — слоты поменьше */
@media (max-width:375px){
  #leadersModal .lb-hero{ --lb-slot: 54px; width: 272px; }
}

/* Очень маленькие экраны: уменьшаем пьедестал еще на 20px по ширине */
@media (max-width:340px){
  #leadersModal .lb-hero{ width: 252px; }
}

/* Большие экраны — слоты побольше */
@media (min-width:768px){
  #leadersModal .lb-hero{ --lb-slot: 76px; width: 344px; }
}


/* сам список — без нумерации и без внутренних зазоров */
#leadersModal .lb-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0; /* было 10px */
  align-content:start;
  grid-auto-rows:max-content;
  position: relative;
}
.lb-list.is-updating{
  opacity:.86;
}
/* строки — без фона и скруглений, только разделитель снизу */
/* компактная строка-лидера с сеткой */
#leadersModal .lb-item{
  display:grid;
  grid-template-columns: 26px 1fr auto;
  align-items:center;
  column-gap:8px;
  padding:7px 12px;
  min-height:42px;
  background:transparent;
  border-radius:0;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.lb-item--placeholder .lb-ava{
  background:#d6d6d6;
}
.lb-item--placeholder .lb-nick,
.lb-item--placeholder .lb-photos,
.lb-item--placeholder .lb-rank{
  color:rgba(0,0,0,.42);
}
#leadersModal .lb-item--empty{
  min-height:180px;
  align-content:center;
  justify-items:center;
  text-align:center;
  grid-template-columns:1fr;
  padding:24px 18px;
}
.lb-item--empty .lb-text{
  justify-items:center;
  gap:6px;
}
/* Моя строка внизу списка */
#leadersModal .lb-item--me{
  background: #14AE5C;           /* зелёный фон */
  position: sticky;
  bottom: 0;
  z-index: 5;
  border-top: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 -6px 14px rgba(0,0,0,.16);
}
#leadersModal .lb-item--me .lb-nick,
#leadersModal .lb-item--me .lb-photos,
#leadersModal .lb-item--me .lb-rank{
  color: #fff;
  opacity: 1;
}
#leadersModal .lb-item--me .lb-ava{
  background: #fff;                      /* фолбэк, если нет фото */
  box-shadow: 0 0 0 2px rgba(255,255,255,.35) inset;
}

.lb-item:last-child{ border-bottom:0; }
/* сам кружок-аватар */
#leadersModal .lb-ava{
  display:block;          /* чтобы width/height работали всегда */
  width:26px;
  height:26px;
  border-radius:50%;
  background:#555;
}
#leadersModal .lb-text{
  display:grid;
  gap:1px;
  line-height:1;
}
#leadersModal .lb-nick{
  color:#FF7300;
  font-weight:800;
  font-size:12px;
}
#leadersModal .lb-photos{
  color:#000;
  opacity:.9;
  font-size:10px;
}
#leadersModal .lb-rank{
  min-width:22px;
  text-align:right;
  font-weight:800;
  font-size:14px;
  color:#000;
  opacity:.75;
}
/* для 1–3 мест оставляем пустую ячейку под медальки */
#leadersModal .lb-rank--medal{
  width:22px;
  height:22px;
  opacity:1;
}

/* Лидерборд: отдельный scroll-контейнер и безопасная высота */
#leadersModal .modal__content.is-scrollable{
  max-height:calc(100vh - env(safe-area-inset-top, 0px) - 102px);
  max-height:calc(100svh - env(safe-area-inset-top, 0px) - 102px);
  padding:0 0 8px;
  overflow:hidden;
  overflow-x:hidden;
  scrollbar-width: none;         /* Firefox */
  -ms-overflow-style:none;
  border-radius: 18px;           /* как у внешнего окна */
  clip-path: inset(0 round 18px);
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
#leadersModal .modal__content.is-scrollable::-webkit-scrollbar{
  width: 0;
  height: 0;
  display:none;
}

/* Лидеры: аватар внутри кружка */
#leadersModal .leaderboard-popup .lb-item .lb-ava,
#leadersModal .leaderboard-popup .lb-item--me .lb-ava {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border-radius: 50%;
  background-size: cover;          /* заполняет круг, центрирует, слегка обрезает по краям */
  background-position: center;
  background-repeat: no-repeat;
}

/* если нужно вписывать БЕЗ обрезки — замените cover на contain */
/* background-size: contain; */

/* Базовая ячейка ранга */
#leadersModal .leaderboard-popup .lb-rank {
  min-width: 22px;
  height: 22px;
  flex: 0 0 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Медаль-эмодзи */
#leadersModal .leaderboard-popup .lb-rank.lb-rank--emoji {
  font-size: 17px;
  line-height: 1;
}




/* диалог — непрозрачный, скролл включён (у тебя это уже есть для .modal--opaque) */
.modal--opaque .modal__dialog{ background: var(--chip); }
.modal__content.is-scrollable{
  max-height: calc(100svh - 140px);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.modal__dialog:has(.actions-popup){ background: var(--chip); }


.decal--plane{
  position:absolute;
  /* ВАЖНО: отменяем центрирование базового .decal */
  transform: none;

  /* Привязываем к левому краю сцены */
  left: 0;
  top:   calc(var(--plane-y-m)/var(--design-h)*100%);

  /* Размеры по макету → проценты сцены */
  width:  calc(var(--plane-w-m)/var(--design-w)*100%);
  height: calc(var(--plane-h-m)/var(--design-h)*100%);

  z-index:23;
  pointer-events:none;

  /* Гиф растягиваем под контейнер без обрезки и стартуем от левого края */
  background-position: left center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("./bgicons/plane.gif");
}

@media (max-width:375px){
  .decal--plane{
    top:   calc(var(--plane-y-s)/var(--design-h)*100%);
    width: calc(var(--plane-w-s)/var(--design-w)*100%);
    height:calc(var(--plane-h-s)/var(--design-h)*100%);
  }
}
@media (min-width:768px){
  .decal--plane{
    top:   calc(var(--plane-y-l)/var(--design-h)*100%);
    width: calc(var(--plane-w-l)/var(--design-w)*100%);
    height:calc(var(--plane-h-l)/var(--design-h)*100%);
  }
}

/* Палитра (если своих переменных нет) */
:root{
  --plam-orange: #FF7A00;
  --plam-green:  #14AE5C;
  --plam-gray:   #D9D9D9;
}

.upload-popup{
  display: grid;          /* на случай, если нет .popup */
  gap: 10px !important;    /* общий gap между блоками */
}

/* Большой таймер над кнопкой в попапе загрузки */
.upload-popup [data-cd-text]{
  display:block;
  color:#BABABA;
  font-weight:800;
  font-size:22px;
  line-height:1.2;
  text-align:center;
  /*margin-bottom:4px;*/
  user-select:none;
}

/* Кнопка отправки по умолчанию (если нет своих стилей — можно оставить) */
.upload-popup [data-submit]{
  background: var(--plam-orange);
  color: #fff;
  font-weight: 700;
  transition: background .2s ease, opacity .2s ease;
}

/* Отключенная кнопка, когда нет файла */
.upload-popup [data-submit][disabled]{
  opacity: .5;
  pointer-events: none;
}

/* Если решишь вместо inline-стилей использовать класс is-cooldown — 
   JS может просто add/remove('is-cooldown') на submitBtn */
.upload-popup [data-submit].is-cooldown{
  background: var(--plam-green);
  color: #fff;
}

/* Попап “Сбросить таймер” (серый, непрозрачный) */
.reset-popup{
  width:100%;
  max-width:420px;
  text-align:center;
}


/* заголовок */
.reset-title{
  margin: 0 0 12px;
  font-weight: 700;
  font-size: 18px;
  color:#000;
}


.upload-popup .btn-submit{ width:100%; }
.upload-popup .btn-submit[disabled]{ opacity:.5; pointer-events:none; }

.btn-pay--green{
  background: var(--plam-green);
  box-shadow: 0 6px 14px rgba(20,174,92,.22);
}

.subs-title .coin{
  width:22px; height:22px; vertical-align:middle; margin-right:6px;
}


/* ===== Reset-cooldown: кнопка "Сбросить ... за ... PLAMc" ===== */
.reset-popup [data-reset-now]{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  width: clamp(206px, 90%, 360px);
  height: 56px;
  padding: 0 18px;

  border: 0;
  border-radius: 35px;

  font-size: 16px;
  font-weight: 800;
  line-height: 1.1;

  background: #14AE5C !important; /* зелёная как активные */
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(20,174,92,.22) !important;

  cursor: pointer;

  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

/* disabled — как неактивная "Забрать" */
.reset-popup [data-reset-now]:disabled,
.reset-popup [data-reset-now][aria-disabled="true"]{
  background: #D9D9D9 !important;
  color: #777 !important;
  -webkit-text-fill-color: #777; /* iOS */
  box-shadow: none !important;

  opacity: 1;
  filter: none;
  cursor: not-allowed;
}


/* На iOS/Telegram disabled-кнопки часто “обесцвечиваются” и теряют фон — фиксируем */
.reset-popup [data-reset-now]:disabled,
.reset-popup [data-reset-now][aria-disabled="true"]{
  opacity: 1;                 /* убираем системное “выцветание” */
  -webkit-text-fill-color: rgba(0,0,0,.35); /* iOS: чтобы текст не становился “невидимым” */
  background: #e6e6e6 !important;
  color: rgba(0,0,0,.35) !important;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 8px 16px rgba(0,0,0,.12);
  filter: none;
  cursor: default;
}

/* Чтоб сохранялась “кнопочность” (пилюля) даже если где-то глобально режется padding/радиус */
.reset-popup [data-reset-now]:disabled{
  border-radius: 999px;
}



/* === Policy popup buttons === */
.policy-popup .modal__actions{
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
  margin-top: 14px;
}

.policy-popup .btn{
  flex: 1 1 0;
  min-width: 140px;
  height: 52px;
  padding: 0 18px;
  border: 0;
  border-radius: 28px;
  font-weight: 800;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  background: #D9D9D9;
  color: #222;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}

.policy-popup .btn:active{ transform: translateY(1px); }

/* основная (оранжевая) */
.policy-popup .btn-primary{
  background: #FF7300;
  color: #fff;
}

/* disabled — серая и некликабельна */
.policy-popup .btn[disabled],
.policy-popup .btn-primary[disabled]{
  background: #D9D9D9 !important;
  color: #777 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* поведение на фокус для доступности */
.policy-popup .btn:focus-visible{
  outline: 3px solid rgba(255,115,0,.5);
  outline-offset: 2px;
}

/* чекбокс и подпись — крупнее и приятнее */
.policy-popup .policy-check{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  font-weight: 600;
  color: #fff;
}

.policy-popup .policy-check input[type="checkbox"]{
  width: 22px;
  height: 22px;
  accent-color: #FF7300; /* поддерживается в современных браузерах */
}

/* Плавные анимации для всех модалок */
.modal,
.modal--stack{
  /* твои позиционирования остаются как есть */
}

.modal__backdrop{
  /* старт — прозрачный */
  background: rgba(0,0,0,0);
  transition: background 220ms ease;
}

/* при открытом состоянии */
.modal[aria-hidden="false"] .modal__backdrop{
  background: rgba(0,0,0,.5);
}

/* Backdrop blur: only regular modals (exclude stack modals) */
.modal:not(.modal--stack) .modal__backdrop{
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

/* Stack modals stay without blur */
.modal.modal--stack .modal__backdrop{
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* диалог: лёгкий подъём + scale + fade */
.modal__dialog{
  transform: translateY(12px) scale(.98);
  opacity: 0;
  transition:
    transform 260ms cubic-bezier(.22,.61,.36,1),
    opacity   220ms ease;
  will-change: transform, opacity;
}

/* открыто */
.modal[aria-hidden="false"] .modal__dialog{
  transform: translateY(0) scale(1);
  opacity: 1;
}

/* фаза закрытия: чуть вниз и лёгкое уменьшение прозрачности */
.modal.is-leaving .modal__dialog{
  transform: translateY(8px) scale(.985);
  opacity: 0;
}

/* уважение к настройкам пользователя */
@media (prefers-reduced-motion: reduce){
  .modal__dialog,
  .modal__backdrop{
    transition: none !important;
  }
}

/* Android Telegram WebView: lighter compositing for smoother UI */
html.is-android-webapp .modal:not(.modal--stack) .modal__backdrop,
html.is-android-webapp .streams-card{
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.is-android-webapp .streams-card{
  background: rgba(8, 18, 36, .82);
}
html.is-android-webapp .modal__dialog{
  will-change: auto;
}

/* Прятать крестик только в попапе "Преимущества премиум-подписки" */
.modal:has(.premium-compare) .modal__close,
.modal--stack:has(.premium-compare) .modal__close{
  display: none !important;
}
/* Правила в стек-модалке: без крестика */
.modal.modal--stack.stack--policy .modal__close {
  display: none;
}


/* Правила: чёрный текст внутри попапа */
.policy-popup,
.policy-popup .modal__title,
.policy-popup .policy-body,
.policy-popup .policy-body p,
.policy-popup .policy-body li,
.policy-popup .policy-check span {
  color: #000;
}

/* Если в правилах есть ссылки — пусть остаются читаемыми */
.policy-popup a {
  color: #000;
  text-decoration: underline;
}

/* === Стек с правилами: безопасная высота + прокрутка + отступы снизу === */
.modal.modal--stack.stack--policy .modal__dialog {
  /* компактная ширина и безопасная высота */
  width: min(560px, calc(100% - 24px));
  max-height: min(680px, 92dvh); /* dvh фиксит мобильные браузеры */
  display: flex;
  flex-direction: column;
}

/* Контейнер контента в стеке — скроллим именно его */
.modal.modal--stack.stack--policy .modal__content {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /* чтобы контент не лип к краям */
  padding: 16px;
  padding-bottom: calc(20px + env(safe-area-inset-bottom));
  box-sizing: border-box;
}

/* Сам попап правил — вертикальная колонка */
.policy-popup {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Прокручиваемая часть правил */
.policy-popup .policy-body,
.policy-popup .is-scrollable {
  max-height: none;      /* не ограничиваем высоту текста внутри */
  overflow: visible; /* отключаем вложенный скролл, чтобы не было двух полос */
  padding-bottom: 0;
}

/* Блок кнопок — всегда виден, не «уезжает» под край */
.policy-popup .modal__actions {
  position: static;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin: 0;                 /* убираем внезапные внешние отступы */
  margin-top: 16px;
  padding: 0;
  background: transparent;       /* чтобы не резалось, можно поставить сплошной фон */
  /* если фон прозрачный и нужно «подложить» цвет, раскомментируй:
     background: rgba(255,255,255,.92);
  */
}

/* На очень узких экранах кнопки могут сильно ужиматься — пусть переносятся */
@media (max-width: 360px) {
  .policy-popup .modal__actions {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }
}

/* Небольшой внутренний отступ у заголовка и чекбокса, чтобы ничего не прилипало к краям */
.policy-popup .modal__title { margin: 0; }
.policy-popup .policy-check { padding: 4px 0; }

/* === Splash (APNG, full-bleed cover) === */
.splash {
  position: fixed;
  inset: 0;
  z-index: 10000;           /* поверх всего */
  display: block;           /* на случай, если раньше стоял grid/inline */
  overflow: hidden;         /* обрезаем лишнее по краям */
  background: var(--sky);   /* чтобы не было белой полосы на iOS */
}

/* Картинка покрывает весь экран как background-size: cover */
.splash__img {
  width: 100%;
  height: 100%;             /* всегда по контейнеру .splash */
  max-width: none;
  max-height: none;
  display: block;
  object-fit: cover;        /* «cover» по обеим осям */
  object-position: center;  /* фокус по центру; можно 'center bottom' и т.п. */
  image-rendering: auto;
  user-select: none;
  pointer-events: none;
}

/* Мягкое скрытие заставки */
.splash.is-hidden {
  opacity: 0;
  transition: opacity .25s ease-out;
  pointer-events: none;
}

/* Опционально: уважать настройки «уменьшить анимацию» */
@media (prefers-reduced-motion: reduce) {
  .splash.is-hidden { transition: none; }
}

/* Убрать крестик в стеке, когда нужно (confirm-premium, premium-timer) */
.modal.modal--stack.stack--no-close .modal__close {
  display: none !important;
}

/* Splash: не блокирует клики после скрытия */
#appLoading, .splash { z-index: 9999; }
#appLoading.is-hidden, .splash.is-hidden { pointer-events: none; }

/* === Reset cooldown popup tweaks === */
.reset-popup [data-or-text],
.reset-popup .reset-or {
  color: #000;                 /* "или" — чёрным */
  text-align: center;
  font-weight: 500;
  margin: 10px 0 12px;
  opacity: 1;                  /* на всякий случай, если где-то был .u-muted */
}

/* Контейнер кнопки "Поделиться" по центру */
.reset-popup [data-share-wrap] {
  display: flex;
  justify-content: center;
}

/* Стили зелёной кнопки для "Поделиться" */
.reset-popup [data-reset-share],
.reset-popup [data-share-once] {
  display: inline-block;
  min-width: 220px;
  padding: 14px 18px;
  border: 0;
  border-radius: 22px;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  background: #14ae5c;
  cursor: pointer;
  transition: transform .08s ease, filter .08s ease, opacity .2s ease;
}

.reset-popup [data-reset-share]:active,
.reset-popup [data-share-once]:active {
  transform: translateY(1px);
}

.reset-popup [data-reset-share]:disabled,
.reset-popup [data-share-once]:disabled {
  opacity: .55;
  filter: grayscale(.1);
  cursor: default;
}

/* Больше отступ сверху в окне сброса таймера, чтобы крестик не налезал */
.modal.modal--stack .modal__content .reset-popup {
  padding-top: 8px;
}

.promo-form { margin: 8px 0 12px; }
.promo-row { display:flex; gap:8px; }
.promo-input {
  flex:1; height:44px; border-radius:var(--radius-field); padding:0 14px;
  border:1px solid rgba(0,0,0,.12); background:#fff;
}
.promo-hint { margin:6px 2px 0; font-size:12px; opacity:.7; }

/* Больше "воздуха" у кнопки Активировать + зелёный стиль */
.promo-form [data-promo-apply] {
  padding-inline: 10px;            /* было тесно по бокам */
  background: #14AE5C;             /* зелёная кнопка */
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  box-shadow: 0 6px 18px rgba(20,174,92,.25);
  min-height: 44px;  
}

/* ховеры/нажатие/disabled — на вкус */
.promo-form [data-promo-apply]:hover   { filter: brightness(1.05); }
.promo-form [data-promo-apply]:active  { transform: translateY(1px); }
.promo-form [data-promo-apply]:disabled{ opacity: .5; filter: none; }

/* Prizes popup: keep claim button reachable with many items */
.modal__dialog:has(.prizes-popup){
  max-height: calc(100svh - 10px);
}

.modal__dialog:has(.prizes-popup) .modal__content{
  max-height: calc(100svh - 92px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.modal__dialog:has(.prizes-popup) .prizes-popup{
  padding-bottom: 12px;
}

/* Prizes popup fallback for WebView without :has() */
.modal[data-modal-kind="prizes"] .modal__dialog{
  max-height: calc(100vh - 10px);
  max-height: calc(100svh - 10px);
}

.modal[data-modal-kind="prizes"] .modal__content{
  max-height: calc(100vh - 92px);
  max-height: calc(100svh - 92px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

.modal[data-modal-kind="prizes"] .prizes-popup{
  padding-bottom: 12px;
}

/* Prizes popup: small screens only (iPhone 5/SE-like widths) */
@media (max-width:375px){
  .modal__dialog:has(.prizes-popup){
    padding-left: max(10px, env(safe-area-inset-left));
    padding-right: max(10px, env(safe-area-inset-right));
    padding-top: 34px;
    padding-bottom: 18px;
  }
  .modal[data-modal-kind="prizes"] .modal__dialog{
    padding-left: max(10px, env(safe-area-inset-left));
    padding-right: max(10px, env(safe-area-inset-right));
    padding-top: 34px;
    padding-bottom: 18px;
  }

  .prizes-popup{
    width: 100%;
    max-width: 100%;
    justify-items: center;
  }

  .prizes-popup > *{
    max-width: 100%;
  }

  .prize-grid{
    width: min(100%, 270px);
    max-width: 270px;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    justify-content: center;
  }

  .prize-item{
    width: 100%;
  }

  .prize-card{
    width: 100%;
    max-width: 84px;
    height: auto;
    aspect-ratio: 1 / 1;
    justify-self: center;
  }

  .promo-form{
    width: calc(100% - 90px);
    max-width: calc(100% - 90px);
    margin: 6px 0 10px;
    justify-self: center;
    margin-inline: auto;
  }

  .prize-grid,
  .u-center,
  .pay-note{
    justify-self: center;
    margin-inline: auto;
  }

  .promo-row{
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
  }

  .promo-input{
    width: 100%;
    min-width: 0;
    height: 40px;
    padding: 0 12px;
    font-size: 15px;
  }

  .promo-form [data-promo-apply]{
    min-width: 0;
    min-height: 40px;
    height: 40px;
    padding-inline: 10px;
    font-size: 14px;
    white-space: nowrap;
  }

  .promo-hint,
  .pay-note{
    width: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }

  .u-center{
    width: 100%;
    justify-content: center;
  }

  .btn-pay{
    min-width: 0;
    width: min(100%, 220px);
    height: 50px;
    font-size: 16px;
  }
}

@media (max-width: 340px){
  .promo-row{
    grid-template-columns: 1fr;
  }

  .promo-form [data-promo-apply]{
    width: 100%;
  }
}

/* Upload popup: scroll popup itself while keyboard is open (all devices) */
.modal__dialog:has(.upload-popup){
  max-height: calc(100svh - 10px);
}

.modal__dialog:has(.upload-popup) .modal__content{
  max-height: calc(100svh - 92px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-bottom: calc(12px + var(--kb, 0px));
}

.modal__dialog:has(.upload-popup) .upload-popup{
  padding-bottom: 12px;
}

/* Profile: bottom row switches (language only) */
.profile-bottom-switches{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  width:100%;
  margin-top:auto;          /* если родитель flex-column — прижмёт к низу */
}

.profile-bottom-switches__left{
  display:flex;
  align-items:flex-end;
}

.profile-bottom-switches__right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;     /* справа */
}

/* На очень узких экранах можно переносить в столбик, чтобы не налезали */
@media (max-width: 360px){
  .profile-bottom-switches{
    flex-direction:column;
    align-items:stretch;
  }
  .profile-bottom-switches__left{
    align-items:flex-start;
  }
  .profile-bottom-switches__right{
    align-items:flex-start;
  }
}

/* Stars badge near the main plus button */
.hotspot--plus .stars-badge{
  position:absolute;
  right:100%;
  top:50%;
  transform:translate(calc(-1 * var(--stars-plus-gap, 2px)), -50%);
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  min-width:1ch;
  font-weight:800;
  font-size:14px;
  line-height:1;
  color:#F6E3A8;
  text-shadow:0 2px 4px rgba(0,0,0,.25);
  pointer-events:none;
  white-space:nowrap;
}

.stars-badge__value{
  display:block;
}

@media (min-width:768px),(min-height:1024px){
  .hotspot--plus .stars-badge{
    font-size:24px;
  }
}


/* ===== Shop: отдельный блок "Ваши звёзды" (Вариант А) ===== */
.shop-balance{
  width:100%;
  padding:12px 14px 8px;
  border-radius:16px;
  background: #fff;
  border: 1px solid rgba(255,115,0,.5);
  /* визуально отличаем от строк обмена */
  box-shadow: inset 0 0 0 2px rgba(255,115,0,.5);
  display:grid;
  gap:10px;
}

.shop-balance__label{
  font-size:11px;
  font-weight:900;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:#d9d9d9;
  opacity:1;
  text-align:left;
}

.shop-balance__row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.shop-balance__left{
  display:flex;
  align-items:center;
  gap:10px;
  color:#000;
  font-weight:800;
}

.shop-balance__left img{
  width:20px;
  height:auto;
}

.shop-balance__value{
  color:#000;
  font-weight:800;
  font-size:24px;
}

.shop-balance__actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:min(100%, 280px);
  margin:0 auto;
}

.shop-balance__actions--single{
  width:min(100%, 320px);
}

.shop-balance__hint{
  min-height: 0;
  font-size: 12px;
  line-height: 1.2;
  color: rgba(0,0,0,.55);
}

.shop-balance__hint:empty{
  display:none;
}

.shop-divider{
  width:100%;
  height:1px;
  background: rgba(0,0,0,.10);
  border-radius:1px;
  margin: 2px 0 6px;
}

/* ===== Shop: action buttons ===== */
.shop-withdraw,
.shop-exchange,
.shop-ton-wallet{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:1 1 0;
  min-width:0;
  height:36px;

  border:0;
  border-radius:999px;
  padding: 0 16px;

  font-weight:900;
  line-height:1;
  white-space:nowrap;

  background: var(--accent);
  color:#fff;
  box-shadow: 0 6px 12px rgba(0,0,0,.12);

  -webkit-appearance:none;
  appearance:none;
}

.shop-ton-wallet{
  background: var(--plam-green);
  box-shadow: 0 6px 14px rgba(20,174,92,.22);
}

.shop-withdraw:disabled,
.shop-withdraw.is-disabled,
.shop-withdraw[aria-disabled="true"],
.shop-exchange:disabled,
.shop-exchange.is-disabled,
.shop-exchange[aria-disabled="true"],
.shop-ton-wallet:disabled,
.shop-ton-wallet.is-disabled,
.shop-ton-wallet[aria-disabled="true"]{
  background:#D9D9D9 !important;
  color: rgba(0,0,0,.45) !important;
  -webkit-text-fill-color: rgba(0,0,0,.45); /* iOS/Telegram фикс */
  border: 1px solid rgba(0,0,0,.08);
  box-shadow:none !important;

  opacity: 1 !important;  /* важно: чтобы не “исчезала” и не превращалась в текст */
  filter:none !important;
  cursor:not-allowed;
}

.shop-ton-wallet-state{
  color:#000;
  font-size:14px;
  font-weight:800;
  line-height:1.25;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.modal[data-modal-kind="buy-stars"]{
  place-items:center;
  padding-top:var(--plam-modal-safe-top);
  padding-bottom:var(--plam-modal-safe-bottom);
  box-sizing:border-box;
}

.modal[data-modal-kind="buy-stars"] .modal__dialog{
  width:min(420px, calc(100vw - 24px));
  max-width:420px;
  max-height:calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 36px);
  padding:0;
  background:transparent;
  box-shadow:none;
  border-radius:var(--radius-card);
  overflow:visible;
  display:flex;
  flex-direction:column;
}

.modal[data-modal-kind="buy-stars"] .modal__content{
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  padding:0 0 8px;
  scrollbar-width:none;
}

.modal[data-modal-kind="buy-stars"] .modal__content::-webkit-scrollbar{
  width:0;
  height:0;
}

.modal[data-modal-kind="buy-stars"] .shop-popup{
  width:100%;
  max-width:420px;
  margin-inline:auto;
  display:grid;
  gap:12px;
  padding-bottom:8px;
}

.modal[data-modal-kind="buy-stars"] .shop-header{
  margin-top:0;
}

.modal[data-modal-kind="buy-stars"] > .modal__dialog > .modal__close{
  display:none !important;
}

@media (max-height:760px){
  .modal[data-modal-kind="buy-stars"]{
    padding-top:var(--plam-modal-safe-top);
  }

  .modal[data-modal-kind="buy-stars"] .modal__dialog{
    max-height:calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 36px);
  }
}

.shop-balance__value--ton{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  flex-wrap:nowrap;
  font-size:22px;
  line-height:1.1;
  text-align:center;
  white-space:nowrap;
}

.shop-balance__value-icon{
  width:22px;
  height:22px;
  align-self:center;
  flex:0 0 auto;
}

.shop-ton-equals{
  color:rgba(0,0,0,.45);
  font-weight:900;
}

.shop-ton-balance-icon{
  width:22px;
  height:22px;
  align-self:center;
  flex:0 0 auto;
}

/* ===== Shop exchange amount prompt ===== */
.shop-exchange-prompt-open{
  overflow: hidden;
}

.shop-exchange-prompt__backdrop{
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(0,0,0,.5);
}

.shop-exchange-prompt{
  width: min(360px, calc(100vw - 36px));
  border-radius: 16px;
  background: #fff;
  padding: 16px;
  box-sizing: border-box;
  box-shadow: 0 14px 30px rgba(0,0,0,.25);
  display: grid;
  gap: 12px;
}

.shop-exchange-prompt__title{
  margin: 0;
  text-align: center;
  color: #000;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 700;
}

.shop-exchange-prompt__input{
  width: 100%;
  height: 44px;
  box-sizing: border-box;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 12px;
  background: #fff;
  color: #000;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  padding: 0 12px;
  outline: none;
  appearance: textfield;
}

.shop-exchange-prompt__input:focus{
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(255,115,0,.2);
}

.shop-exchange-prompt__input::-webkit-outer-spin-button,
.shop-exchange-prompt__input::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

.shop-exchange-prompt__actions{
  display: flex;
  align-items: center;
  gap: 10px;
}

.shop-exchange-prompt__btn{
  flex: 1 1 0;
  min-width: 0;
  height: 38px;
  border: 0;
  border-radius: 999px;
  padding: 0 14px;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
}

.shop-exchange-prompt__btn--cancel{
  background: #D9D9D9;
  color: #222;
}

.shop-exchange-prompt__btn--confirm{
  background: var(--accent);
  color: #fff;
}

.shop-exchange-prompt__btn:disabled{
  background: #D9D9D9 !important;
  color: rgba(0,0,0,.45) !important;
  box-shadow: none !important;
}

/* FAQ: больше воздуха вокруг разделителей */
.faq-content hr{
  border: 0;
  height: 1px;
  background: rgba(0,0,0,.25); /* подстрой под свой цвет */
  margin: 14px 0;             /* ↑↓ воздух вокруг линии */
}

.faq-onboarding-btn{
  min-width: 220px;
  width:100%;
  height: 48px;
  font-size: 16px;
  margin: 12px 0 0;
}

/* ===== PLAM unified popup design system ===== */
html:not([data-theme]),
html[data-theme="dark"]{
  --plam-theme-name: dark;
  --plam-orange: #FF7300;
  --plam-orange-strong: #ff962b;
  --plam-green: #14AE5C;
  --plam-green-strong: #21ca70;
  --plam-text-main: #f4f8ff;
  --plam-text-muted: #9aaac4;
  --plam-text-soft: #6f82a1;
  --plam-shell-bg: linear-gradient(180deg, rgba(9, 22, 43, 0.96) 0%, rgba(4, 13, 28, 0.97) 100%);
  --plam-shell-border: rgba(150, 205, 255, 0.2);
  --plam-shell-shadow: 0 30px 60px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.03), 0 0 28px rgba(39,123,255,.12);
  --plam-card-bg: rgba(14, 28, 52, 0.86);
  --plam-card-bg-strong: rgba(8, 21, 41, 0.92);
  --plam-card-bg-soft: rgba(255,255,255,.06);
  --plam-card-border: rgba(151, 205, 255, 0.14);
  --plam-card-shadow: 0 14px 28px rgba(0,0,0,.2);
  --plam-field-bg: rgba(7, 20, 40, 0.9);
  --plam-field-border: rgba(165, 215, 255, 0.14);
  --plam-overlay-bg: rgba(3, 10, 21, 0.62);
  --plam-disabled-bg: rgba(132, 146, 168, 0.26);
  --plam-disabled-text: rgba(241, 244, 249, 0.42);
  --plam-close-bg: rgba(255,255,255,.08);
  --plam-close-fg: #ffffff;
  --plam-scene-glow: rgba(36, 143, 255, 0.12);
}

html[data-theme="light"]{
  --plam-theme-name: light;
  --plam-orange: #FF7300;
  --plam-orange-strong: #ff9a32;
  --plam-green: #14AE5C;
  --plam-green-strong: #1dc768;
  --plam-text-main: #141926;
  --plam-text-muted: #697282;
  --plam-text-soft: #8d95a3;
  --plam-shell-bg: linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(249,246,241,.98) 100%);
  --plam-shell-border: rgba(227, 217, 203, 0.95);
  --plam-shell-shadow: 0 20px 40px rgba(82,64,34,.12), 0 0 0 1px rgba(255,255,255,.75);
  --plam-card-bg: rgba(255,255,255,.96);
  --plam-card-bg-strong: rgba(255,255,255,.99);
  --plam-card-bg-soft: rgba(255,248,240,.74);
  --plam-card-border: rgba(230, 220, 208, 0.9);
  --plam-card-shadow: 0 10px 22px rgba(139,104,54,.1);
  --plam-field-bg: rgba(255,255,255,.98);
  --plam-field-border: rgba(227, 220, 208, .95);
  --plam-overlay-bg: rgba(246, 238, 226, 0.52);
  --plam-disabled-bg: rgba(220, 223, 228, 0.82);
  --plam-disabled-text: rgba(20, 25, 38, 0.35);
  --plam-close-bg: rgba(255,255,255,.86);
  --plam-close-fg: #222833;
  --plam-scene-glow: rgba(255, 167, 42, 0.08);
}

html[data-theme="light"] .scene{
  background-image:
    radial-gradient(circle at top left, rgba(255,214,150,.26), transparent 28%),
    radial-gradient(circle at top right, rgba(186,217,255,.24), transparent 24%),
    linear-gradient(180deg, #fffaf4 0%, #f7efdf 100%);
}

html[data-theme="light"] .scene::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 14% 12%, rgba(255,255,255,.95) 0 24px, transparent 25px),
    radial-gradient(circle at 18% 14%, rgba(255,255,255,.9) 0 18px, transparent 19px),
    radial-gradient(circle at 78% 14%, rgba(255,255,255,.95) 0 28px, transparent 29px),
    radial-gradient(circle at 84% 11%, rgba(255,255,255,.88) 0 18px, transparent 19px);
  opacity:.6;
  z-index:0;
}

.modal:not([data-modal-kind="tv-streams"]),
.modal--stack{
  place-items:center;
  padding:
    var(--plam-modal-safe-top)
    12px
    var(--plam-modal-safe-bottom);
  box-sizing:border-box;
}

.modal:not([data-modal-kind="tv-streams"]) .modal__backdrop,
.modal--stack .modal__backdrop,
#leadersModal .modal__backdrop{
  background: rgba(0,0,0,0);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  transition:
    background var(--plam-popup-open-ms, 220ms) ease,
    backdrop-filter var(--plam-popup-open-ms, 220ms) ease,
    -webkit-backdrop-filter var(--plam-popup-open-ms, 220ms) ease;
}

.modal.is-entering:not([data-modal-kind="tv-streams"]) .modal__backdrop,
.modal.is-open:not([data-modal-kind="tv-streams"]) .modal__backdrop,
.modal--stack.is-entering .modal__backdrop,
.modal--stack.is-open .modal__backdrop,
#leadersModal[aria-hidden="false"] .modal__backdrop{
  background: rgba(0,0,0,.5);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.modal.is-closing:not([data-modal-kind="tv-streams"]) .modal__backdrop,
.modal--stack.is-closing .modal__backdrop{
  background: rgba(0,0,0,0);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  transition-duration: var(--plam-popup-close-ms, 220ms);
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__dialog,
.modal--stack .modal__dialog{
  width:min(92vw, 432px);
  max-width:432px;
  max-height: calc(var(--app-h, 100dvh) - var(--safe-top) - var(--safe-bottom) - 24px);
  padding:18px;
  border-radius:34px;
  background: var(--plam-shell-bg);
  border:1px solid var(--plam-shell-border);
  box-shadow: var(--plam-shell-shadow);
  backdrop-filter: blur(12px) saturate(1.08);
  -webkit-backdrop-filter: blur(12px) saturate(1.08);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  opacity:0;
  transform:translateY(12px) scale(.98);
  transition:
    opacity var(--plam-popup-open-ms, 220ms) ease,
    transform 260ms cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}

.modal.is-entering:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__dialog,
.modal.is-open:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__dialog,
.modal--stack.is-entering .modal__dialog,
.modal--stack.is-open .modal__dialog{
  opacity:1;
  transform:translateY(0) scale(1);
}

.modal.is-closing:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__dialog,
.modal--stack.is-closing .modal__dialog{
  opacity:0;
  transform:translateY(8px) scale(.985);
  transition:
    opacity var(--plam-popup-close-ms, 220ms) ease,
    transform 260ms cubic-bezier(.22,.61,.36,1);
}

@media (prefers-reduced-motion: reduce){
  .modal:not([data-modal-kind="tv-streams"]) .modal__backdrop,
  .modal--stack .modal__backdrop,
  .modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__dialog,
  .modal--stack .modal__dialog{
    transition:none !important;
  }
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__content,
.modal--stack .modal__content{
  flex:1 1 auto;
  min-height:0;
  max-height:none;
  overflow-x:hidden;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__content::-webkit-scrollbar,
.modal--stack .modal__content::-webkit-scrollbar{
  width:0;
  height:0;
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__close,
.modal--stack .modal__close,
.shop-top-close,
#leadersModal .lb-top-close,
#leadersModal .lb-modal-close{
  width:44px;
  height:44px;
  top:16px;
  right:16px;
  border-radius:50%;
  background: var(--plam-close-bg);
  border:1px solid rgba(255,255,255,.08);
  box-shadow: 0 10px 18px rgba(0,0,0,.16);
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__close::before,
.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__close::after,
.modal--stack .modal__close::before,
.modal--stack .modal__close::after,
.shop-top-close::before,
.shop-top-close::after,
#leadersModal .lb-top-close::before,
#leadersModal .lb-top-close::after,
#leadersModal .lb-modal-close::before,
#leadersModal .lb-modal-close::after{
  width:14px;
  height:2.5px;
  background: var(--plam-close-fg);
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .popup,
.modal--stack .popup,
#leadersModal .leaderboard-popup{
  color: var(--plam-text-main);
}

.modal :is(.chip, .card, .picked-box, .promo-form, .faq-intro, .faq-accordion__item, .faq-utility-card, .faq-docs-block, .policy-body, .profile-account-box, .profile-account-card, .shop-balance, .shop-item, .fortune-settings-box),
.modal--stack :is(.chip, .card, .picked-box, .promo-form, .faq-intro, .faq-accordion__item, .faq-utility-card, .faq-docs-block, .policy-body, .profile-account-box, .profile-account-card, .shop-balance, .shop-item, .fortune-settings-box){
  background: var(--plam-card-bg);
  border:1px solid var(--plam-card-border);
  box-shadow: var(--plam-card-shadow);
  color: var(--plam-text-main);
}

.modal :is(.field, .profile-account-input, .promo-input, .shop-exchange-prompt__input, .streams-chat-input),
.modal--stack :is(.field, .profile-account-input, .promo-input, .shop-exchange-prompt__input, .streams-chat-input){
  background: var(--plam-field-bg);
  border:1px solid var(--plam-field-border);
  border-radius:22px;
  color: var(--plam-text-main);
  box-shadow:none;
}

.modal :is(.field, .profile-account-input, .promo-input, .shop-exchange-prompt__input)::placeholder,
.modal--stack :is(.field, .profile-account-input, .promo-input, .shop-exchange-prompt__input)::placeholder{
  color: var(--plam-text-soft);
}

.modal :is(.btn, .btn-pay, .btn-confirm, .btn-close-timer, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet, .faq-action-btn, .faq-onboarding-btn),
.modal--stack :is(.btn, .btn-pay, .btn-confirm, .btn-close-timer, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet, .faq-action-btn, .faq-onboarding-btn){
  min-height:56px;
  border-radius:999px;
  border:0;
  font-weight:800;
  letter-spacing:.01em;
  box-shadow: 0 10px 22px rgba(0,0,0,.14);
}

.modal :is(.btn-primary, .btn-accent, .btn-submit, .profile-account-btn--change, .btn-pay:not(.btn-pay--green):not([disabled]), .shop-exchange, .faq-action-btn),
.modal--stack :is(.btn-primary, .btn-accent, .btn-submit, .profile-account-btn--change, .btn-pay:not(.btn-pay--green):not([disabled]), .shop-exchange, .faq-action-btn){
  background: linear-gradient(180deg, var(--plam-orange-strong) 0%, var(--plam-orange) 100%);
  color:#fff;
}

.modal :is(.btn-pay--green, .profile-account-btn--save, .shop-withdraw, .shop-ton-wallet, .btn-premium, .btn-confirm.yes, .faq-onboarding-btn),
.modal--stack :is(.btn-pay--green, .profile-account-btn--save, .shop-withdraw, .shop-ton-wallet, .btn-premium, .btn-confirm.yes, .faq-onboarding-btn){
  background: linear-gradient(180deg, var(--plam-green-strong) 0%, var(--plam-green) 100%);
  color:#fff;
}

.modal :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet):disabled,
.modal :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet)[aria-disabled="true"],
.modal--stack :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet):disabled,
.modal--stack :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet)[aria-disabled="true"]{
  background: var(--plam-disabled-bg) !important;
  color: var(--plam-disabled-text) !important;
  border:1px solid rgba(255,255,255,.04);
  box-shadow:none !important;
  opacity:1 !important;
}

.modal :is(.label, .hint, .shop-balance__label, .shop-balance__hint, .promo-hint, .pay-note, .policy-check span, .profile-lang-title, .profile-account-corner, .lb-sub, .faq-block-title, .faq-note),
.modal--stack :is(.label, .hint, .shop-balance__label, .shop-balance__hint, .promo-hint, .pay-note, .policy-check span, .profile-lang-title, .profile-account-corner, .lb-sub, .faq-block-title, .faq-note){
  color: var(--plam-text-muted);
}

.modal :is(h2, h3, .modal__title, .shop-title, .faq-title, .lb-title, .pc-title),
.modal--stack :is(h2, h3, .modal__title, .shop-title, .faq-title, .lb-title, .pc-title){
  color: var(--plam-text-main);
}

.upload-popup{
  display:grid;
  gap:16px;
}

.pick-wrap,
.picked-box,
.slider-card,
.form-card{
  border-radius:26px;
}

.btn-pick{
  min-height:62px;
  border-radius:22px;
  background: var(--plam-card-bg-strong);
  border:1px solid var(--plam-card-border);
  color: var(--plam-text-main);
  font-size:18px;
  font-weight:700;
  box-shadow: var(--plam-card-shadow);
}

.btn-info{
  background: var(--plam-card-bg-strong);
  color: var(--plam-orange);
  border:1px solid var(--plam-card-border);
  box-shadow: var(--plam-card-shadow);
}

.picked-empty,
.form-note,
.field-counter{
  color: var(--plam-text-muted);
}

.picked-item img{
  border-radius:20px;
}

.picked-remove{
  background: rgba(0,0,0,.54);
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
}

.slider-card{
  padding:18px 18px 16px;
}

.slider-title{
  color: var(--plam-text-main);
  font-weight:700;
}

.range{
  accent-color: var(--plam-orange);
}

.profile-popup{
  display:grid;
  gap:14px;
}

.profile-header{
  background: transparent;
  border:0;
  box-shadow:none;
  padding:8px 8px 2px;
}

.profile-header .avatar{
  box-shadow: 0 0 0 2px rgba(255,255,255,.1), 0 12px 28px rgba(0,0,0,.26), 0 0 26px var(--plam-scene-glow);
}

.profile-header .profile-id{
  background: var(--plam-card-bg);
  border:1px solid var(--plam-card-border);
  color: var(--plam-text-main);
  box-shadow: var(--plam-card-shadow);
}

.profile-header .btn-premium{
  min-height:54px;
  padding:0 22px;
  border-radius:22px;
  background: linear-gradient(180deg, var(--plam-green-strong) 0%, var(--plam-green) 100%);
  color:#fff;
  box-shadow: 0 10px 22px rgba(20,174,92,.24);
}

.profile-header .btn-premium::after{
  width:46px;
  height:46px;
  background: var(--plam-card-bg-strong);
  border:1px solid var(--plam-card-border);
  color: var(--plam-text-main);
  box-shadow: var(--plam-card-shadow);
}

.profile-card{
  padding:16px 18px;
  border-radius:24px;
}

.profile-card .label-left,
.profile-card .val-right{
  color: var(--plam-text-main);
}

.pill{
  border-radius:999px;
  box-shadow: 0 8px 16px rgba(0,0,0,.14);
}

.profile-account-card{
  padding:18px;
  border-radius:28px;
}

.profile-account-box{
  border-radius:24px;
}

.profile-account-corner{
  color: var(--plam-text-muted);
}

.profile-chat-color-panel{
  border-radius:24px;
  background: var(--plam-card-bg-soft);
  border:1px solid var(--plam-card-border);
}

.profile-chat-color-swatch{
  box-shadow:none;
}

.profile-chat-color-swatch.is-active,
.profile-chat-color-custom__button{
  box-shadow: 0 0 0 2px rgba(255,255,255,.12), 0 0 0 5px rgba(255,115,0,.14);
}

.profile-account-actions{
  gap:12px;
}

.prizes-popup{
  display:grid;
  gap:16px;
}

.promo-form{
  padding:14px;
  border-radius:26px;
}

.promo-row{
  gap:12px;
}

.promo-input{
  min-height:54px;
}

.prize-grid{
  gap:12px;
}

.pay-note{
  line-height:1.45;
}

.shop-popup{
  display:grid;
  gap:14px;
}

.shop-header,
.shop-balance,
.shop-item{
  border-radius:28px;
}

.shop-header{
  padding:18px 18px 16px;
  background: var(--plam-card-bg-strong);
}

.shop-title{
  font-size: clamp(24px, 5vw, 32px);
  font-weight:800;
}

.shop-tabs,
.lb-tabs,
.fortune-task-tabs{
  border-radius:999px;
  background: var(--plam-card-bg-soft);
  border:1px solid var(--plam-card-border);
}

.shop-tab,
.lb-tab{
  color: var(--plam-text-muted);
  transition:
    background-color .16s ease,
    color .16s ease,
    box-shadow .16s ease,
    transform .16s ease,
    filter .16s ease;
  transform: scale(.985);
}

.shop-tab.is-active,
.lb-tab.is-active{
  background: linear-gradient(180deg, var(--plam-orange-strong) 0%, var(--plam-orange) 100%);
  color:#fff;
  transform: translateY(-1px) scale(1);
}

#leadersModal .lb-tab{
  transition: none !important;
  transform: none !important;
  filter: none !important;
}

#leadersModal .lb-tab.is-active{
  transform: none !important;
}

.shop-balance{
  padding:16px 16px 14px;
  border:1px solid rgba(255,115,0,.38);
  box-shadow: 0 0 0 1px rgba(255,115,0,.08), var(--plam-card-shadow);
}

.shop-balance__label{
  letter-spacing:.08em;
}

.shop-item{
  min-height:44px;
  background: var(--plam-card-bg);
}

.shop-item__left,
.shop-item__right,
.shop-num,
.shop-balance__value{
  color: var(--plam-text-main);
}

.shop-balance__hint,
.shop-ton-wallet-state{
  color: var(--plam-text-muted);
}

.faq-popup{
  width:100%;
}

.faq-card{
  padding:18px;
  border-radius:30px;
  gap:12px;
  background: transparent;
}

.faq-title{
  font-size: clamp(26px, 5vw, 34px);
  letter-spacing:.01em;
}

.faq-scroll{
  padding-right:2px;
}

.faq-intro{
  border-radius:24px;
  padding:18px;
}

.faq-intro__title{
  font-size: clamp(20px, 4.8vw, 28px);
}

.faq-intro__text,
.faq-accordion__panel,
.faq-note{
  color: var(--plam-text-muted);
}

.faq-steps{
  gap:10px;
}

.faq-step{
  border-radius:20px;
  background: var(--plam-card-bg-soft);
  border:1px solid var(--plam-card-border);
  color: var(--plam-text-main);
}

.faq-accordion__summary{
  color: var(--plam-text-main);
}

.faq-accordion__chevron{
  background: var(--plam-card-bg-soft);
  border:1px solid var(--plam-card-border);
}

.faq-docs__link{
  background: var(--plam-card-bg-soft);
  border-color: var(--plam-card-border);
  color: var(--plam-text-main);
}

.policy-popup{
  display:grid;
  gap:14px;
}

.policy-popup,
.policy-popup .modal__title,
.policy-popup .policy-body,
.policy-popup .policy-body p,
.policy-popup .policy-body li,
.policy-popup .policy-check span,
.policy-popup a{
  color: var(--plam-text-main);
}

.policy-body{
  border-radius:24px;
  line-height:1.55;
}

.policy-check{
  color: var(--plam-text-muted);
}

.timer-card,
.confirm-card,
.premium-compare,
.subs-card,
.reset-popup,
.help-popup .premium-compare{
  border-radius:28px;
  padding:18px;
}

#leadersModal{
  padding:
    var(--plam-modal-safe-top)
    12px
    var(--plam-modal-safe-bottom);
}

#leadersModal .modal__dialog{
  width:min(92vw, 432px);
  max-width:432px;
  margin-top:0;
}

#leadersModal .leaderboard-popup{
  gap:12px;
}

#leadersModal .lb-header{
  background: var(--plam-shell-bg);
  border:1px solid var(--plam-shell-border);
  box-shadow: var(--plam-shell-shadow);
  border-radius:32px;
  padding:16px 14px 12px;
}

#leadersModal .lb-title,
#leadersModal .lb-sub{
  color: var(--plam-text-main);
}

#leadersModal .lb-sub{
  color: var(--plam-text-muted);
}

#leadersModal .lb-list.card{
  background: var(--plam-card-bg-strong);
  border:1px solid var(--plam-card-border);
  box-shadow: var(--plam-card-shadow);
  border-radius:24px;
  max-height:min(390px, calc(100dvh - env(safe-area-inset-top, 0px) - 420px));
}

#leadersModal .lb-item{
  min-height:56px;
  padding:10px 14px;
  background: transparent;
  color: var(--plam-text-main);
  border-bottom:1px solid rgba(255,255,255,.06);
}

#leadersModal .lb-item:last-child{
  border-bottom:0;
}

#leadersModal .lb-item--me{
  background: linear-gradient(180deg, rgba(20,174,92,.96) 0%, rgba(10,148,76,.98) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

#leadersModal .lb-nick,
#leadersModal .lb-photos,
#leadersModal .lb-rank{
  color: inherit;
}

html[data-theme="light"] .modal :is(.chip, .card, .picked-box, .promo-form, .faq-intro, .faq-accordion__item, .faq-utility-card, .faq-docs-block, .policy-body, .profile-account-box, .profile-account-card, .shop-balance, .shop-item),
html[data-theme="light"] .modal--stack :is(.chip, .card, .picked-box, .promo-form, .faq-intro, .faq-accordion__item, .faq-utility-card, .faq-docs-block, .policy-body, .profile-account-box, .profile-account-card, .shop-balance, .shop-item){
  box-shadow: 0 10px 24px rgba(132, 98, 57, .1);
}

html[data-theme="light"] #leadersModal .lb-item{
  border-bottom:1px solid rgba(20,25,38,.06);
}

@media (max-width:390px){
  .modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__dialog,
  .modal--stack .modal__dialog{
    padding:16px;
    border-radius:30px;
  }

  .modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__close,
  .modal--stack .modal__close,
  .shop-top-close,
  #leadersModal .lb-top-close{
    width:40px;
    height:40px;
    top:14px;
    right:14px;
  }

  .shop-title,
  .faq-title{
    font-size:22px;
  }

  .faq-card{
    padding:16px;
  }
}







/* ====== DEBUG (включай <body class="__debug">) ====== 
body.__debug .hotspot{outline:2px dashed rgba(0,200,255,.9); background:rgba(0,200,255,.10)} */

/* ===== PLAM popup bugfix pass ===== */
html:not([data-theme]),
html[data-theme="dark"]{
  --plam-text: #F5F7FF;
  --plam-text-soft: #D7E0F2;
  --plam-text-muted: #9EABC4;
  --plam-text-disabled: #69758C;
  --plam-text-main: #F5F7FF;
  --plam-shell-solid: #08162b;
  --plam-shell-header-bg: linear-gradient(180deg, #09162b 0%, #040d1c 100%);
}

html[data-theme="light"]{
  --plam-text: #141926;
  --plam-text-soft: #495365;
  --plam-text-muted: #697282;
  --plam-text-disabled: #9CA7B7;
  --plam-shell-solid: #fbf6ef;
  --plam-shell-header-bg: linear-gradient(180deg, #ffffff 0%, #f9f6f1 100%);
}


.modal[data-modal-kind="profile"],
.modal[data-modal-kind="prizes"],
.modal[data-modal-kind="upload-popup"],
.modal--stack.stack--profile-account,
.modal--stack:has(.profile-account-popup),
.modal--stack:has(.profile-password-popup),
.modal--stack:has(.help-popup),
.modal--stack:has(.policy-popup){
  place-items:center;
}

.modal[data-modal-kind="profile"] .modal__dialog,
.modal[data-modal-kind="prizes"] .modal__dialog,
.modal[data-modal-kind="upload-popup"] .modal__dialog,
.modal--stack.stack--profile-account .modal__dialog,
.modal--stack:has(.profile-account-popup) .modal__dialog,
.modal--stack:has(.profile-password-popup) .modal__dialog,
.modal--stack:has(.help-popup) .modal__dialog,
.modal--stack:has(.policy-popup) .modal__dialog{
  align-self:center;
}

.modal[data-modal-kind="profile"] .modal__content,
.modal[data-modal-kind="prizes"] .modal__content,
.modal[data-modal-kind="upload-popup"] .modal__content,
.modal--stack.stack--profile-account .modal__content,
.modal--stack:has(.profile-account-popup) .modal__content,
.modal--stack:has(.profile-password-popup) .modal__content,
.modal--stack:has(.help-popup) .modal__content,
.modal--stack:has(.policy-popup) .modal__content{
  padding-top:4px;
}

.modal[data-modal-kind="profile"] .profile-popup,
.modal[data-modal-kind="prizes"] .prizes-popup,
.modal[data-modal-kind="upload-popup"] .upload-popup,
.modal--stack.stack--profile-account .profile-account-popup,
.modal--stack:has(.profile-account-popup) .profile-account-popup,
.modal--stack:has(.profile-password-popup) .profile-password-popup,
.modal--stack:has(.help-popup) .help-popup,
.modal--stack:has(.policy-popup) .policy-popup{
  padding-top:10px;
}

.modal[data-modal-kind="faq"]{
  top:0;
  bottom:auto;
  height:var(--app-h, 100dvh);
  min-height:0;
  place-items:start center !important;
  padding-top:var(--faq-modal-safe-top) !important;
  padding-bottom:var(--faq-modal-safe-bottom) !important;
}

.modal--stack:has(.help-popup),
.modal--stack:has(.policy-popup),
.modal--stack:has(.profile-password-popup){
  place-items:center !important;
  padding-top:var(--plam-modal-safe-top) !important;
  padding-bottom:var(--plam-modal-safe-bottom) !important;
}

.modal[data-modal-kind="faq"] .modal__dialog,
.modal__dialog:has(.faq-popup){
  align-self:start !important;
  height:calc(var(--app-h, 100dvh) - var(--faq-modal-safe-top) - var(--faq-modal-safe-bottom)) !important;
  max-height:calc(var(--app-h, 100dvh) - var(--faq-modal-safe-top) - var(--faq-modal-safe-bottom)) !important;
}

html.is-android-webapp .modal[data-modal-kind="faq"] .modal__dialog,
html.is-android-webapp .modal__dialog:has(.faq-popup){
  height:calc(var(--app-h, 100dvh) - var(--faq-modal-safe-top) - 24px) !important;
  max-height:calc(var(--app-h, 100dvh) - var(--faq-modal-safe-top) - 24px) !important;
}

.modal[data-modal-kind="faq"] .modal__content,
.modal__dialog:has(.faq-popup) .modal__content,
.modal[data-modal-kind="faq"] .faq-popup,
.modal__dialog:has(.faq-popup) .faq-popup,
.modal[data-modal-kind="faq"] .faq-card,
.modal__dialog:has(.faq-popup) .faq-card{
  min-height:0 !important;
  height:100%;
}

.modal--stack:has(.help-popup) .modal__dialog,
.modal__dialog:has(.help-popup),
.modal--stack:has(.policy-popup) .modal__dialog,
.modal__dialog:has(.policy-popup),
.modal--stack:has(.profile-password-popup) .modal__dialog,
.modal__dialog:has(.profile-password-popup){
  align-self:center !important;
  max-height:calc(var(--app-h, 100dvh) - var(--plam-modal-safe-top) - var(--plam-modal-safe-bottom)) !important;
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__close,
.modal--stack .modal__close,
.shop-top-close,
#leadersModal .lb-top-close,
#leadersModal .lb-modal-close{
  z-index:60;
  pointer-events:auto;
  touch-action:manipulation;
}

html:not([data-theme]) .modal :is(.popup, .popup *),
html:not([data-theme]) .modal--stack :is(.popup, .popup *),
html[data-theme="dark"] .modal :is(.popup, .popup *),
html[data-theme="dark"] .modal--stack :is(.popup, .popup *){
  border-color: rgba(151, 205, 255, 0.14);
}

html:not([data-theme]) .modal :is(.popup, .popup *):not(input):not(textarea):not(button):not(.pill):not(.shop-ton-symbol):not(img),
html:not([data-theme]) .modal--stack :is(.popup, .popup *):not(input):not(textarea):not(button):not(.pill):not(.shop-ton-symbol):not(img),
html[data-theme="dark"] .modal :is(.popup, .popup *):not(input):not(textarea):not(button):not(.pill):not(.shop-ton-symbol):not(img),
html[data-theme="dark"] .modal--stack :is(.popup, .popup *):not(input):not(textarea):not(button):not(.pill):not(.shop-ton-symbol):not(img){
  color: inherit;
}

html:not([data-theme]) .modal :is(.popup, .popup *),
html:not([data-theme]) .modal--stack :is(.popup, .popup *),
html[data-theme="dark"] .modal :is(.popup, .popup *),
html[data-theme="dark"] .modal--stack :is(.popup, .popup *){
  color: var(--plam-text);
}

html:not([data-theme]) .modal :is(.hint, .form-note, .field-counter, .picked-empty, .profile-account-corner, .profile-account-popup .profile-account-box > .profile-account-corner, .profile-password-popup .profile-account-box > .profile-account-corner, .promo-hint, .pay-note, .policy-check, .policy-check span, .policy-body p, .policy-body li, .faq-block-title, .faq-intro__text, .faq-accordion__panel, .faq-note, .faq-utility-card p, .shop-balance__label, .shop-balance__hint, .shop-ton-wallet-state, .pc-note, .pc-name, .pc-head, .pc-val, .label, .lb-sub),
html:not([data-theme]) .modal--stack :is(.hint, .form-note, .field-counter, .picked-empty, .profile-account-corner, .profile-account-popup .profile-account-box > .profile-account-corner, .profile-password-popup .profile-account-box > .profile-account-corner, .promo-hint, .pay-note, .policy-check, .policy-check span, .policy-body p, .policy-body li, .faq-block-title, .faq-intro__text, .faq-accordion__panel, .faq-note, .faq-utility-card p, .shop-balance__label, .shop-balance__hint, .shop-ton-wallet-state, .pc-note, .pc-name, .pc-head, .pc-val, .label, .lb-sub),
html[data-theme="dark"] .modal :is(.hint, .form-note, .field-counter, .picked-empty, .profile-account-corner, .profile-account-popup .profile-account-box > .profile-account-corner, .profile-password-popup .profile-account-box > .profile-account-corner, .promo-hint, .pay-note, .policy-check, .policy-check span, .policy-body p, .policy-body li, .faq-block-title, .faq-intro__text, .faq-accordion__panel, .faq-note, .faq-utility-card p, .shop-balance__label, .shop-balance__hint, .shop-ton-wallet-state, .pc-note, .pc-name, .pc-head, .pc-val, .label, .lb-sub),
html[data-theme="dark"] .modal--stack :is(.hint, .form-note, .field-counter, .picked-empty, .profile-account-corner, .profile-account-popup .profile-account-box > .profile-account-corner, .profile-password-popup .profile-account-box > .profile-account-corner, .promo-hint, .pay-note, .policy-check, .policy-check span, .policy-body p, .policy-body li, .faq-block-title, .faq-intro__text, .faq-accordion__panel, .faq-note, .faq-utility-card p, .shop-balance__label, .shop-balance__hint, .shop-ton-wallet-state, .pc-note, .pc-name, .pc-head, .pc-val, .label, .lb-sub){
  color: var(--plam-text-muted) !important;
}

html:not([data-theme]) .modal :is(input, textarea),
html:not([data-theme]) .modal--stack :is(input, textarea),
html[data-theme="dark"] .modal :is(input, textarea),
html[data-theme="dark"] .modal--stack :is(input, textarea){
  color: var(--plam-text) !important;
}

html:not([data-theme]) .modal :is(input, textarea)::placeholder,
html:not([data-theme]) .modal--stack :is(input, textarea)::placeholder,
html[data-theme="dark"] .modal :is(input, textarea)::placeholder,
html[data-theme="dark"] .modal--stack :is(input, textarea)::placeholder{
  color: var(--plam-text-muted) !important;
  opacity: 1;
}

html:not([data-theme]) .modal :is(.password-toggle, .shop-ton-equals),
html:not([data-theme]) .modal--stack :is(.password-toggle, .shop-ton-equals),
html[data-theme="dark"] .modal :is(.password-toggle, .shop-ton-equals),
html[data-theme="dark"] .modal--stack :is(.password-toggle, .shop-ton-equals){
  color: var(--plam-text-soft) !important;
}

html:not([data-theme]) .modal :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet):disabled,
html:not([data-theme]) .modal :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet)[aria-disabled="true"],
html:not([data-theme]) .modal--stack :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet):disabled,
html:not([data-theme]) .modal--stack :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet)[aria-disabled="true"],
html[data-theme="dark"] .modal :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet):disabled,
html[data-theme="dark"] .modal :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet)[aria-disabled="true"],
html[data-theme="dark"] .modal--stack :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet):disabled,
html[data-theme="dark"] .modal--stack :is(.btn, .btn-pay, .btn-confirm, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet)[aria-disabled="true"]{
  color: var(--plam-text-disabled) !important;
}

html:not([data-theme]) .shop-popup .shop-balance__actions :is(.shop-exchange, .shop-withdraw):disabled,
html:not([data-theme]) .shop-popup .shop-balance__actions :is(.shop-exchange, .shop-withdraw)[aria-disabled="true"],
html[data-theme="dark"] .shop-popup .shop-balance__actions :is(.shop-exchange, .shop-withdraw):disabled,
html[data-theme="dark"] .shop-popup .shop-balance__actions :is(.shop-exchange, .shop-withdraw)[aria-disabled="true"]{
  color: var(--plam-text-muted) !important;
}

.profile-header{
  padding-top:52px;
  padding-right:60px;
  overflow:visible;
}

.profile-popup{
  width:100%;
  max-width:420px;
  min-height:min(690px, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 140px));
}

html:not([data-theme]) .profile-card .label-left,
html:not([data-theme]) .profile-card .val-right,
html:not([data-theme]) .profile-header .profile-id,
html[data-theme="dark"] .profile-card .label-left,
html[data-theme="dark"] .profile-card .val-right,
html[data-theme="dark"] .profile-header .profile-id{
  color: var(--plam-text) !important;
}

.profile-account-card,
.profile-password-popup .profile-account-card,
.help-popup .premium-compare{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 6px 0 0 !important;
}

.profile-account-popup .profile-account-box,
.profile-password-popup .profile-account-box{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.profile-account-popup .profile-account-row{
  gap:8px;
}

.profile-account-popup .profile-account-input,
.profile-password-popup .profile-account-input{
  background: var(--plam-card-bg-soft) !important;
  box-shadow: inset 0 0 0 1px var(--plam-card-border) !important;
  color: var(--plam-text) !important;
}

.profile-chat-color-panel{
  background: var(--plam-card-bg-soft) !important;
  border: 1px solid var(--plam-card-border) !important;
}

.profile-theme-switch{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  padding:4px;
  border-radius:999px;
  background: var(--plam-card-bg-soft);
  border: 1px solid var(--plam-card-border);
}

.profile-theme-switch__btn{
  min-height:54px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--plam-text-muted);
  font-size:15px;
  font-weight:800;
  line-height:1.15;
  transition:
    background-color .16s ease,
    color .16s ease,
    box-shadow .16s ease,
    transform .16s ease,
    filter .16s ease;
  transform: scale(.985);
}

.profile-theme-switch__btn.is-active{
  background: linear-gradient(180deg, var(--plam-orange-strong) 0%, var(--plam-orange) 100%);
  color:#fff;
  box-shadow:0 10px 18px rgba(255,115,0,.18);
  transform: translateY(-1px) scale(1);
}

.profile-account-popup .profile-account-actions .profile-account-btn--change{
  background: rgba(126,141,164,.26);
  color: var(--plam-text);
  box-shadow:none;
}

.premium-compare .pc-table{
  grid-template-columns:minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr) !important;
  gap:8px 10px !important;
}

.premium-compare .pc-name,
.premium-compare .pc-head,
.premium-compare .pc-val{
  min-width:0;
  word-break:break-word;
}

.premium-compare .pc-name{
  font-size:clamp(13px, 3.5vw, 15px);
}

.premium-compare .pc-head,
.premium-compare .pc-val{
  font-size:clamp(12px, 3.2vw, 14px);
}

.premium-compare .pc-note{
  color:var(--plam-text-muted) !important;
}

.promo-form{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.promo-row{
  align-items:center;
}

.upload-popup .pick-wrap{
  width:min(100%, 360px);
}

.upload-popup .picked-box{
  display:grid;
  justify-items:center;
  gap:10px;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.picked-empty{
  width:auto !important;
  max-width:100%;
  display:inline-block !important;
  padding:0;
  border-radius:0;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  outline:0 !important;
  color:var(--plam-text-muted) !important;
}

.picked-empty[hidden]{
  display:none !important;
}

.faq-card{
  width:100%;
  max-width:none;
  max-height:none;
  padding:0;
  gap:14px;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.faq-content{
  gap:12px;
  padding:0 0 10px;
}

.faq-intro{
  padding:18px;
  background:var(--plam-card-bg-strong) !important;
  border:1px solid var(--plam-card-border) !important;
}

.faq-intro__title{
  color:var(--plam-text) !important;
  text-align:left;
}

.faq-intro__text{
  padding:0;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:var(--plam-text-soft) !important;
}

.faq-step{
  min-height:64px;
  background:var(--plam-card-bg-soft) !important;
  border:1px solid var(--plam-card-border) !important;
  box-shadow:none !important;
  color:var(--plam-text) !important;
}

.faq-accordion{
  display:grid;
  gap:10px;
}

.faq-accordion__item{
  background:var(--plam-card-bg) !important;
  border:1px solid var(--plam-card-border) !important;
}

.faq-accordion__summary{
  padding:18px 60px 18px 18px;
  color:var(--plam-text) !important;
}

.faq-accordion__summary-text{
  color:var(--plam-text) !important;
}

.faq-accordion__chevron{
  background:var(--plam-card-bg-soft) !important;
}

.faq-accordion__panel{
  padding:10px 18px 16px;
  color:var(--plam-text-soft) !important;
  background:transparent !important;
}

.faq-note{
  background:rgba(255,115,0,.12) !important;
  color:var(--plam-text-soft) !important;
}

.faq-utility-card{
  background:var(--plam-card-bg) !important;
  border:1px solid var(--plam-card-border) !important;
}

.faq-utility-card__title{
  color:var(--plam-text) !important;
}

.faq-docs-block{
  display:contents;
}

.faq-accordion__item--docs{
  box-shadow:var(--plam-card-shadow) !important;
}

.faq-docs__link{
  background:var(--plam-card-bg-soft) !important;
  color:var(--plam-text) !important;
  border:1px solid var(--plam-card-border) !important;
}

.policy-popup .policy-body{
  background:var(--plam-card-bg-soft) !important;
  border:1px solid var(--plam-card-border) !important;
  line-height:1.42;
}

.shop-ton-equals{
  color:var(--plam-text-muted) !important;
}

.shop-item,
.shop-item__left,
.shop-item__right,
.shop-num,
.shop-balance__value,
.shop-balance__value span{
  color:inherit;
}

html:not([data-theme]) .shop-popup :is(.shop-title, .shop-balance__value, .shop-num, .shop-item__left, .shop-item__right),
html[data-theme="dark"] .shop-popup :is(.shop-title, .shop-balance__value, .shop-num, .shop-item__left, .shop-item__right){
  color:var(--plam-text) !important;
}

.shop-popup .shop-title{
  letter-spacing:0;
}

.shop-popup .shop-balance__actions :is(.shop-exchange, .shop-withdraw, .shop-ton-wallet){
  min-height:48px;
  padding-top:0;
  padding-bottom:0;
  font-size:15px;
}

.shop-popup .shop-balance{
  padding-bottom:12px;
}

@media (max-width:390px){
  .profile-theme-switch{
    gap:8px;
  }

  .profile-theme-switch__btn{
    min-height:50px;
    font-size:14px;
  }

  .premium-compare .pc-table{
    gap:7px 8px !important;
  }

  .faq-accordion__summary{
    padding:16px 56px 16px 16px;
  }
}

/* ===== PLAM targeted layout fixes ===== */
html[data-theme="light"] .scene{
  background-color: var(--sky);
  background-image: url("./bgicons/bg-master.png?v=4");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 100%;
}

html[data-theme="light"] .scene::after{
  content: none;
}

.modal:not(#leadersModal):not([data-modal-kind="tv-streams"]) .modal__content,
.modal--stack .modal__content{
  padding-top: 52px;
}

.modal--stack:has(.profile-account-popup) .modal__content{
  padding-top: 0 !important;
}

.modal--stack:has(.profile-account-popup){
  padding-top: calc(env(safe-area-inset-top, 0px) + 8px);
}

.modal--stack:has(.profile-account-popup) .modal__dialog{
  padding: 8px 18px 18px !important;
}

.chip.profile-header{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.modal[data-modal-kind="profile"] .profile-popup{
  padding-top: 0;
}

.modal[data-modal-kind="profile"] .modal__content,
.modal[data-modal-kind="buy-stars"] .modal__content{
  padding-top: 0 !important;
}

.modal[data-modal-kind="profile"] > .modal__dialog > .modal__close{
  display: flex !important;
  top: 14px;
  right: 16px;
}

.profile-header{
  padding: 54px 60px 8px 14px;
  overflow: visible;
  position: sticky;
  top: -18px;
  z-index: 6;
  background: var(--plam-shell-header-bg) !important;
  margin-bottom: -8px;
  margin-inline: -18px;
  padding-inline-start: 18px;
  padding-inline-end: 60px;
  border-radius: 34px 34px 0 0;
}

.profile-popup{
  gap: 14px !important;
  min-height: min(710px, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 130px));
}

.modal--stack:has(.profile-account-popup) .modal__close{
  display: none;
}

.profile-account-popup .profile-account-box{
  gap: 10px;
}

.profile-account-popup .profile-account-box > .profile-account-corner{
  order: 1;
  margin-bottom: 2px;
}

.profile-account-popup .profile-theme-switch{
  order: 2;
}

.modal--stack:has(.confirm-popup){
  place-items: center;
}

.modal--stack:has(.confirm-popup) .modal__dialog{
  align-self: center;
}

.modal--stack:has(.confirm-popup) .modal__content{
  padding-top: 8px;
}

.modal--stack:has(.confirm-popup) .confirm-popup{
  padding-top: 0;
}

.modal--stack:has(.confirm-popup) .modal__close,
.modal__dialog:has(.confirm-popup) .modal__close{
  display: none !important;
}

.modal--stack:has(.confirm-popup) .confirm-card,
.modal--stack:has(.confirm-popup) .chip.confirm-card{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.modal--stack:has(.confirm-popup) .btn-confirm,
.modal__dialog:has(.confirm-popup) .btn-confirm{
  box-shadow: none !important;
}

.modal--stack:has(.timer-popup){
  place-items: center;
}

.modal--stack:has(.timer-popup) .modal__dialog{
  align-self: center;
}

.modal--stack:has(.reset-popup){
  place-items: center;
}

.modal--stack:has(.reset-popup) .modal__dialog{
  align-self: center;
}

.modal--stack:has(.reset-popup) .modal__content,
.modal__dialog:has(.reset-popup) .modal__content{
  padding-top: 24px !important;
}

.modal--stack:has(.timer-popup) .modal__content,
.modal__dialog:has(.timer-popup) .modal__content,
.modal--stack:has(.help-popup) .modal__content,
.modal__dialog:has(.help-popup) .modal__content{
  padding-top: 0 !important;
}

.modal[data-modal-kind="prizes"] .prizes-popup,
.modal__dialog:has(.prizes-popup) .prizes-popup{
  padding-top: 0;
}

.modal[data-modal-kind="prizes"] .promo-form,
.modal__dialog:has(.prizes-popup) .promo-form{
  padding-top: 0;
}

.modal[data-modal-kind="upload-popup"] .upload-popup{
  padding-top: 0;
}

.upload-popup .pick-wrap{
  margin-top: 2px;
}

.modal[data-modal-kind="faq"] .faq-card,
.modal__dialog:has(.faq-popup) .faq-card{
  padding-top: 0;
}

.modal[data-modal-kind="faq"] .modal__close,
.modal__dialog:has(.faq-popup) .modal__close{
  display: flex !important;
}

.shop-header{
  min-height: auto;
  position: sticky;
  top: -18px;
  z-index: 6;
  padding: 18px 18px 8px;
  background: var(--plam-shell-header-bg) !important;
  border: 0 !important;
  box-shadow: none !important;
  gap: 2px;
  border-radius: 34px 34px 0 0;
  margin-inline: -18px;
  margin-bottom: -4px;
}

#leadersModal .lb-header{
  padding-top: 30px;
}

.profile-popup{
  gap: 7px;
}

.profile-bottom-switches{
  margin-top: -10px;
  gap: 16px;
}

.lang-switch{
  margin: 16px auto 0;
}

.lang-switch__btn{
  transition:
    background-color .16s ease,
    color .16s ease,
    box-shadow .16s ease,
    transform .16s ease,
    filter .16s ease;
  transform: scale(.985);
}

.lang-switch__btn.is-active{
  transform: translateY(-1px) scale(1);
}

.profile-account-popup{
  padding-top: 0;
}

.profile-account-popup .profile-account-card{
  padding: 10px !important;
  gap: 10px !important;
}

.modal--stack.stack--profile-account{
  padding-top: calc(env(safe-area-inset-top, 0px) + 8px) !important;
}

.modal--stack.stack--profile-account .modal__dialog{
  padding: 0 18px 18px !important;
}

.modal--stack.stack--profile-account .modal__content{
  padding-top: 0 !important;
}

.modal--stack.stack--profile-account .profile-account-popup{
  padding-top: 0 !important;
}

.modal--stack.stack--profile-account .profile-account-card{
  margin-top: 0 !important;
  padding-top: 10px !important;
}

.profile-card{
  padding: 10px 14px !important;
  gap: 6px;
}

.profile-account-popup .profile-account-row{
  gap: 10px !important;
}

.profile-account-popup .profile-account-box{
  gap: 10px !important;
}

.policy-popup .policy-body{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.promo-row{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.promo-input{
  min-width: 0;
}

.promo-form [data-promo-apply]{
  min-width: 0;
  white-space: nowrap;
  padding-inline: 12px;
  font-size: 14px;
}

.modal[data-modal-kind="prizes"] .promo-form,
.modal__dialog:has(.prizes-popup) .promo-form{
  width: 100%;
  max-width: 100%;
  padding: 12px !important;
  box-sizing: border-box;
}

.modal[data-modal-kind="prizes"] .promo-row,
.modal__dialog:has(.prizes-popup) .promo-row{
  width: 100%;
}

.modal[data-modal-kind="prizes"] .promo-form [data-promo-apply],
.modal__dialog:has(.prizes-popup) .promo-form [data-promo-apply]{
  min-height: 44px;
  padding-inline: 10px;
  font-size: 13px;
}

.modal :is(.chip, .card, .picked-box, .promo-form, .faq-intro, .faq-accordion__item, .faq-utility-card, .policy-body, .profile-account-box, .profile-account-card, .shop-balance, .shop-item, .btn, .btn-pay, .btn-confirm, .btn-close-timer, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet, .faq-action-btn, .faq-onboarding-btn, .btn-info, .btn-pick, .btn-submit, .shop-tabs, .lb-tabs, .fortune-task-tabs, .shop-top-close),
.modal--stack :is(.chip, .card, .picked-box, .promo-form, .faq-intro, .faq-accordion__item, .faq-utility-card, .policy-body, .profile-account-box, .profile-account-card, .shop-balance, .shop-item, .btn, .btn-pay, .btn-confirm, .btn-close-timer, .profile-account-btn, .shop-exchange, .shop-withdraw, .shop-ton-wallet, .faq-action-btn, .faq-onboarding-btn, .btn-info, .btn-pick, .btn-submit, .shop-tabs, .lb-tabs, .fortune-task-tabs, .shop-top-close),
.modal :is(.profile-header .avatar, .profile-header .profile-id, .profile-header .btn-premium, .profile-header .btn-premium::after),
.modal--stack :is(.profile-header .avatar, .profile-header .profile-id, .profile-header .btn-premium, .profile-header .btn-premium::after){
  box-shadow: none !important;
}

.modal[data-modal-kind="buy-stars"] .shop-top-close,
#leadersModal .lb-header .lb-top-close{
  display: flex !important;
}

#leadersModal .modal__dialog{
  position: relative;
}

/* ===== FINAL shell/body split for Profile + Exchange ===== */
.modal[data-modal-kind="profile"] .modal__dialog,
.modal[data-modal-kind="buy-stars"] .modal__dialog{
  padding: 0 !important;
  background: var(--plam-shell-solid) !important;
  overflow: hidden !important;
}

.modal[data-modal-kind="profile"] > .modal__dialog > .modal__close,
.modal[data-modal-kind="buy-stars"] > .modal__dialog > .modal__close{
  display: none !important;
}

.modal[data-modal-kind="profile"] .modal__content,
.modal[data-modal-kind="buy-stars"] .modal__content{
  display: flex !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.modal[data-modal-kind="profile"] .modal__content{
  max-height: calc(var(--app-h, 100dvh) - var(--safe-top) - var(--safe-bottom) - 24px);
}

.modal[data-modal-kind="buy-stars"] .modal__content{
  max-height: calc(var(--app-h, 100dvh) - var(--safe-top) - var(--safe-bottom) - 24px);
}

.modal[data-modal-kind="profile"] .profile-popup,
.modal[data-modal-kind="buy-stars"] .shop-popup{
  width: 100%;
  max-width: none;
  max-height: inherit;
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.profile-shell,
.shop-shell{
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: start;
  width: 100%;
  max-height: inherit;
  min-height: 0;
}

.profile-header--shell,
.shop-header--shell{
  position: relative;
  top: 0 !important;
  z-index: 3;
  margin: 0 !important;
  margin-inline: 0 !important;
  margin-bottom: 0 !important;
  border-radius: 0 !important;
  background: var(--plam-shell-solid) !important;
  border: 0 !important;
  box-shadow: none !important;
}

.shop-header--shell{
  width: 100%;
  min-height: 0 !important;
  display: grid !important;
  justify-items: center;
  gap: 6px;
  padding: 18px 18px 12px !important;
}

.shop-header--shell .shop-shell-close{
  position: absolute;
  top: 16px;
  right: 16px;
}

.shop-header--shell .shop-top-close{
  display: none !important;
}

.shop-header--shell .shop-title{
  margin: 0;
}

.shop-header--shell .shop-tabs{
  width: 100%;
  max-width: 260px;
}

.shop-scroll{
  min-height: 0;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 10px 18px 18px;
  width: 100%;
}

.shop-scroll::-webkit-scrollbar{
  width: 0;
  height: 0;
}

.profile-header--shell{
  width: 100%;
  display: grid !important;
  grid-template-columns: 100px minmax(0, 1fr);
  grid-auto-rows: min-content;
  column-gap: 10px;
  row-gap: 8px;
  align-items: start;
  padding: 78px 20px 10px 18px !important;
  overflow: visible !important;
}

.profile-header--shell .profile-shell-close{
  position: absolute;
  top: 16px;
  right: 16px;
}

.profile-header--shell .avatar{
  grid-column: 1;
  grid-row: 1 / span 2;
}

.profile-header--shell .avatar.has-crown::before{
  top: -50px;
  left: 24px;
  width: 100px;
}

.profile-header--shell .profile-id{
  justify-self: stretch;
  width: 100%;
}

.profile-header--shell .btn-premium{
  justify-self: stretch;
  width: auto;
  max-width: none;
  margin-right: 58px;
}

.profile-scroll{
  min-height: 0;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  display: grid;
  align-content: start;
  gap: 14px;
  padding: 6px 18px 18px;
}

.profile-scroll::-webkit-scrollbar{
  width: 0;
  height: 0;
}

.modal[data-modal-kind="profile"] .profile-popup{
  min-height: 0 !important;
  flex: 0 0 auto !important;
}

.modal[data-modal-kind="profile"] .profile-card{
  padding: 10px 14px !important;
}

.modal[data-modal-kind="profile"] .profile-bottom-switches{
  margin-top: 8px !important;
  gap: 16px !important;
}

.modal[data-modal-kind="profile"] .lang-switch{
  margin-top: 8px !important;
}

@media (max-width: 390px){
  .profile-header--shell{
    padding: 76px 16px 10px 16px !important;
  }

  .shop-header--shell,
  .profile-scroll,
  .shop-scroll{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

.modal[data-modal-kind="faq"] .modal__content,
.modal__dialog:has(.faq-popup) .modal__content{
  padding-top: 12px !important;
}

.modal[data-modal-kind="prizes"] .modal__content,
.modal__dialog:has(.prizes-popup) .modal__content{
  padding-top: 28px !important;
}

.modal--stack.stack--profile-account .modal__content,
.modal--stack:has(.profile-account-popup) .modal__content{
  padding-top: 10px !important;
}

#leadersModal .lb-top-close{
  display: none !important;
}

@media (max-width: 340px){
  .modal--stack.stack--profile-account .modal__dialog{
    padding: 0 10px 12px !important;
  }

  .profile-account-popup .profile-account-card{
    padding: 8px !important;
    gap: 8px !important;
  }

  .profile-account-popup .profile-account-box{
    gap: 6px;
  }

  .profile-account-popup .profile-account-input{
    height: 54px;
    padding-inline: 12px;
    font-size: 14px;
    line-height: 54px;
  }

  .profile-account-popup .profile-chat-color-panel{
    grid-template-columns: 84px 84px;
    justify-content: center;
    gap: 12px;
    padding: 12px;
  }

  .profile-account-popup .profile-chat-color-custom__button,
  .profile-account-popup .profile-chat-color-custom__lock{
    width: 84px;
    height: 84px;
  }

  .profile-account-popup .profile-chat-color-custom__swatch{
    width: 62px;
    height: 62px;
  }

  .profile-account-popup .profile-chat-color-custom__lock::after{
    inset: 26px;
  }

  .profile-theme-switch{
    gap: 6px;
  }

  .profile-theme-switch__btn{
    min-height: 44px;
    font-size: 13px;
  }

  .profile-account-popup .profile-account-actions{
    gap: 8px;
  }

  .profile-account-popup .profile-account-btn{
    min-height: 42px;
    padding: 8px 12px;
    font-size: 14px;
  }

  .modal[data-modal-kind="buy-stars"] .shop-balance--ton{
    padding: 14px 12px 12px;
  }

  .modal[data-modal-kind="buy-stars"] .shop-balance--ton .shop-balance__value--ton{
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px 6px;
    font-size: 18px;
    line-height: 1.15;
  }

  .modal[data-modal-kind="buy-stars"] .shop-balance--ton .shop-balance__value-icon,
  .modal[data-modal-kind="buy-stars"] .shop-balance--ton .shop-ton-symbol,
  .modal[data-modal-kind="buy-stars"] .shop-panel--ton .shop-item__left img,
  .modal[data-modal-kind="buy-stars"] .shop-panel--ton .shop-item__right img{
    width: 18px;
    height: 18px;
  }

  .modal[data-modal-kind="buy-stars"] .shop-balance--ton .shop-balance__actions{
    width: 100%;
    gap: 8px;
  }

  .modal[data-modal-kind="buy-stars"] .shop-balance--ton .shop-balance__actions--single{
    width: 100%;
  }

  .modal[data-modal-kind="buy-stars"] .shop-balance--ton :is(.shop-exchange, .shop-withdraw, .shop-ton-wallet){
    min-height: 42px;
    font-size: 13px;
    padding-inline: 10px;
  }

  .modal[data-modal-kind="buy-stars"] .shop-panel--ton .shop-item{
    padding: 10px 12px;
    gap: 8px;
  }

  .modal[data-modal-kind="buy-stars"] .shop-panel--ton .shop-item__left,
  .modal[data-modal-kind="buy-stars"] .shop-panel--ton .shop-item__right,
  .modal[data-modal-kind="buy-stars"] .shop-panel--ton .shop-num{
    font-size: 13px;
  }

  .profile-header--shell{
    grid-template-columns: 84px minmax(0, 1fr) !important;
    column-gap: 8px !important;
    padding: 54px 12px 10px 12px !important;
  }

  .profile-header--shell .avatar{
    width: 84px;
    height: 84px;
  }

  .profile-header--shell .avatar.has-crown::before{
    top: -42px;
    left: 18px;
    width: 86px;
  }

  .profile-header--shell .profile-id{
    justify-self: stretch;
    width: 100%;
    padding: 8px 10px;
    font-size: 14px;
  }

  .profile-header--shell .btn-premium{
    justify-self: stretch;
    width: auto;
    max-width: none;
    margin-right: 44px;
    min-height: 40px;
    padding: 8px 12px;
    font-size: 12px;
  }

  .profile-header--shell .btn-premium::after{
    transform: translate(6px, -50%);
    width: 38px;
    height: 38px;
    font-size: 20px;
  }

  .modal[data-modal-kind="profile"] .profile-bottom-switches{
    gap: 8px !important;
    align-items: center;
  }

  .profile-account-entry{
    min-width: 0;
    padding: 8px 12px;
    font-size: 13px;
  }

  .profile-bottom-switches__left{
    flex: 0 1 auto;
    min-width: 0;
  }

  .profile-bottom-switches__right{
    flex: 1 1 auto;
    min-width: 0;
  }

  .lang-switch{
    margin-top: 6px !important;
    padding-inline: 10px;
  }

  .lang-switch__btn{
    padding-inline: 6px;
    font-size: 13px;
  }
}

#leadersModal .lb-topbar{
  display: none !important;
}

html:not([data-theme]) .modal .premium-compare .pc-val,
html:not([data-theme]) .modal--stack .premium-compare .pc-val,
html[data-theme="dark"] .modal .premium-compare .pc-val,
html[data-theme="dark"] .modal--stack .premium-compare .pc-val,
html[data-theme="light"] .modal .premium-compare .pc-val,
html[data-theme="light"] .modal--stack .premium-compare .pc-val{
  color:#FF7300 !important;
}

html:not([data-theme]) .modal .premium-compare .pc-val.is-premium,
html:not([data-theme]) .modal--stack .premium-compare .pc-val.is-premium,
html[data-theme="dark"] .modal .premium-compare .pc-val.is-premium,
html[data-theme="dark"] .modal--stack .premium-compare .pc-val.is-premium,
html[data-theme="light"] .modal .premium-compare .pc-val.is-premium,
html[data-theme="light"] .modal--stack .premium-compare .pc-val.is-premium{
  color:#000 !important;
}

html:not([data-theme]) .modal .premium-compare .pc-val.is-premium.pc-badge,
html:not([data-theme]) .modal--stack .premium-compare .pc-val.is-premium.pc-badge,
html[data-theme="dark"] .modal .premium-compare .pc-val.is-premium.pc-badge,
html[data-theme="dark"] .modal--stack .premium-compare .pc-val.is-premium.pc-badge,
html[data-theme="light"] .modal .premium-compare .pc-val.is-premium.pc-badge,
html[data-theme="light"] .modal--stack .premium-compare .pc-val.is-premium.pc-badge,
html:not([data-theme]) .modal .premium-compare .pc-row:last-child .pc-val.is-premium,
html:not([data-theme]) .modal--stack .premium-compare .pc-row:last-child .pc-val.is-premium,
html[data-theme="dark"] .modal .premium-compare .pc-row:last-child .pc-val.is-premium,
html[data-theme="dark"] .modal--stack .premium-compare .pc-row:last-child .pc-val.is-premium,
html[data-theme="light"] .modal .premium-compare .pc-row:last-child .pc-val.is-premium,
html[data-theme="light"] .modal--stack .premium-compare .pc-row:last-child .pc-val.is-premium{
  color:var(--plam-green) !important;
}

html:not([data-theme]) .modal .premium-compare .pc-name,
html:not([data-theme]) .modal--stack .premium-compare .pc-name,
html[data-theme="dark"] .modal .premium-compare .pc-name,
html[data-theme="dark"] .modal--stack .premium-compare .pc-name,
html[data-theme="light"] .modal .premium-compare .pc-name,
html[data-theme="light"] .modal--stack .premium-compare .pc-name{
  color:#fff !important;
}

html[data-theme="light"] .modal .premium-compare .pc-name,
html[data-theme="light"] .modal--stack .premium-compare .pc-name{
  color:#000 !important;
}

/* My Air */
.profile-air-card{
  display:grid;
  gap:14px;
  padding:16px 18px;
  border-radius:24px;
  background:var(--plam-card-bg-strong);
  border:1px solid var(--plam-card-border);
  color:var(--plam-text-main);
  cursor:pointer;
}

.profile-air-card__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.profile-air-card__title{
  margin:0;
  font-size:20px;
  line-height:1.1;
  font-weight:900;
  color:var(--plam-text-main);
}

.profile-air-card__sub{
  margin:6px 0 0;
  font-size:13px;
  line-height:1.35;
  color:var(--plam-text-muted);
}

.profile-air-card__arrow{
  flex:0 0 auto;
  align-self:center;
  font-size:24px;
  line-height:1;
  color:var(--plam-orange);
}

.profile-air-card__stats,
.my-air-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.air-stat-chip{
  display:grid;
  gap:3px;
  min-width:0;
  padding:12px 10px;
  border-radius:18px;
  background:var(--plam-card-bg-soft);
  border:1px solid var(--plam-card-border);
}

.air-stat-chip--photos .air-stat-chip__value{ color:var(--plam-orange); }
.air-stat-chip--reactions .air-stat-chip__value{ color:var(--plam-green); }
.air-stat-chip--time .air-stat-chip__value{ color:var(--plam-text-main); }

.air-stat-chip__value{
  min-width:0;
  font-size:18px;
  line-height:1.1;
  font-weight:900;
  color:var(--plam-text-main);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.air-stat-chip__label{
  font-size:11px;
  line-height:1.2;
  color:var(--plam-text-muted);
  text-transform:uppercase;
  letter-spacing:.04em;
}

.profile-air-card__media{
  display:grid;
  gap:8px;
}

.profile-air-card__section-title{
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  color:var(--plam-text-soft, var(--plam-text-main));
  text-transform:uppercase;
  letter-spacing:.05em;
}

.air-thumbs{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
}

.air-thumb,
.my-air-best-card__media,
.my-air-photo-row__thumb{
  position:relative;
  overflow:hidden;
  background:var(--plam-card-bg-soft) center/cover no-repeat;
  border:1px solid var(--plam-card-border);
}

.air-thumb{
  aspect-ratio:1/1;
  border-radius:14px;
}

.air-thumb.is-empty,
.my-air-best-card__media.is-empty,
.my-air-photo-row__thumb.is-empty{
  display:grid;
  place-items:center;
  color:var(--plam-text-muted);
  background:
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    var(--plam-card-bg-soft);
}

.air-thumb.is-empty > span,
.my-air-best-card__media.is-empty > span,
.my-air-photo-row__thumb.is-empty > span{
  font-size:12px;
  font-weight:900;
  letter-spacing:.05em;
}

.air-cta-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  color:var(--plam-text-main);
  font-size:14px;
  line-height:1.25;
  font-weight:800;
}

.air-cta-row span:last-child{
  flex:0 0 auto;
  font-size:20px;
  line-height:1;
  color:var(--plam-orange);
}

.air-best-line{
  font-size:13px;
  line-height:1.35;
  color:var(--plam-text-muted);
}

.my-air-popup{
  width:100%;
  min-height:0;
  display:flex;
}

.my-air-modal{
  --my-air-row-h: 100px;
  --my-air-row-gap: 8px;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  gap:12px;
  width:100%;
  max-width:none;
  height:100%;
  max-height:none;
  padding:12px;
  background:transparent;
  border:none;
  box-shadow:none;
  overflow:hidden;
}

.my-air-header{
  display:grid;
  grid-template-columns:48px minmax(0, 1fr) 48px;
  align-items:start;
  gap:10px;
}

.my-air-header__back,
.my-air-header__close{
  width:48px;
  height:48px;
  border:1px solid var(--plam-card-border);
  border-radius:999px;
  background:var(--plam-card-bg-soft);
  color:var(--plam-text-main);
  font-size:28px;
  line-height:1;
}

.my-air-header__spacer{
  display:block;
  width:48px;
  height:48px;
}

.my-air-header__titles{
  min-width:0;
  text-align:center;
  padding-top:0;
}

.my-air-header__title{
  margin:0;
  font-size:24px;
  line-height:1.05;
  font-weight:900;
  color:var(--plam-text-main);
}

.my-air-header__sub{
  margin:3px 0 0;
  font-size:13px;
  line-height:1.35;
  color:var(--plam-text-muted);
}

.my-air-scroll{
  min-height:0;
  display:grid;
  grid-template-rows:auto auto minmax(0, 1fr) auto;
  gap:10px;
  overflow:hidden;
}

.my-air-filter{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.my-air-filter__btn{
  min-height:40px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid var(--plam-card-border);
  background:var(--plam-card-bg-soft);
  color:var(--plam-text-main);
  font-size:13px;
  line-height:1;
  font-weight:800;
}

.my-air-filter__btn.is-active{
  background:linear-gradient(180deg, var(--plam-orange-strong) 0%, var(--plam-orange) 100%);
  border-color:transparent;
  color:#fff;
}

.my-air-best-card{
  display:grid;
  grid-template-columns:96px minmax(0, 1fr);
  gap:14px;
  padding:8px;
  border-radius:24px;
  background:var(--plam-card-bg-strong);
  border:1px solid rgba(255, 115, 0, .3);
}

.my-air-best-card__media{
  width:96px;
  aspect-ratio:1/1;
  border-radius:18px;
}

.my-air-best-card__body{
  min-width:0;
  display:grid;
  align-content:start;
  gap:6px;
}

.my-air-best-card__badge{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255, 115, 0, .14);
  color:var(--plam-orange);
  font-size:11px;
  line-height:1.1;
  font-weight:900;
}

.my-air-best-card__title{
  font-size:18px;
  line-height:1.15;
  font-weight:900;
  color:var(--plam-text-main);
}

.my-air-best-card__metric{
  font-size:14px;
  line-height:1.25;
  font-weight:800;
  color:var(--plam-text-main);
}

.my-air-best-card__meta,
.my-air-best-card__empty{
  font-size:13px;
  line-height:1.35;
  color:var(--plam-text-muted);
}

.my-air-list-wrap{
  min-height:0;
  max-height:none;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:2px;
}

.my-air-list{
  display:grid;
  gap:var(--my-air-row-gap);
}

.my-air-photo-row{
  display:grid;
  grid-template-columns:84px minmax(0, 1fr);
  gap:14px;
  padding:8px;
  height:var(--my-air-row-h);
  border-radius:22px;
  background:var(--plam-card-bg);
  border:1px solid var(--plam-card-border);
  overflow:hidden;
}

.my-air-photo-row__thumb{
  width:84px;
  aspect-ratio:1/1;
  border-radius:16px;
}

.my-air-photo-row__body{
  min-width:0;
  display:grid;
  gap:4px;
  align-content:start;
  min-height:0;
}

.my-air-photo-row__date{
  font-size:13px;
  line-height:1.2;
  font-weight:800;
  color:var(--plam-text-soft, var(--plam-text-main));
}

.my-air-photo-row__reactions{
  font-size:15px;
  line-height:1.25;
  font-weight:900;
  color:var(--plam-text-main);
}

.my-air-photo-row__chips{
  display:flex;
  flex-wrap:nowrap;
  gap:6px;
  overflow:hidden;
}

.my-air-reaction-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  color:var(--plam-text-main);
  font-size:12px;
  line-height:1;
  font-weight:800;
}

.my-air-photo-row__meta{
  font-size:12px;
  line-height:1.3;
  color:var(--plam-text-muted);
}

.my-air-photo-row__menu{
  align-self:start;
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid var(--plam-card-border);
  background:transparent;
  color:var(--plam-text-muted);
  opacity:.72;
}

.my-air-empty{
  display:grid;
  gap:10px;
  padding:18px;
  border-radius:22px;
  background:var(--plam-card-bg);
  border:1px solid var(--plam-card-border);
  text-align:left;
}

.my-air-empty__title{
  font-size:16px;
  line-height:1.25;
  font-weight:900;
  color:var(--plam-text-main);
}

.my-air-empty__text{
  font-size:13px;
  line-height:1.4;
  color:var(--plam-text-muted);
}

.my-air-empty__cta,
.my-air-back-button{
  min-height:48px;
  border:none;
  border-radius:999px;
  padding:0 18px;
  background:linear-gradient(180deg, var(--plam-orange-strong) 0%, var(--plam-orange) 100%);
  color:#fff;
  font-size:15px;
  line-height:1;
  font-weight:900;
}

.my-air-note{
  display:grid;
  grid-template-columns:24px minmax(0, 1fr);
  gap:10px;
  align-items:start;
  margin-top:8px;
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  color:var(--plam-text-muted);
  font-size:13px;
  line-height:1.4;
}

.my-air-note__icon{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:var(--plam-text-main);
  font-size:14px;
  font-weight:900;
}

.modal--stack.stack--my-air .modal__close{
  display:none !important;
}

.modal--stack.stack--my-air .modal__dialog{
  padding:0 !important;
  background:var(--plam-shell-solid) !important;
  max-height:calc(var(--app-h, 100dvh) - var(--safe-top) - var(--safe-bottom) - 24px) !important;
  overflow:hidden !important;
}

.modal--stack.stack--my-air .modal__content{
  display:flex !important;
  padding:0 !important;
  overflow:hidden !important;
}

html[data-theme="light"] .my-air-best-card{
  border-color:rgba(255, 115, 0, .24);
}

html[data-theme="light"] .my-air-note,
html[data-theme="light"] .air-cta-row{
  background:rgba(255,255,255,.72);
}

@media (max-width: 390px){
  .profile-air-card{
    padding:14px 15px;
  }

  .profile-air-card__title{
    font-size:18px;
  }

  .my-air-modal{
    padding:16px;
  }

  .my-air-header__title{
    font-size:22px;
  }

  .my-air-best-card{
    grid-template-columns:84px minmax(0, 1fr);
  }

  .my-air-best-card__media{
    width:84px;
  }
}

@media (max-width: 340px){
  .profile-air-card__stats{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:8px;
  }

  .profile-air-card__stats .air-stat-chip{
    padding:10px 8px;
    border-radius:16px;
  }

  .profile-air-card__stats .air-stat-chip__value{
    font-size:15px;
  }

  .profile-air-card__stats .air-stat-chip__label{
    font-size:10px;
    letter-spacing:.02em;
  }

  .my-air-summary{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:8px;
  }

  .my-air-summary .air-stat-chip{
    padding:10px 8px;
    border-radius:16px;
  }

  .my-air-summary .air-stat-chip__value{
    font-size:15px;
  }

  .my-air-summary .air-stat-chip__label{
    font-size:10px;
    letter-spacing:.02em;
  }

  .my-air-header{
    grid-template-columns:44px minmax(0, 1fr) 44px;
  }

  .my-air-header__back,
  .my-air-header__close{
    width:44px;
    height:44px;
  }

  .my-air-best-card{
    grid-template-columns:84px minmax(0, 1fr);
    gap:12px;
  }

  .my-air-best-card__media,
  .my-air-photo-row__thumb{
    width:100%;
    max-width:84px;
  }

  .my-air-photo-row__menu{
    justify-self:end;
  }
}

@media (max-height: 600px){
  .my-air-summary{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:8px;
  }

  .my-air-summary .air-stat-chip{
    padding:10px 8px;
    border-radius:16px;
  }

  .my-air-summary .air-stat-chip__value{
    font-size:15px;
  }

  .my-air-summary .air-stat-chip__label{
    font-size:10px;
    letter-spacing:.02em;
  }
}

html:not([data-theme]) .profile-air-card .air-stat-chip--photos .air-stat-chip__value,
html[data-theme="dark"] .profile-air-card .air-stat-chip--photos .air-stat-chip__value{
  color:var(--plam-orange) !important;
}

html:not([data-theme]) .profile-air-card .air-stat-chip--reactions .air-stat-chip__value,
html[data-theme="dark"] .profile-air-card .air-stat-chip--reactions .air-stat-chip__value{
  color:var(--plam-green) !important;
}

html:not([data-theme]) .profile-air-card .air-stat-chip--time .air-stat-chip__value,
html[data-theme="dark"] .profile-air-card .air-stat-chip--time .air-stat-chip__value{
  color:var(--plam-text-main) !important;
}

html:not([data-theme]) .my-air-summary .air-stat-chip--photos .air-stat-chip__value,
html[data-theme="dark"] .my-air-summary .air-stat-chip--photos .air-stat-chip__value{
  color:var(--plam-orange) !important;
}

html:not([data-theme]) .my-air-summary .air-stat-chip--reactions .air-stat-chip__value,
html[data-theme="dark"] .my-air-summary .air-stat-chip--reactions .air-stat-chip__value{
  color:var(--plam-green) !important;
}

html:not([data-theme]) .my-air-summary .air-stat-chip--time .air-stat-chip__value,
html[data-theme="dark"] .my-air-summary .air-stat-chip--time .air-stat-chip__value{
  color:var(--plam-text-main) !important;
}

@media (max-width: 360px){
  .modal[data-modal-kind="profile"] .profile-bottom-switches{
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
  }

  .modal[data-modal-kind="profile"] .profile-bottom-switches__left{
    flex:0 1 auto !important;
    min-width:0 !important;
    align-items:center !important;
  }

  .modal[data-modal-kind="profile"] .profile-bottom-switches__right{
    flex:1 1 auto !important;
    min-width:0 !important;
    align-items:flex-end !important;
  }

  .modal[data-modal-kind="profile"] .profile-account-entry{
    min-width:0 !important;
    padding:8px 12px !important;
    font-size:13px !important;
  }

  .modal[data-modal-kind="profile"] .lang-switch{
    width:auto !important;
    margin-top:0 !important;
    padding:6px 10px !important;
  }

  .modal[data-modal-kind="profile"] .lang-switch__btn{
    padding-inline:6px !important;
    font-size:12px !important;
  }
}

/* Final guard: landscape TV popup must stay shell-free and centered. */
.modal:has(.streams-popup.streams-popup--landscape-lite){
  padding:0 !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .modal__dialog{
  width:100vw !important;
  max-width:none !important;
  height:min(var(--app-h, 100svh), 100svh) !important;
  max-height:none !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  display:grid !important;
  place-items:center !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .modal__content{
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  min-height:100% !important;
  max-height:none !important;
  padding:0 !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-popup{
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  padding:0 !important;
  gap:0 !important;
  background:transparent !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) :is(.streams-card, .chip.streams-card){
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:100% !important;
  min-height:min(var(--app-h, 100svh), 100svh) !important;
  padding:0 !important;
  gap:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-tv-shell{
  margin:0 auto !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Final override: fake landscape in portrait viewport must be visually rotated clockwise. */
.modal:has(.streams-popup.streams-popup--force-landscape) .modal__dialog{
  width:100vw !important;
  max-width:none !important;
  height:min(var(--app-h, 100svh), 100svh) !important;
  max-height:none !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  display:grid !important;
  place-items:center !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) .modal__content{
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  min-height:100% !important;
  max-height:none !important;
  padding:0 !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) .streams-popup{
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  padding:0 !important;
  gap:0 !important;
  overflow:visible !important;
  background:transparent !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) :is(.streams-card, .chip.streams-card){
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:min(calc(var(--app-h, 100dvh) - 32px), 900px) !important;
  height:min(calc(100vw - 24px), 440px) !important;
  min-height:0 !important;
  max-height:none !important;
  padding:0 !important;
  gap:0 !important;
  transform:translate(-50%, -50%) rotate(90deg) !important;
  transform-origin:center center !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) .streams-popup{
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-popup{
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) :is(.streams-card, .chip.streams-card){
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-tv-shell{
  position:relative !important;
  left:auto !important;
  top:auto !important;
  width:min(calc(100vw - 24px), calc((min(var(--app-h, 100svh), 100svh) - 24px) * var(--tv-popup-frame-ratio))) !important;
  height:auto !important;
  max-width:calc(100vw - 24px) !important;
  aspect-ratio:var(--tv-popup-frame-ratio) !important;
  transform:none !important;
  transform-origin:center center !important;
  margin:0 auto !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite:not(.streams-popup--force-landscape)) .modal__dialog{
  --tv-real-shell-w:min(calc(100vw - 24px), calc((min(var(--app-h, 100svh), 100svh) - 24px) * var(--tv-popup-frame-ratio)));
  --tv-real-shell-h:calc(var(--tv-real-shell-w) / var(--tv-popup-frame-ratio));
}

.modal:has(.streams-popup.streams-popup--force-landscape) .modal__dialog{
  --tv-force-shell-w:min(calc(min(var(--app-h, 100svh), 100svh) - 32px), calc((100vw - 24px) * var(--tv-popup-frame-ratio)));
  --tv-force-shell-h:calc(var(--tv-force-shell-w) / var(--tv-popup-frame-ratio));
}

.modal:has(.streams-popup.streams-popup--force-landscape) :is(.streams-card, .chip.streams-card){
  position:relative !important;
  left:auto !important;
  top:auto !important;
  width:100% !important;
  height:100% !important;
  min-height:min(var(--app-h, 100svh), 100svh) !important;
  max-height:none !important;
  transform:none !important;
  transform-origin:center center !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) .streams-tv-shell{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:var(--tv-force-shell-w) !important;
  height:auto !important;
  max-width:none !important;
  aspect-ratio:var(--tv-popup-frame-ratio) !important;
  margin:0 !important;
  transform:translate(-50%, -50%) rotate(90deg) !important;
  transform-origin:center center !important;
  overflow:visible !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) > .modal__dialog > .modal__close{
  display:none !important;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-tv-shell{
  --tv-shell-close-top:18px;
  --tv-shell-close-right:-56px;
}

.modal:has(.streams-popup.streams-popup--landscape-lite) .streams-tv-shell > .streams-popup-close{
  display:flex !important;
  position:absolute !important;
  top:var(--tv-shell-close-top) !important;
  right:var(--tv-shell-close-right) !important;
  left:auto !important;
  width:44px !important;
  height:44px !important;
  z-index:120 !important;
  transform:none !important;
  margin:0 !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) .streams-tv-shell > .streams-popup-close.streams-popup-close--return{
  color:var(--plam-close-fg) !important;
  font-size:24px !important;
  line-height:1 !important;
  font-weight:700 !important;
  align-items:center !important;
  justify-content:center !important;
}

.modal:has(.streams-popup.streams-popup--force-landscape) .streams-tv-shell > .streams-popup-close.streams-popup-close--return::before,
.modal:has(.streams-popup.streams-popup--force-landscape) .streams-tv-shell > .streams-popup-close.streams-popup-close--return::after{
  content:none !important;
  display:none !important;
}

@media (max-width:420px){
  .watch-tv-platform-row,
  .streams-live-platform-row{
    gap:6px;
  }

  .watch-tv-brand,
  .streams-live-platform-row .streams-brand{
    padding:0 6px;
  }
}