
#csCookieBar{
 --cscb-accent:#e44c01;
 --cscb-accent2:#ff8a3d;
 --cscb-bg:#10131a;
 --cscb-bg2:#151924;
 --cscb-line:#252b38;
 --cscb-text:#f4f6fb;
 --cscb-muted:#b8c0cc;
 font-family:'Manrope',sans-serif;
 position:fixed;
 left:16px;right:16px;bottom:16px;
 z-index:20500;
 display:none;
 opacity:0;
 transform:translateY(24px);
 transition:opacity .38s ease, transform .38s cubic-bezier(.2,.8,.2,1);
}
#csCookieBar.cscb-show{
 display:block;
}
#csCookieBar.cscb-visible{
 opacity:1;
 transform:translateY(0);
}
#csCookieBar *{box-sizing:border-box;}

.cscb-inner{
 position:relative;
 max-width:920px;
 margin:0 auto;
 display:flex;
 align-items:center;
 gap:18px;
 padding:16px 20px 16px 18px;
 border-radius:18px;
 overflow:hidden;
 background:
 radial-gradient(560px 220px at 100% -20%, rgba(228,76,1,.14), transparent 60%),
 linear-gradient(180deg,#151924 0%,#10131a 100%);
 border:1px solid rgba(255,255,255,.08);
 box-shadow:
 0 18px 44px rgba(0,0,0,.5),
 0 0 0 1px rgba(228,76,1,.06);
}
.cscb-inner::before{
 content:"";
 position:absolute;left:0;top:14px;bottom:14px;width:3px;
 border-radius:0 6px 6px 0;
 background:linear-gradient(180deg,var(--cscb-accent),var(--cscb-accent2));
 box-shadow:0 0 12px rgba(228,76,1,.5);
}

.cscb-ico{
 width:42px;height:42px;flex-shrink:0;
 border-radius:12px;
 background:rgba(228,76,1,.12);
 border:1px solid rgba(228,76,1,.22);
 display:flex;align-items:center;justify-content:center;
 color:var(--cscb-accent2);
}
.cscb-ico svg{width:21px;height:21px;}

.cscb-text{
 flex:1;
 min-width:0;
}
.cscb-text p{
 margin:0;
 font-size:13px;
 line-height:1.6;
 color:var(--cscb-muted);
}
.cscb-text b{
 color:var(--cscb-text);
 font-weight:700;
}
.cscb-text a{
 color:var(--cscb-accent2);
 font-weight:700;
 text-decoration:none;
 border-bottom:1px dashed rgba(255,138,61,.4);
 transition:color .18s, border-color .18s;
}
.cscb-text a:hover{
 color:#ffb37d;
 border-color:#ffb37d;
}

.cscb-actions{
 display:flex;
 align-items:center;
 gap:8px;
 flex-shrink:0;
}

.cscb-btn-accept{
 display:inline-flex;
 align-items:center;
 gap:7px;
 padding:11px 20px;
 border:none;
 border-radius:11px;
 background:linear-gradient(135deg,#ff3d00,#e44c01);
 color:#fff;
 font-family:'Exo 2',sans-serif;
 font-size:12.5px;
 font-weight:800;
 letter-spacing:.3px;
 text-transform:uppercase;
 cursor:pointer;
 position:relative;
 overflow:hidden;
 box-shadow:0 6px 18px rgba(228,76,1,.32);
 transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
 white-space:nowrap;
}
.cscb-btn-accept::before{
 content:"";
 position:absolute;top:0;left:-75%;width:50%;height:100%;
 background:linear-gradient(120deg,transparent,rgba(255,255,255,.28),transparent);
 transform:skewX(-20deg);
 animation:cscb-shine 2.8s linear infinite;
}
@keyframes cscb-shine{0%{left:-75%}100%{left:125%}}
.cscb-btn-accept:hover{
 transform:translateY(-1px);
 box-shadow:0 10px 26px rgba(228,76,1,.44);
 background:linear-gradient(135deg,#ff5500,#ff6b1a);
}
.cscb-btn-accept svg{width:14px;height:14px;flex-shrink:0;}

.cscb-btn-close{
 width:38px;height:38px;flex-shrink:0;
 border-radius:11px;
 border:1px solid var(--cscb-line);
 background:#171c26;
 color:var(--cscb-muted);
 display:flex;align-items:center;justify-content:center;
 cursor:pointer;
 transition:background .18s, border-color .18s, color .18s;
}
.cscb-btn-close:hover{
 background:#202532;
 border-color:rgba(228,76,1,.3);
 color:var(--cscb-text);
}
.cscb-btn-close svg{width:15px;height:15px;}

@media (max-width:760px){
 #csCookieBar{left:10px;right:10px;bottom:10px;}
 .cscb-inner{
 flex-wrap:wrap;
 padding:16px 16px 14px;
 border-radius:16px;
 gap:12px;
 }
 .cscb-ico{width:36px;height:36px;}
 .cscb-ico svg{width:18px;height:18px;}
 .cscb-text{flex-basis:100%;order:1;}
 .cscb-actions{
 order:2;
 width:100%;
 justify-content:space-between;
 }
 .cscb-btn-accept{flex:1;justify-content:center;}
}


.exint-overlay {
 display: none;
 position: fixed;
 inset: 0;
 background: rgba(0,0,0,.75);
 backdrop-filter: blur(6px);
 -webkit-backdrop-filter: blur(6px);
 z-index: 99999;
 align-items: center;
 justify-content: center;
 padding: 20px;
}
.exint-overlay.exint-show {
 display: flex;
 animation: exint-fadein .28s ease;
}
@keyframes exint-fadein {
 from { opacity: 0; }
 to { opacity: 1; }
}

/* ---- ПОПАП ---- */
.exint-box {
 position: relative;
 width: 100%;
 max-width: 480px;
 background: #10131a;
 border: 1px solid #252b38;
 border-radius: 20px;
 overflow: hidden;
 box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(228,76,1,.1);
 animation: exint-slidein .32s cubic-bezier(.34,1.56,.64,1);
}
@keyframes exint-slidein {
 from { opacity: 0; transform: translateY(-24px) scale(.96); }
 to { opacity: 1; transform: translateY(0) scale(1); }
}

/* верхняя оранжевая линия */
.exint-box::before {
 content: '';
 position: absolute;
 left: 0; right: 0; top: 0;
 height: 2px;
 background: linear-gradient(90deg, transparent, #e44c01 40%, #ff8c00 60%, transparent);
}

/* ---- ФОНОВЫЙ GLOW ---- */
.exint-glow {
 position: absolute;
 top: -60px; right: -60px;
 width: 220px; height: 220px;
 background: radial-gradient(circle, rgba(228,76,1,.12), transparent 65%);
 pointer-events: none;
}

/* ---- КНОПКА ЗАКРЫТЬ ---- */
.exint-close {
 position: absolute;
 top: 12px; right: 12px;
 width: 30px; height: 30px;
 border-radius: 8px;
 background: #151924;
 border: 1px solid #252b38;
 color: #5f6878;
 display: flex; align-items: center; justify-content: center;
 cursor: pointer;
 font-size: 18px; line-height: 1;
 transition: background .18s, color .18s, border-color .18s;
 z-index: 2;
}
.exint-close:hover { background: #1b202c; color: #f4f6fb; border-color: rgba(228,76,1,.3); }

/* ---- ТЕЛО ---- */
.exint-body {
 padding: 28px 26px 24px;
 text-align: center;
 position: relative;
}

/* эмодзи/иконка */
.exint-emoji {
 font-size: 48px;
 line-height: 1;
 margin-bottom: 14px;
 display: block;
 animation: exint-shake .6s ease .3s;
}
@keyframes exint-shake {
 0%,100% { transform: rotate(0); }
 20% { transform: rotate(-12deg); }
 40% { transform: rotate(12deg); }
 60% { transform: rotate(-8deg); }
 80% { transform: rotate(8deg); }
}

.exint-title {
 font-family: 'Exo 2', sans-serif;
 font-size: 22px; font-weight: 900;
 color: #f4f6fb;
 text-transform: uppercase;
 letter-spacing: .3px;
 margin-bottom: 8px;
 line-height: 1.2;
}
.exint-title span { color: #ff7a2f; }

.exint-sub {
 font-family: 'Manrope', sans-serif;
 font-size: 14px; font-weight: 500;
 color: #5f6878;
 line-height: 1.65;
 margin-bottom: 20px;
}
.exint-sub strong { color: #c9d1dd; font-weight: 700; }

/* ---- ПЛЮШКИ ---- */
.exint-perks {
 display: flex;
 flex-direction: column;
 gap: 7px;
 margin-bottom: 22px;
 text-align: left;
}
.exint-perk {
 display: flex;
 align-items: center;
 gap: 10px;
 padding: 10px 13px;
 background: linear-gradient(180deg, #151924 0%, #0f1219 100%);
 border: 1px solid rgba(255,255,255,.06);
 border-radius: 10px;
 font-family: 'Manrope', sans-serif;
 font-size: 13px; font-weight: 600;
 color: #c9d1dd;
}
.exint-perk-ico {
 width: 28px; height: 28px; flex-shrink: 0;
 border-radius: 8px;
 background: rgba(228,76,1,.1);
 border: 1px solid rgba(228,76,1,.18);
 display: flex; align-items: center; justify-content: center;
 color: #e44c01;
}
.exint-perk-ico svg { width: 13px; height: 13px; }

/* ---- КНОПКИ ---- */
.exint-btns {
 display: flex;
 flex-direction: column;
 gap: 8px;
}
.exint-btn-stay {
 display: inline-flex; align-items: center; justify-content: center; gap: 8px;
 width: 100%; padding: 14px 20px;
 background: linear-gradient(135deg, #ff3d00, #e44c01);
 border: none; border-radius: 12px;
 font-family: 'Exo 2', sans-serif;
 font-size: 14px; font-weight: 900;
 color: #fff; text-transform: uppercase; letter-spacing: .5px;
 cursor: pointer; text-decoration: none;
 box-shadow: 0 6px 20px rgba(228,76,1,.35);
 transition: transform .18s, box-shadow .18s, background .18s;
 position: relative; overflow: hidden;
}
.exint-btn-stay::before {
 content: '';
 position: absolute;
 top: 0; left: -75%; width: 50%; height: 100%;
 background: linear-gradient(120deg, transparent, rgba(255,255,255,.18), transparent);
 transform: skewX(-20deg);
 animation: exint-shine 2.4s linear infinite;
 pointer-events: none;
}
@keyframes exint-shine { 0%{left:-75%} 100%{left:125%} }
.exint-btn-stay:hover {
 transform: translateY(-2px);
 box-shadow: 0 10px 28px rgba(228,76,1,.48);
 background: linear-gradient(135deg, #ff5500, #ff6b1a);
}
.exint-btn-leave {
 width: 100%; padding: 10px;
 background: transparent; border: none;
 font-family: 'Manrope', sans-serif;
 font-size: 12px; font-weight: 600;
 color: #3b4354;
 cursor: pointer;
 transition: color .18s;
 text-decoration: underline;
 text-underline-offset: 3px;
}
.exint-btn-leave:hover { color: #5f6878; }

/* ---- МОБАЙЛ ---- */
@media (max-width: 480px) {
 .exint-body { padding: 24px 18px 20px; }
 .exint-title { font-size: 19px; }
}


.sstop-btn {
 position: fixed;
 bottom: 28px;
 right: 28px;
 z-index: 9999;
 width: 54px;
 height: 54px;
 cursor: pointer;
 opacity: 0;
 visibility: hidden;
 transform: translateY(12px) scale(.9);
 transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
}

.sstop-btn.sstop-visible {
 opacity: 1;
 visibility: visible;
 transform: translateY(0) scale(1);
}

/* SVG-кольцо прогресса */
.sstop-svg {
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 transform: rotate(-90deg);
}

.sstop-track {
 fill: none;
 stroke: #1e2330;
 stroke-width: 3;
}

.sstop-progress {
 fill: none;
 stroke: #e44c01;
 stroke-width: 3;
 stroke-linecap: round;
 stroke-dasharray: 163; /* 2π × r(26) ≈ 163 */
 stroke-dashoffset: 163;
 transition: stroke-dashoffset .1s linear;
 filter: drop-shadow(0 0 4px rgba(228,76,1,.5));
}

/* центральный кружок */
.sstop-inner {
 position: absolute;
 inset: 5px;
 border-radius: 50%;
 background: #10131a;
 border: 1px solid #252b38;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 gap: 1px;
 transition: background .2s, border-color .2s, box-shadow .2s;
}

.sstop-btn:hover .sstop-inner {
 background: #151924;
 border-color: rgba(228,76,1,.4);
 box-shadow: 0 0 16px rgba(228,76,1,.2);
}

/* стрелка */
.sstop-arrow {
 width: 16px; height: 16px;
 color: #e44c01;
 transition: transform .22s cubic-bezier(.34,1.56,.64,1), color .2s;
}
.sstop-btn:hover .sstop-arrow {
 transform: translateY(-2px);
 color: #ff8a3d;
}

/* процент */
.sstop-pct {
 font-family: 'Exo 2', sans-serif;
 font-size: 9px;
 font-weight: 800;
 color: #5f6878;
 line-height: 1;
 letter-spacing: .3px;
 transition: color .2s;
}
.sstop-btn:hover .sstop-pct { color: #ff7a2f; }

@media (max-width: 560px) {
 .sstop-btn { bottom: 16px; right: 16px; width: 48px; height: 48px; }
 .sstop-progress { stroke-dasharray: 141; stroke-dashoffset: 141; } /* r=22 */
}


/* ============================================================
 FOOTER — csf2- prefix
 ============================================================ */
.csf2-root {
 position: relative;
 background: #0b0d12;
 font-family: 'Manrope', sans-serif;
 border-top: 1px solid #1e2330;
 overflow: hidden;
}

/* фоновое изображение */
.csf2-bg {
 position: absolute;
 inset: 0;
 width: 100%; height: 100%;
 object-fit: cover;
 object-position: center top;
 opacity: .08;
 pointer-events: none;
 z-index: 0;
}

/* canvas частицы */
.csf2-canvas {
 position: absolute;
 inset: 0;
 width: 100%; height: 100%;
 pointer-events: none;
 z-index: 1;
}

/* огонь */
.csf2-fire {
 position: absolute;
 bottom: 0;
 pointer-events: none;
 z-index: 2;
}
.csf2-fire--l { left: 0; }
.csf2-fire--r { right: 0; }
.csf2-fire img {
 height: 300px; width: auto; display: block;
 animation: csf2-float 4s ease-in-out infinite;
 transition: transform .3s ease;
}
.csf2-fire--r img { animation-delay: -2s; }
.csf2-fire img:hover { transform: scale(1.06) translateY(-6px) !important; }
@keyframes csf2-float {
 0%,100% { transform: translateY(0); }
 50% { transform: translateY(-12px); }
}

/* верхняя линия */
.csf2-topline {
 position: absolute;
 left: 60px; right: 60px; top: 0;
 height: 1px;
 background: linear-gradient(90deg, transparent, rgba(228,76,1,.55) 50%, transparent);
 z-index: 3;
}

/* весь контент поверх */
.csf2-inner { position: relative; z-index: 4; }

/* ============================================================
 ВЕРХНЯЯ ПОЛОСА — СТАТЫ
 ============================================================ */
.csf2-statsbar {
 border-bottom: 1px solid #1e2330;
 background: rgba(255,255,255,.018);
}
.csf2-statsbar-inner {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 24px;
 display: flex;
 align-items: stretch;
 flex-wrap: wrap;
}
.csf2-stat {
 display: flex;
 align-items: center;
 gap: 10px;
 padding: 14px 24px 14px 0;
 margin-right: 24px;
 border-right: 1px solid #1e2330;
}
.csf2-stat:last-child { border-right: none; margin-right: 0; }
.csf2-stat-ico {
 width: 30px; height: 30px; flex-shrink: 0;
 border-radius: 8px;
 background: rgba(228,76,1,.1);
 border: 1px solid rgba(228,76,1,.18);
 display: flex; align-items: center; justify-content: center;
 color: #e44c01;
}
.csf2-stat-ico svg { width: 13px; height: 13px; }
.csf2-stat-lbl {
 font-family: 'Exo 2', sans-serif;
 font-size: 9px; font-weight: 800;
 color: #3b4354;
 text-transform: uppercase;
 letter-spacing: .5px;
 display: block; line-height: 1;
 margin-bottom: 2px;
}
.csf2-stat-val {
 font-family: 'Exo 2', sans-serif;
 font-size: 14px; font-weight: 900;
 color: #f4f6fb;
 line-height: 1;
}
.csf2-stat-val span { color: #ff7a2f; }

/* ============================================================
 ОСНОВНАЯ СЕТКА
 ============================================================ */
.csf2-main {
 max-width: 1200px;
 margin: 0 auto;
 padding: 44px 24px 36px;
 display: grid;
 grid-template-columns: 240px 1fr 1fr 1fr;
 gap: 36px;
}

/* --- ЛОГО-БЛОК --- */
.csf2-logo-wrap { display: flex; flex-direction: column; gap: 16px; }
.csf2-logo {
 display: inline-block;
 text-decoration: none;
 line-height: 0;
}
.csf2-logo img {
 height: 36px; width: auto;
 filter: drop-shadow(0 0 10px rgba(255,102,0,.22));
 transition: filter .22s;
}
.csf2-logo:hover img { filter: drop-shadow(0 0 18px rgba(255,102,0,.45)); }

.csf2-about {
 font-size: 12.5px;
 color: rgba(255,255,255,.35);
 line-height: 1.68;
}

/* соцсети в логоблоке */
.csf2-socials {
 display: flex; gap: 7px; flex-wrap: wrap;
}
.csf2-soc-btn {
 display: inline-flex; align-items: center; justify-content: center;
 width: 34px; height: 34px;
 border-radius: 9px;
 border: 1px solid #1e2330;
 background: #151924;
 color: #5f6878;
 text-decoration: none;
 transition: background .18s, border-color .18s, color .18s, transform .18s;
}
.csf2-soc-btn svg { width: 15px; height: 15px; }
.csf2-soc-btn:hover {
 background: rgba(228,76,1,.12);
 border-color: rgba(228,76,1,.3);
 color: #ff7a2f;
 transform: translateY(-2px);
}

/* powered by */
.csf2-powered {
 font-size: 11px;
 color: rgba(255,255,255,.2);
 margin-top: auto;
}
.csf2-powered a { color: rgba(255,255,255,.28); text-decoration: none; }
.csf2-powered a:hover { color: #ff6600; }

/* --- КОЛОНКИ --- */
.csf2-col { display: flex; flex-direction: column; }

.csf2-col-head {
 display: flex; align-items: center; gap: 9px;
 margin-bottom: 14px;
 padding-bottom: 12px;
 border-bottom: 1px solid #1e2330;
}
.csf2-col-ico {
 width: 26px; height: 26px; flex-shrink: 0;
 border-radius: 7px;
 background: rgba(228,76,1,.1);
 border: 1px solid rgba(228,76,1,.18);
 display: flex; align-items: center; justify-content: center;
 color: #e44c01;
}
.csf2-col-ico svg { width: 12px; height: 12px; }
.csf2-col-title {
 font-family: 'Exo 2', sans-serif;
 font-size: 11px; font-weight: 900;
 color: rgba(255,255,255,.45);
 text-transform: uppercase;
 letter-spacing: .6px;
 line-height: 1;
}

.csf2-links {
 list-style: none;
 margin: 0; padding: 0;
 display: flex; flex-direction: column; gap: 2px;
}
.csf2-links li { list-style: none; }
.csf2-links li a {
 display: flex; align-items: center; gap: 8px;
 padding: 5px 0;
 font-size: 12.5px;
 color: rgba(255,255,255,.38);
 text-decoration: none;
 line-height: 1.35;
 transition: color .18s, padding-left .18s;
 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.csf2-links li a::before {
 content: '';
 width: 4px; height: 4px; flex-shrink: 0;
 border-radius: 50%;
 background: #e44c01;
 opacity: .3;
 transition: opacity .18s;
}
.csf2-links li a:hover {
 color: #ff8c40;
 padding-left: 4px;
}
.csf2-links li a:hover::before { opacity: 1; }

/* ============================================================
 РАЗДЕЛИТЕЛЬ
 ============================================================ */
.csf2-divider {
 max-width: 1200px;
 margin: 0 auto;
 height: 1px;
 background: #1e2330;
}

/* ============================================================
 НИЖНЯЯ ПОЛОСА
 ============================================================ */
.csf2-bottom {
 max-width: 1200px;
 margin: 0 auto;
 padding: 18px 24px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 16px;
 flex-wrap: wrap;
}
.csf2-copy {
 font-size: 12px;
 color: rgba(255,255,255,.22);
 line-height: 1.7;
}
.csf2-copy a { color: rgba(255,255,255,.32); text-decoration: none; transition: color .18s; }
.csf2-copy a:hover { color: #ff6600; }

.csf2-badges {
 display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.csf2-badges a {
 display: inline-block; line-height: 0;
 border-radius: 4px; overflow: hidden;
 opacity: .55; transition: opacity .18s;
}
.csf2-badges a:hover { opacity: 1; }
.csf2-badges img { display: block; max-width: none; }

/* ============================================================
 АДАПТИВ
 ============================================================ */
@media (max-width: 1024px) {
 .csf2-main { grid-template-columns: 1fr 1fr; gap: 26px; }
 .csf2-logo-wrap { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; gap: 20px; }
 .csf2-about { flex: 1; min-width: 200px; }
 .csf2-fire img { height: 200px; }
}
@media (max-width: 768px) {
 .csf2-main { grid-template-columns: 1fr 1fr; padding: 36px 16px 28px; gap: 20px; }
 .csf2-statsbar-inner { gap: 0; }
 .csf2-stat { padding: 12px 16px 12px 0; margin-right: 16px; }
 .csf2-fire img { height: 140px; }
}
@media (max-width: 560px) {
 .csf2-main { grid-template-columns: 1fr; padding: 28px 16px 110px; }
 .csf2-logo-wrap { flex-direction: column; gap: 12px; }
 .csf2-statsbar-inner { flex-wrap: wrap; }
 .csf2-stat { border-right: none; padding: 10px 0; margin-right: 0; width: 50%; border-bottom: 1px solid #1e2330; }
 .csf2-fire img { height: 100px; }
 .csf2-fire--l { left: -8px; }
 .csf2-fire--r { right: -8px; }
 .csf2-bottom { flex-direction: column; align-items: flex-start; padding: 14px 16px; }
 .csf2-topline { left: 16px; right: 16px; }
}
