/* KinoGO.Li: promo-баннер подписки поверх плеера */
#preroll{position:relative}
#kgPromo{position:absolute;left:5%;right:5%;bottom:80px;z-index:7;pointer-events:none;font-family:"Segoe UI",Roboto,Arial,sans-serif;animation:kgpIn .35s ease both}
#kgPromo[hidden],#kgPromo [hidden]{display:none!important}
#kgPromo[data-size="x"]{display:none}
@keyframes kgpIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#kgPromo{animation:none}}

#kgPromo .kgp{position:relative;display:flex;align-items:center;gap:20px;height:136px;padding:0 30px 0 22px;box-sizing:border-box;border-radius:16px;color:#fff;
  background:linear-gradient(90deg,rgba(10,34,48,.94) 0%,rgba(16,16,22,.95) 50%,rgba(44,12,18,.94) 100%);
  box-shadow:0 10px 30px rgba(0,0,0,.65),inset 0 0 0 1px rgba(255,255,255,.07)}
#kgPromo .kgp:before,#kgPromo .kgp:after{content:"";position:absolute;top:14px;bottom:14px;width:4px;border-radius:4px}
#kgPromo .kgp:before{left:0;background:#22c3f0}
#kgPromo .kgp:after{right:0;background:#ff2e3f}

#kgPromo .kgp-logo{flex:0 0 108px;height:108px;margin-top:-6px;padding:3px;box-sizing:border-box;border-radius:50%;background:linear-gradient(135deg,#22c3f0,#ff2e3f);box-shadow:0 6px 18px rgba(0,0,0,.55)}
#kgPromo .kgp-logo img{display:block;width:100%;height:100%;border-radius:50%;background:#0b0b0f;object-fit:cover}
#kgPromo .kgp-txt{flex:1;min-width:0}
#kgPromo .kgp-cap{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#8fd9f0}
#kgPromo .kgp-cap b{font-size:17px;font-weight:800;letter-spacing:.01em;color:#fff}
#kgPromo .kgp-cap i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#5a6670}
#kgPromo .kgp-t1{margin-top:4px;font-size:24px;font-weight:800;line-height:1.15}
#kgPromo .kgp-t2{margin-top:7px;font-size:14px;line-height:1.35;color:#c3ccd3}

#kgPromo .kgp-btns{flex:0 0 262px;display:flex;flex-direction:column;gap:9px}
#kgPromo .kgp-btn{pointer-events:auto;display:flex;align-items:center;justify-content:center;gap:10px;height:46px;padding:0 12px;box-sizing:border-box;border:0;border-radius:11px;color:#fff!important;font:700 15px/1 "Segoe UI",Roboto,Arial,sans-serif;white-space:nowrap;text-decoration:none!important;cursor:pointer}
#kgPromo .kgp-btn svg{width:20px;height:20px;fill:#fff;flex:0 0 auto}
#kgPromo .kgp-tg{background:linear-gradient(180deg,#2cc8f4,#168fc4);box-shadow:0 4px 14px rgba(34,195,240,.35)}
#kgPromo .kgp-br{background:linear-gradient(180deg,#ff4352,#d1202f);box-shadow:0 4px 14px rgba(255,46,63,.35)}
#kgPromo .kgp-btn:hover{filter:brightness(1.08)}
#kgPromo .kgp-btn:disabled{opacity:.7;cursor:default}
#kgPromo .kgp-x{pointer-events:auto;position:absolute;top:3px;right:12px;width:26px;height:26px;padding:0;border:0;background:none;color:#7d868e;font-size:20px;line-height:26px;cursor:pointer}
#kgPromo .kgp-x:hover{color:#fff}

/* компактный вариант для небольших плееров */
#kgPromo[data-size="m"]{left:3%;right:3%;bottom:64px}
#kgPromo[data-size="m"] .kgp{height:auto;min-height:84px;gap:12px;padding:10px 34px 10px 14px}
#kgPromo[data-size="m"] .kgp-logo{flex-basis:60px;height:60px;margin-top:0}
#kgPromo[data-size="m"] .kgp-cap,#kgPromo[data-size="m"] .kgp-t2{display:none}
#kgPromo[data-size="m"] .kgp-t1{margin-top:0;font-size:16px}
#kgPromo[data-size="m"] .kgp-btns{flex-basis:190px;gap:6px}
#kgPromo[data-size="m"] .kgp-btn{height:34px;font-size:12.5px;border-radius:9px}
#kgPromo[data-size="m"] .kgp-btn svg{width:16px;height:16px}
