/**
 * Оформление темы. Собрано из утверждённых макетов.
 *
 * Mobile-first: базовые правила без медиазапросов рассчитаны на узкий экран,
 * расширения идут через min-width. max-width не используем.
 */

/* ===== Токены: Стекло · сирень ===== */

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--tx); line-height:1.55;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
	font-size:16px; overflow-x:clip; -webkit-tap-highlight-color:transparent; }
/* Цветные пятна привязаны к колонке контента, а не к краям экрана:
   на широком мониторе проценты разносят их по углам, и середина пустеет.
   clamp держит их на расстоянии не больше половины предельной ширины. */
body::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
	background:
		radial-gradient(44rem 34rem at clamp(4rem, 18vw, 30rem) -4rem,
			color-mix(in srgb,var(--acc) 42%,transparent), transparent 62%),
		radial-gradient(40rem 32rem at calc(100% - clamp(4rem, 18vw, 30rem)) 4rem,
			color-mix(in srgb,#db2777 30%,transparent), transparent 62%),
		var(--bg); }
a { color:inherit; text-decoration:none; }
h1,h2,h3 { margin:0; line-height:1.25; letter-spacing:-.01em; }
img { max-width:100%; }

/* ===== Каркас: контент не растягивается шире 1600 ===== */
.wrap { width:100%; max-width:var(--max); margin-inline:auto; padding-inline:.85rem; }
.main { display:grid; gap:.9rem; padding-block:.9rem; }
.main > *, .main__c > * { min-width:0; }
@media (min-width:1000px){
	.wrap { padding-inline:1.5rem; }
	.main { grid-template-columns:minmax(0,1fr) 22rem; align-items:start; gap:1.1rem; }
	/* На главной сайдбар слева — как на макете-референсе владельца, тут
	   это навигация по разделам, а не «доп. материалы» у одной страницы.
	   order переставляет колонки местами, но не их ширину: без второй
	   строки узкая колонка (22rem) осталась бы первой, а широкая —
	   там, где сейчас сайдбар, и получалось бы ровно наоборот. */
	.home .main { grid-template-columns:22rem minmax(0,1fr); }
	.home .main__c { order:2; }
	.home .main__s { order:1; }
	.main__c { display:grid; gap:1.1rem; min-width:0; }
	.main__s { display:grid; gap:1.1rem; position:sticky; top:8.4rem; min-width:0; }
	.main__s > * { min-width:0; }
}

/* ===== Навигация ===== */
.nav { position:sticky; top:0; z-index:60; border-bottom:1px solid var(--line);
	background:color-mix(in srgb,var(--bg) 88%,transparent); backdrop-filter:blur(16px); }
.nav__in { display:flex; align-items:center; gap:.9rem; height:3.3rem; }
.logo { font-weight:800; font-size:1.05rem; letter-spacing:-.03em; }
.logo b { color:var(--acc); }
.nav__l { display:none; gap:1.1rem; font-size:.88rem; color:var(--tx2); }
.nav__l a:hover { color:var(--tx); }
.nav__r { margin-left:auto; display:flex; align-items:center; gap:.5rem; }
.age { font-size:.68rem; font-weight:700; color:var(--tx2); border:1px solid var(--line);
	border-radius:999px; padding:.15rem .5rem; }
.icb { width:2.4rem; height:2.4rem; display:grid; place-items:center; border:1px solid var(--line);
	border-radius:var(--r-sm); background:transparent; color:var(--tx); cursor:pointer; transition:.15s; }
.icb:hover { border-color:var(--acc); }
.icb:active { transform:scale(.94); }
.burger i { position:relative; display:block; width:16px; height:2px; background:currentColor; border-radius:2px; transition:background .2s; }
.burger i::before,.burger i::after { content:""; position:absolute; left:0; width:16px; height:2px;
	background:currentColor; border-radius:2px; transition:transform .28s cubic-bezier(.2,.7,.3,1); }
.burger i::before { top:-5px; } .burger i::after { top:5px; }
[data-open] .burger i { background:transparent; }
[data-open] .burger i::before { transform:translateY(5px) rotate(45deg); }
[data-open] .burger i::after { transform:translateY(-5px) rotate(-45deg); }
@media (min-width:1000px){ .nav__l { display:flex; } .nav .burger { display:none; } }

.menu { position:fixed; inset:0; z-index:70; visibility:hidden; transition:visibility 0s .3s; }
.menu__v { position:absolute; inset:0; background:rgba(8,4,20,.7); backdrop-filter:blur(4px); opacity:0; transition:opacity .28s; }

/* Панель едет от края экрана и занимает его целиком по высоте: список
   разделов и видов спорта в маленькую карточку не помещается. */
.menu__p { position:absolute; top:0; right:0; bottom:0; width:min(21rem,88vw); overflow-y:auto;
	padding:.7rem .85rem 1.4rem; background:var(--bg2); border-left:1px solid var(--line);
	transform:translateX(100%); transition:transform .3s cubic-bezier(.2,.7,.3,1); }
.menu__top { display:flex; align-items:center; justify-content:space-between; margin:0 0 .6rem; }
.menu__logo { font-weight:800; font-size:1rem; letter-spacing:-.03em; }
.menu__x { position:relative; display:block; width:14px; height:14px; }
.menu__x::before, .menu__x::after { content:""; position:absolute; top:6px; left:0; width:14px; height:2px;
	background:currentColor; border-radius:2px; }
.menu__x::before { transform:rotate(45deg); } .menu__x::after { transform:rotate(-45deg); }

.menu__h { margin:.9rem 0 .3rem; font-size:.7rem; font-weight:700; letter-spacing:.08em;
	text-transform:uppercase; color:var(--tx2); }
.menu__l { display:grid; gap:.1rem; }
.menu a { display:flex; align-items:center; gap:.6rem; padding:.65rem .7rem; border-radius:var(--r-sm); font-weight:600; }
.menu a:hover, .menu a[aria-current="page"] { background:color-mix(in srgb,var(--acc) 14%,transparent); }
.menu a em { margin-left:auto; font-style:normal; font-size:.72rem; padding:.1rem .4rem; border-radius:999px;
	background:var(--surf2); color:var(--tx2); }
.menu__l--plain a { font-weight:500; color:var(--tx2); }
.menu__l--plain a:hover { color:var(--tx); }

/* Раскрывающийся раздел: на телефоне виды спорта не должны отодвигать
   всё остальное за нижний край. */
.menu__d { margin:.9rem 0 0; }
.menu__d > summary { display:flex; align-items:center; gap:.5rem; padding:.55rem .7rem; cursor:pointer;
	border-radius:var(--r-sm); font-size:.7rem; font-weight:700; letter-spacing:.08em;
	text-transform:uppercase; color:var(--tx2); list-style:none; }
.menu__d > summary::-webkit-details-marker { display:none; }
.menu__d > summary::after { content:""; margin-left:auto; width:.4rem; height:.4rem;
	border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
	transform:rotate(45deg) translateY(-2px); transition:transform .2s; }
.menu__d[open] > summary::after { transform:rotate(225deg) translateY(-1px); }
.menu__d > summary:hover { color:var(--tx); background:var(--surf); }
.menu__d > summary em { margin-left:0; font-style:normal; letter-spacing:0; }
.menu__legal { margin:1.2rem 0 0; padding-top:.8rem; border-top:1px solid var(--line);
	font-size:.72rem; color:var(--tx2); }

/* Открытое состояние: класс ставится на body, поэтому панель не зависит
   от места в разметке. */
[data-open] .menu { visibility:visible; transition-delay:0s; }
[data-open] .menu__v { opacity:1; }
[data-open] .menu__p { transform:translateX(0); }
[data-open] { overflow:hidden; }

/* ===== Хлебные крошки ===== */
.crumbs { display:flex; gap:.4rem; flex-wrap:wrap; font-size:.75rem; color:var(--tx2); padding-top:.7rem; }
.crumbs a:hover { color:var(--tx); }
.crumbs i { font-style:normal; opacity:.5; }

/* ===== Шапка матча ===== */
.hero { margin-top:.7rem; padding:1rem; border:1px solid var(--line); border-radius:var(--r);
	background:var(--surf); backdrop-filter:blur(18px); }
.hero__top { display:flex; align-items:center; gap:.5rem; font-size:.78rem; color:var(--tx2); flex-wrap:wrap; }
.live { display:inline-flex; align-items:center; gap:.35rem; color:var(--up); font-weight:700; }
.soon { color:var(--acc); font-weight:700; font-variant-numeric:tabular-nums; }
.done { color:var(--tx2); font-weight:700; }
[data-adhero]:not(:empty) { margin-top:.7rem; }
.bb-ad--hero { min-height:5rem; }
.dot { width:7px; height:7px; border-radius:50%; background:currentColor; animation:pulse 1.8s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.25;transform:scale(.7)} }
h1 { font-size:1.35rem; margin:.7rem 0 .2rem; }
.hero__sub { font-size:.8rem; color:var(--tx2); }
.score { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:.6rem;
	margin-top:.9rem; padding-bottom:1.3rem; text-align:center; }
.tm { display:flex; flex-direction:column; align-items:center; gap:.45rem; }
/* Значок команды в шапке матча: круглый и крупнее обычного значка сущности. */
.score .bb-mark { width:2.8rem; height:2.8rem; border-radius:50%; display:grid; place-items:center; font-weight:800;
	font-size:.85rem; background:color-mix(in srgb,var(--acc) 20%,var(--line)); flex:none;
	transition:transform .3s cubic-bezier(.2,.7,.3,1); }
.tm:hover .bb-mark { transform:scale(1.08) rotate(-3deg); }
.tm b { font-size:.95rem; }
/* Подпись под счётом выведена из потока: иначе она поднимает цифры
   и названия команд оказываются ниже них. */
.sc { position:relative; font-family:var(--num); font-size:2rem; font-weight:800; letter-spacing:-.02em; line-height:1.1; }
.sc small { position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:.3rem; white-space:nowrap;
	text-decoration:none; font-family:inherit; font-size:.72rem; color:var(--tx2); font-weight:400; letter-spacing:0; }
.goals { display:flex; flex-wrap:wrap; gap:.5rem 1.2rem; margin-top:.8rem; padding-top:.7rem;
	border-top:1px solid var(--line); font-size:.78rem; color:var(--tx2); }
.goals b { color:var(--tx); font-weight:600; }
@media (min-width:1000px){
	h1 { font-size:1.9rem; }
	.tm { flex-direction:row; gap:.6rem; }
	.tm:first-child { justify-content:flex-end; }
	.tm:last-child { justify-content:flex-start; }
	.score .bb-mark { width:3.2rem; height:3.2rem; }
	.tm b { font-size:1.15rem; }
	.sc { font-size:2.6rem; }
}

/* ===== Выпадающий список видов спорта =====
   Пункт шапки, а не отдельная полоса: полоса отбирала высоту у первого
   экрана и спорила с бегущей строкой. Открывается наведением и с
   клавиатуры — без скриптов, поэтому работает всегда. */
.drop { position:relative; }
.drop__b { display:inline-flex; align-items:center; gap:.35rem; padding:0; font:inherit; font-size:.88rem;
	color:var(--tx2); background:none; border:0; cursor:pointer; transition:color .2s; }
.drop__b:hover, .drop:focus-within .drop__b, .drop__b[aria-expanded="true"] { color:var(--tx); }
.drop__b i { width:.36rem; height:.36rem; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
	transform:rotate(45deg) translate(-1px,-1px); transition:transform .2s; }
.drop__b[aria-expanded="true"] i, .drop:hover .drop__b i { transform:rotate(225deg) translate(-2px,-2px); }

.drop__p { position:absolute; top:calc(100% + .7rem); left:-.6rem; z-index:70; width:min(30rem,80vw);
	padding:.5rem; background:var(--bg2); border:1px solid var(--line); border-radius:var(--r);
	box-shadow:0 18px 40px rgba(8,4,20,.45); opacity:0; visibility:hidden;
	transform:translateY(-.4rem); transition:opacity .18s ease, transform .18s ease, visibility 0s .18s; }
/* Мостик до панели: без него курсор «проваливается» в зазор и меню закрывается. */
.drop__p::before { content:""; position:absolute; left:0; right:0; top:-.7rem; height:.7rem; }
.drop:hover .drop__p, .drop:focus-within .drop__p, .drop__b[aria-expanded="true"] + .drop__p {
	opacity:1; visibility:visible; transform:translateY(0); transition-delay:0s; }

.drop__g { display:grid; gap:.15rem; }
@media (min-width:640px) { .drop__g { grid-template-columns:1fr 1fr; } }

.drop__i { display:flex; align-items:center; gap:.55rem; padding:.5rem .55rem; border-radius:var(--r-sm);
	transition:background .16s; }
.drop__i:hover { background:color-mix(in srgb,var(--acc) 14%,transparent); }
.drop__i.is-on { background:color-mix(in srgb,var(--acc) 20%,transparent); }
.drop__t { display:grid; min-width:0; }
.drop__t b { font-size:.9rem; font-weight:600; }
.drop__t small { font-size:.72rem; color:var(--tx2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.drop__i em { margin-left:auto; font-style:normal; font-size:.72rem; padding:.1rem .4rem; border-radius:999px;
	background:var(--surf2); color:var(--tx2); }
.drop__i.is-on em { background:var(--acc); color:var(--on-acc); }

/* ===== Поиск в шапке ===== */
.hsearch { display:flex; align-items:center; }
.hsearch input { width:100%; height:2.4rem; padding:0 .7rem; font:inherit; font-size:.85rem;
	color:var(--tx); background:var(--surf); border:1px solid var(--line); border-radius:999px 0 0 999px;
	border-right:0; outline:none; transition:border-color .2s, background .2s; }
.hsearch input::placeholder { color:var(--tx2); }
.hsearch input:focus { border-color:var(--acc); background:var(--surf2); }
.hsearch button { display:grid; place-items:center; width:2.4rem; height:2.4rem; flex:0 0 auto;
	background:var(--surf); border:1px solid var(--line); border-left:0; border-radius:0 999px 999px 0;
	color:var(--tx2); cursor:pointer; transition:color .2s, border-color .2s; }
.hsearch button:hover { color:var(--tx); border-color:var(--acc); }
.hsearch input:focus + button { border-color:var(--acc); }
/* Значок лупы рисуем сами: иконочный шрифт ради одной иконки не нужен. */
.hsearch button i { width:.72rem; height:.72rem; border:1.6px solid currentColor; border-radius:50%; position:relative; }
.hsearch button i::after { content:""; position:absolute; right:-.34rem; bottom:-.24rem; width:.34rem; height:1.6px;
	background:currentColor; transform:rotate(45deg); border-radius:2px; }

/* В шапке поиск появляется только там, где есть место. */
.hsearch--head { display:none; width:13rem; }
.hsearch--menu { margin:.15rem 0 .8rem; }
@media (min-width:1100px) { .hsearch--head { display:flex; } }

/* Подпись только для читалок: на экране её нет, в дереве доступности есть. */
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* ===== Ссылка «к содержимому» ===== */
.skip { position:absolute; left:-9999px; top:0; z-index:100; padding:.7rem 1rem; border-radius:0 0 var(--r-sm) 0;
	background:var(--acc); color:var(--on-acc); font-weight:600; }
.skip:focus { left:0; }

/* ===== Официальная трансляция =====
   Окно похоже на плеер, но честно: видео здесь не откроется, права
   у правообладателя. Поэтому кнопка — переход, а не «play». */
/* Одна колонка: без этого блок подхватывает сетку соседей и плеер,
   пояснение и список каналов встают в ряд, наезжая друг на друга. */
.bb-bcast { display:grid; gap:.85rem; }
.bb-bcast__s { position:relative; display:grid; place-items:center; gap:.7rem; padding:2.2rem 1rem;
	background:linear-gradient(160deg,color-mix(in srgb,var(--acc) 22%,var(--bg2)),var(--bg));
	border:1px solid var(--line); border-radius:var(--r); text-align:center; overflow:hidden; }
.bb-bcast__p { font-size:.82rem; font-weight:600; color:var(--tx2); }
.bb-bcast__go { display:grid; place-items:center; gap:.6rem; }
.bb-bcast__play { display:grid; place-items:center; width:4.2rem; height:4.2rem; border-radius:50%;
	background:var(--acc); box-shadow:0 10px 30px color-mix(in srgb,var(--acc) 45%,transparent);
	transition:transform .2s cubic-bezier(.2,.7,.3,1), box-shadow .2s; }
.bb-bcast__play::after { content:""; width:0; height:0; margin-left:.35rem;
	border-left:1.15rem solid var(--on-acc); border-top:.72rem solid transparent; border-bottom:.72rem solid transparent; }
.bb-bcast__go:hover .bb-bcast__play { transform:scale(1.07); box-shadow:0 14px 38px color-mix(in srgb,var(--acc) 60%,transparent); }
.bb-bcast__go:active .bb-bcast__play { transform:scale(.97); }
.bb-bcast__play--off { background:var(--surf2); box-shadow:none; }
.bb-bcast__play--off::after { border-left-color:var(--tx2); }
.bb-bcast__t { font-size:1rem; font-weight:700; color:var(--tx); }
.bb-bcast__k { font-size:.78rem; color:var(--tx2); font-family:var(--num); }
.bb-bcast__n { margin:.7rem 0 0; font-size:.82rem; line-height:1.55; color:var(--tx2); }
.bb-bcast .bb-list { margin-top:.8rem; }

@media (prefers-reduced-motion: reduce) { .bb-bcast__play { transition:none; } }

/* ===== Вкладки подстраниц ===== *//* ===== Вкладки подстраниц ===== */
.tabs { position:sticky; top:3.3rem; z-index:50; border-bottom:1px solid var(--line);
	background:color-mix(in srgb,var(--bg) 90%,transparent); backdrop-filter:blur(16px); }
.tabs__in { display:flex; gap:.15rem; overflow-x:auto; scrollbar-width:none; }
.tabs__in::-webkit-scrollbar { display:none; }
.tab { position:relative; white-space:nowrap; padding:.8rem .8rem; font-size:.88rem; font-weight:600;
	color:var(--tx2); background:none; border:0; font-family:inherit; cursor:pointer; transition:color .2s; }
.tab em { font-style:normal; font-size:.7rem; margin-left:.3rem; padding:.05rem .3rem; border-radius:999px;
	background:var(--surf2); color:var(--tx2); }
.tab::after { content:""; position:absolute; left:.8rem; right:.8rem; bottom:-1px; height:2px; background:var(--acc);
	transform:scaleX(0); transform-origin:left; transition:transform .3s cubic-bezier(.2,.7,.3,1); }
.tab:hover { color:var(--tx); }
.tab[aria-selected="true"] { color:var(--tx); }
.tab[aria-selected="true"]::after, .tab:hover::after { transform:scaleX(1); }

/* ===== Карточки ===== */
.bb-card { min-width:0; background:var(--surf); border:1px solid var(--line); border-radius:var(--r);
	padding:.9rem; backdrop-filter:blur(18px); }
.bb-card__h { font-size:1rem; margin-bottom:.75rem; display:flex; align-items:baseline; gap:.6rem; }
.bb-card__x { margin-left:auto; font-size:.74rem; font-weight:400; color:var(--tx2); }
.bb-card__x a:hover { color:var(--acc); }
.bb-note { font-size:.72rem; color:var(--tx2); }
.bb-legal { margin:.7rem 0 0; font-size:.68rem; color:var(--tx2); line-height:1.45; }

/* ===== Реклама ===== */
.bb-ad { display:grid; place-items:center; align-content:center; gap:.15rem; text-align:center;
	border:1px dashed color-mix(in srgb,var(--line) 70%,var(--tx2)); border-radius:var(--r);
	background:color-mix(in srgb,var(--bg2) 55%,transparent); color:var(--tx2); font-size:.7rem; padding:.7rem; }
.bb-ad b { color:var(--tx); font-size:.76rem; }
.bb-ad--top { min-height:5rem; }
.bb-ad--side { min-height:15rem; }
.bb-ad--inline { min-height:4.5rem; }
.bb-ad img { display:block; max-width:100%; height:auto; border-radius:var(--r-sm); }
.bb-ad__l { display:block; margin-top:.3rem; font-size:.66rem; color:var(--tx2); }

/* Устройство решают стили: на сервере его определять нельзя — ответ
   попадёт в кеш и достанется не тому посетителю. */
.bb-ad--desktop { display:none; }
@media (min-width:768px) {
	.bb-ad--desktop { display:grid; }
	.bb-ad--mobile { display:none; }
}

/* ===== Партнёрская кнопка ===== */
.bb-bet { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.35rem; min-height:2.2rem;
	padding:0 .75rem; border-radius:var(--r-sm); background:var(--acc); color:var(--on-acc);
	font-size:.8rem; font-weight:700; white-space:nowrap; transition:filter .15s,transform .12s; }
.bb-bet:hover { filter:brightness(1.1); }
.bb-bet:active { transform:scale(.95); }
.bb-bet__i { width:1rem; height:1rem; flex:none; background:currentColor; display:none;
	-webkit-mask:var(--ic) center/contain no-repeat; mask:var(--ic) center/contain no-repeat;
	--ic:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h13M13 6l6 6-6 6"/></svg>'); }
.bb-bet--sm { min-height:1.9rem; padding:0 .55rem; font-size:.74rem; }
.bb-bet--wide { display:flex; width:100%; min-height:2.5rem; margin-top:.6rem; }
.bb-bet--odd { font-family:var(--num); }
/* на узком экране — только иконка */
@media (max-width:999px){
	.bb-tbl .bb-bet, .bb-rate .bb-bet { padding:0; width:2.2rem; }
	.bb-tbl .bb-bet__t, .bb-rate .bb-bet__t { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
	.bb-tbl .bb-bet__i, .bb-rate .bb-bet__i { display:block; }
}

/* ===== Быстрые коэффициенты ===== */
.bb-quick { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; }
.bb-quick__i { display:grid; place-items:center; align-content:center; gap:.1rem; min-height:4rem;
	border:1px solid var(--line); border-radius:var(--r-sm); background:color-mix(in srgb,var(--surf2) 60%,transparent);
	transition:.16s; }
.bb-quick__i:hover { border-color:var(--acc); background:color-mix(in srgb,var(--acc) 12%,transparent); }
.bb-quick__i:active { transform:scale(.97); }
.bb-quick__i i { font-style:normal; font-size:.72rem; color:var(--tx2); }
.bb-quick__i u { text-decoration:none; font-family:var(--num); font-size:1.3rem; font-weight:800; }
.bb-quick__i small { text-decoration:none; font-size:.68rem; color:var(--tx2); }

/* ===== Таблица коэффициентов ===== */
.bb-mtabs { display:flex; gap:.3rem; overflow-x:auto; scrollbar-width:none; margin-bottom:.7rem; }
.bb-mtabs::-webkit-scrollbar { display:none; }
.bb-mtab { white-space:nowrap; padding:.4rem .7rem; border-radius:999px; border:1px solid var(--line);
	background:transparent; color:var(--tx2); font:inherit; font-size:.78rem; font-weight:600; cursor:pointer; transition:.15s; }
.bb-mtab:hover { color:var(--tx); }
.bb-mtab.is-on { background:var(--acc); border-color:var(--acc); color:var(--on-acc); }
.bb-scroll { overflow-x:auto; }
.bb-tbl { width:100%; border-collapse:collapse; font-size:.85rem; }
.bb-tbl th { font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--tx2);
	font-weight:600; padding:.4rem .35rem; text-align:center; white-space:nowrap; }
.bb-tbl th[data-sort] { cursor:pointer; user-select:none; }
.bb-tbl th[data-sort]:hover { color:var(--acc); }
.bb-tbl th em { font-style:normal; margin-left:.15rem; color:var(--acc); }
.bb-tbl td { padding:.4rem .35rem; border-top:1px solid var(--line); text-align:center; }
.bb-tbl__bk { text-align:left !important; }
.bb-bk { display:flex; align-items:center; gap:.5rem; }
.bb-bk b { font-size:.85rem; display:block; }
.bb-bk small { text-decoration:none; font-size:.68rem; color:var(--tx2); display:block; }
.bb-mark { width:1.8rem; height:1.8rem; border-radius:var(--r-sm); display:grid; place-items:center; flex:none;
	font-size:.7rem; font-weight:800; background:color-mix(in srgb,var(--acc) 20%,var(--line)); }
.bb-mark--sm { width:1.5rem; height:1.5rem; font-size:.6rem; }
.bb-mark--lg { width:2.6rem; height:2.6rem; font-size:.9rem; }
/* Настоящий логотип турнира/команды — сам по себе картинка на прозрачном
   фоне (герб клуба, эмблема лиги), фирменный кружок под ним только мешает
   и его дублирует (запрос владельца: «они без фона должны быть»). Кружок
   остаётся только у запасного варианта — инициалов без логотипа. */
.bb-mark--img { background:none; }
.bb-mark--img img { width:100%; height:100%; border-radius:inherit; object-fit:contain; display:block; }
/* Значок вида спорта (мяч, шайба) — свой цвет акцента поверх обычного
   кружка инициалов, без картинки. */
.bb-mark--icon { color:var(--acc); background:color-mix(in srgb, currentColor 16%, var(--surf2)); }
.bb-mark--icon svg { width:62%; height:62%; display:block; }
/* Свой цвет на вид спорта — единым фиолетовым все значки сливались
   в кучу, в рефересе владельца у каждого свой (запрос «лого цветные»). */
.bb-ic--football   { color:#3ddc84; }
.bb-ic--hockey      { color:#9aa7b8; }
.bb-ic--tennis      { color:#d3e34a; }
.bb-ic--basketball  { color:#ff9a3d; }
.bb-ic--esports     { color:#c774f2; }
.bb-ic--volleyball  { color:#5ec8f2; }
.bb-cell { display:inline-grid; place-items:center; min-width:3rem; min-height:2rem; padding:0 .35rem;
	border-radius:var(--r-sm); font-family:var(--num); font-weight:700; position:relative;
	background:color-mix(in srgb,var(--surf2) 70%,transparent); transition:.15s; }
.bb-cell:hover { background:color-mix(in srgb,var(--acc) 18%,transparent); }
.bb-cell:active { transform:scale(.95); }
.bb-cell.is-best { color:var(--acc); box-shadow:inset 0 0 0 1px var(--acc);
	background:color-mix(in srgb,var(--acc) 15%,transparent); }
.bb-cell.is-up::after,.bb-cell.is-down::after { content:""; position:absolute; top:.2rem; right:.25rem;
	border:3px solid transparent; }
.bb-cell.is-up::after { border-bottom-color:var(--up); }
.bb-cell.is-down::after { border-top-color:var(--down); top:auto; bottom:.2rem; }
.bb-tbl__m { font-family:var(--num); color:var(--tx2); font-size:.78rem; }
.bb-tblfoot { display:flex; align-items:center; gap:.7rem; margin-top:.6rem; font-size:.72rem; color:var(--tx2); flex-wrap:wrap; }
.bb-upd { display:inline-flex; align-items:center; gap:.35rem; }
.bb-upd .bb-dot { width:6px; height:6px; border-radius:50%; background:var(--up); display:inline-block;
	animation:pulse 1.8s ease-in-out infinite; }
.bb-erid { margin-left:auto; background:none; border:1px solid var(--line); border-radius:999px;
	color:var(--tx2); font:inherit; font-size:.7rem; padding:.15rem .6rem; cursor:pointer; }
.bb-erid:hover { border-color:var(--acc); color:var(--tx); }

/* ===== Рейтинг ===== */
.bb-rate { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,1fr); gap:.35rem; }
.bb-rate__r { min-width:0; display:flex; align-items:center; gap:.5rem; padding:.45rem; border-radius:var(--r-sm);
	transition:background .15s; }
.bb-rate__r:hover { background:color-mix(in srgb,var(--acc) 9%,transparent); }
.bb-rate__r i { font-style:normal; width:1rem; font-size:.75rem; color:var(--tx2); font-variant-numeric:tabular-nums; }
.bb-rate__n { flex:1; min-width:0; }
.bb-rate__n b { display:block; font-size:.86rem; }
.bb-rate__n small { display:block; text-decoration:none; font-size:.68rem; color:var(--tx2);
	white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bb-rate__r u { text-decoration:none; font-family:var(--num); font-weight:700; color:var(--acc); font-size:.9rem; }

/* ===== Бонус ===== */
.bb-bonus { display:flex; align-items:center; gap:.7rem; }
.bb-bonus b { display:block; font-size:1rem; }
.bb-bonus small { display:block; text-decoration:none; font-size:.75rem; color:var(--tx2); }

/* ===== AI прогноз ===== */
.bb-ai { display:grid; gap:.7rem; }
.bb-ai__badge { display:inline-block; font-size:.7rem; color:var(--acc); border:1px solid color-mix(in srgb,var(--acc) 45%,transparent);
	border-radius:999px; padding:.15rem .6rem; justify-self:start; }
.bb-ai__bet { padding:.7rem; border:1px solid var(--line); border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 50%,transparent); }
.bb-ai__head { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.bb-ai__head b { font-size:.92rem; flex:1; min-width:9rem; }
.bb-ai__bet p { margin:.5rem 0 .3rem; font-size:.84rem; color:var(--tx); }
.bb-ai__bet small { text-decoration:none; font-size:.72rem; color:var(--tx2); }
.bb-conf { position:relative; height:.35rem; border-radius:999px; background:var(--surf2); margin-top:.6rem; }
.bb-conf span { position:absolute; inset:0 auto 0 0; border-radius:999px; background:var(--acc); }
.bb-conf i { position:absolute; right:0; top:.6rem; font-style:normal; font-size:.68rem; color:var(--tx2); }
.bb-ai__alt,.bb-upd8 { padding:.7rem; border-radius:var(--r-sm); border:1px dashed var(--line); }
.bb-ai__alt b,.bb-upd8 b { display:block; font-size:.86rem; margin-bottom:.3rem; }
.bb-ai__alt p { margin:0; font-size:.83rem; color:var(--tx2); }
.bb-upd8 p { margin:.25rem 0 0; font-size:.78rem; color:var(--tx2); }
.bb-upd8 i { font-style:normal; color:var(--acc); margin-right:.3rem; }

/* ===== Прогнозы пользователей ===== */
.bb-up { display:grid; gap:.55rem; }
.bb-up__i { padding:.65rem; border:1px solid var(--line); border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 45%,transparent); }
.bb-up__h { display:flex; align-items:center; gap:.45rem; font-size:.78rem; }
.bb-up__h small { text-decoration:none; color:var(--tx2); }
.bb-up__bet { margin-left:auto; font-family:var(--num); font-weight:700; color:var(--acc); }
.bb-up__i p { margin:.45rem 0 0; font-size:.84rem; }

/* ===== Калькулятор ===== */
.bb-calc { display:grid; gap:.5rem; }
.bb-calc label { display:grid; gap:.2rem; font-size:.76rem; color:var(--tx2); }
.bb-calc input { font:inherit; font-family:var(--num); font-size:.95rem; padding:.5rem .6rem; color:var(--tx);
	background:color-mix(in srgb,var(--surf2) 60%,transparent); border:1px solid var(--line); border-radius:var(--r-sm); }
.bb-calc input:focus-visible { outline:2px solid var(--acc); outline-offset:1px; }
.bb-calc__out { display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.6rem .7rem;
	border-radius:var(--r-sm); background:color-mix(in srgb,var(--acc) 14%,transparent); font-size:.82rem; }
.bb-calc__out b { font-family:var(--num); font-size:1.15rem; }

/* ===== Опрос ===== */
.bb-poll { display:grid; gap:.35rem; }
.bb-poll__r { display:flex; align-items:center; gap:.6rem; padding:.45rem .55rem; border-radius:var(--r-sm);
	border:1px solid var(--line); background:transparent; color:inherit; font:inherit; font-size:.82rem; cursor:pointer; }
.bb-poll__r:hover { border-color:var(--acc); }
.bb-poll__r i { font-style:normal; width:5rem; text-align:left; }
.bb-poll__r span { flex:1; height:.4rem; border-radius:999px; background:var(--surf2); overflow:hidden; }
.bb-poll__r small { display:block; height:100%; background:var(--acc); }
.bb-poll__r u { text-decoration:none; font-family:var(--num); font-size:.78rem; color:var(--tx2); }

/* ===== Списки ===== */
.bb-list { display:grid; grid-template-columns:minmax(0,1fr); gap:.3rem; }
.bb-list__i { min-width:0; display:flex; align-items:center; gap:.6rem; padding:.45rem .5rem; border-radius:var(--r-sm);
	border:1px solid transparent; transition:.15s; }
.bb-list__i:hover { border-color:var(--line); background:color-mix(in srgb,var(--surf2) 50%,transparent); }
.bb-list__t { width:3.2rem; flex:none; }
.bb-list__t b { display:block; font-size:.8rem; font-family:var(--num); }
.bb-list__t small { display:block; text-decoration:none; font-size:.66rem; color:var(--tx2); }
.bb-list__p { flex:1; font-size:.85rem; min-width:0; }
.bb-list__o { display:flex; gap:.25rem; }
.bb-list__o i { font-style:normal; font-family:var(--num); font-size:.74rem; padding:.15rem .35rem;
	border-radius:6px; background:var(--surf2); color:var(--tx2); }

/* ===== Таблица лиги ===== */
.bb-lg { width:100%; table-layout:fixed; border-collapse:collapse; font-size:.8rem; }
.bb-lg th { font-size:.66rem; text-transform:uppercase; color:var(--tx2); font-weight:600; padding:.3rem .35rem; text-align:left; }
.bb-lg td { padding:.32rem .35rem; border-top:1px solid var(--line); }
.bb-lg tr.is-me { background:color-mix(in srgb,var(--acc) 10%,transparent); }
.bb-form { display:flex; gap:.15rem; }
.bb-form i { font-style:normal; width:1.05rem; height:1.05rem; display:grid; place-items:center; border-radius:4px;
	font-size:.6rem; font-weight:700; background:var(--surf2); }
.bb-form .f-В { background:color-mix(in srgb,var(--up) 35%,transparent); }
.bb-form .f-П { background:color-mix(in srgb,var(--down) 35%,transparent); }

/* ===== H2H, статистика ===== */
.bb-h2h__sum { display:flex; gap:.5rem; align-items:baseline; font-size:.8rem; color:var(--tx2); margin-bottom:.5rem; }
.bb-h2h__s { font-family:var(--num); font-weight:700; }
.bb-seg { display:inline-flex; gap:.15rem; padding:.2rem; margin-bottom:.7rem; border:1px solid var(--line);
	border-radius:999px; background:color-mix(in srgb,var(--surf2) 50%,transparent); }
.bb-seg button { border:0; background:none; color:var(--tx2); font:inherit; font-size:.76rem; font-weight:600;
	padding:.3rem .7rem; border-radius:999px; cursor:pointer; transition:.15s; }
.bb-seg button.is-on { background:var(--acc); color:var(--on-acc); }
.bb-stats { display:grid; gap:.5rem; }
.bb-stats__r { display:grid; grid-template-columns:2.6rem 1fr 2.6rem; align-items:center; gap:.5rem;
	font-family:var(--num); font-size:.85rem; }
.bb-stats__n { font-family:inherit; font-size:.74rem; color:var(--tx2); text-align:center; }
.bb-stats__n i { display:block; height:.3rem; margin-top:.25rem; border-radius:999px; background:color-mix(in srgb,var(--down) 45%,transparent); overflow:hidden; }
.bb-stats__n small { display:block; height:100%; background:var(--acc); }

/* ===== Составы ===== */
.bb-lu { display:grid; gap:.9rem; }
@media (min-width:760px){ .bb-lu { grid-template-columns:1fr 1fr; } }
.bb-lu__h { display:flex; align-items:baseline; gap:.5rem; margin-bottom:.4rem; }
.bb-lu__h small { text-decoration:none; font-size:.72rem; color:var(--tx2); }
.bb-lu__l { list-style:none; margin:0 0 .6rem; padding:0; display:grid; gap:.12rem; }
.bb-lu__l li { display:flex; align-items:center; gap:.5rem; padding:.28rem .4rem; border-radius:6px; font-size:.82rem; }
.bb-lu__l li:hover { background:color-mix(in srgb,var(--surf2) 60%,transparent); }
.bb-lu__l i { font-style:normal; font-family:var(--num); width:1.3rem; color:var(--tx2); font-size:.75rem; }
.bb-lu__l em { font-style:normal; font-size:.62rem; color:var(--tx2); width:1.8rem; }
.bb-lu__l b { flex:1; font-weight:500; }
.bb-lu__l u { text-decoration:none; font-family:var(--num); font-size:.76rem; color:var(--acc); }
.bb-lu__b,.bb-lu__o { font-size:.76rem; color:var(--tx2); margin-bottom:.4rem; }
.bb-lu__b b,.bb-lu__o b { display:block; color:var(--tx); font-size:.8rem; }
.bb-lu__o { color:var(--warn); }

/* ===== Судьи ===== */
.bb-ref { margin:0; display:grid; gap:.4rem; font-size:.82rem; }
.bb-ref > div { display:flex; gap:.6rem; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:.35rem; }
.bb-ref dt { color:var(--tx2); }
.bb-ref dd { margin:0; text-align:right; }

/* ===== Таймлайн и лента ===== */
.bb-tl__bar { position:relative; height:.5rem; border-radius:999px; background:var(--surf2); }
.bb-tl__bar > span { position:absolute; inset:0 auto 0 0; border-radius:999px; background:var(--acc); }
.bb-tl__e { position:absolute; top:50%; width:.6rem; height:.6rem; margin:-.3rem 0 0 -.3rem; border-radius:50%;
	border:2px solid var(--bg); }
.bb-tl__e.is-goal { background:var(--up); }
.bb-tl__e.is-card { background:var(--warn); }
.bb-tl__ax { display:flex; justify-content:space-between; font-size:.68rem; color:var(--tx2); margin-top:.3rem; }
.bb-feed { display:grid; gap:.3rem; max-height:26rem; overflow-y:auto; }
.bb-feed__i { display:flex; gap:.6rem; padding:.45rem .5rem; border-radius:var(--r-sm); font-size:.84rem; }
.bb-feed__i i { font-style:normal; font-family:var(--num); font-size:.75rem; color:var(--tx2); width:2rem; flex:none; }
.bb-feed__i p { margin:0; }
.bb-feed__i.is-goal { background:color-mix(in srgb,var(--up) 14%,transparent); font-weight:600; }
.bb-feed__i.is-card { background:color-mix(in srgb,var(--warn) 12%,transparent); }
.bb-feed__i.is-sub { background:color-mix(in srgb,var(--acc) 10%,transparent); }
.bb-feed__i.is-now { box-shadow:inset 0 0 0 1px var(--acc); }
.bb-live { display:inline-flex; align-items:center; gap:.3rem; color:var(--up); }
.bb-live .bb-dot { width:6px; height:6px; border-radius:50%; background:currentColor; animation:pulse 1.8s infinite; }

/* ===== Отчёт ===== */
.bb-rep__meta { display:flex; gap:.8rem; font-size:.74rem; color:var(--tx2); margin-bottom:.7rem; }
.bb-rep__p { margin:0 0 .7rem; font-size:.92rem; }
.bb-rep__card { display:flex; align-items:center; gap:.6rem; padding:.7rem; border-radius:var(--r-sm);
	border:1px solid var(--line); background:color-mix(in srgb,var(--surf2) 50%,transparent); transition:.15s; }
.bb-rep__card:hover { border-color:var(--acc); }
.bb-rep__card b { flex:1; font-size:.88rem; }
.bb-rep__card u { text-decoration:none; font-family:var(--num); font-weight:800; }
.bb-rep__card em { width:100%; font-style:normal; font-size:.72rem; color:var(--acc); }

/* ===== FAQ ===== */
.bb-faq { display:grid; gap:.3rem; }
.bb-faq__i { border:1px solid var(--line); border-radius:var(--r-sm); padding:.55rem .65rem; }
.bb-faq__i summary { cursor:pointer; font-size:.86rem; font-weight:600; }
.bb-faq__i p { margin:.45rem 0 0; font-size:.83rem; color:var(--tx2); }

/* ===== Ответственная игра и подвал ===== */
.bb-resp { display:flex; gap:.8rem; padding:.9rem; border:1px solid var(--line); border-radius:var(--r);
	background:color-mix(in srgb,var(--bg2) 60%,transparent); }
.bb-resp b { font-size:.9rem; color:var(--warn); }
.bb-resp p { margin:0; font-size:.76rem; color:var(--tx2); }
.foot { border-top:1px solid var(--line); margin-top:1.4rem; padding:1.2rem 0 2.4rem; font-size:.78rem; color:var(--tx2); }
.foot__n { display:flex; flex-wrap:wrap; gap:.7rem 1.2rem; margin-bottom:.7rem; }

/* ===== Панель разработчика: мета и рекламные зоны ===== */


/* ===== Движение: то же, что в выбранном макете ===== */
/* Затухание по краям: без него бегущая строка выглядит обрезанной прямо
   по границе экрана, а не тем, что уходит за край намеренно. */
.tick { overflow:hidden; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--bg2) 70%,transparent);
	-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 2.5rem,#000 calc(100% - 2.5rem),transparent 100%);
	mask-image:linear-gradient(90deg,transparent 0,#000 2.5rem,#000 calc(100% - 2.5rem),transparent 100%); }
.tick__r { display:flex; gap:1.6rem; width:max-content; padding:.4rem 0; font-size:.76rem; color:var(--tx2);
	animation:tick 34s linear infinite; }
.tick:hover .tick__r, .tick:active .tick__r { animation-play-state:paused; }
.tick__i { display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; }
.tick__i u { text-decoration:none; font-family:var(--num); color:var(--tx); }
.tick__i small { text-decoration:none; }
.tick__i small.up { color:var(--up); } .tick__i small.down { color:var(--down); }
@keyframes tick { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* появление блоков при переключении подстраницы */
@keyframes rise { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
[data-col-main] > *, [data-col-side] > *, .duo > * { animation:rise .34s cubic-bezier(.2,.7,.3,1) both; }
[data-col-main] > *:nth-child(2) { animation-delay:.04s; }
[data-col-main] > *:nth-child(3) { animation-delay:.08s; }
[data-col-main] > *:nth-child(4) { animation-delay:.12s; }
[data-col-main] > *:nth-child(n+5) { animation-delay:.16s; }
[data-col-side] > *:nth-child(2) { animation-delay:.06s; }
[data-col-side] > *:nth-child(3) { animation-delay:.1s; }
[data-col-side] > *:nth-child(n+4) { animation-delay:.14s; }

/* карточка приподнимается под курсором, кнопка бонуса «дышит» */
.bb-card { transition:transform .25s cubic-bezier(.2,.7,.3,1), border-color .25s; }
.bb-card:hover { border-color:color-mix(in srgb,var(--acc) 40%,var(--line)); }
@media (hover:hover) and (pointer:fine) { .bb-card:hover { transform:translateY(-2px); } }
@keyframes breathe { 0%,100% { box-shadow:0 0 0 0 color-mix(in srgb,var(--acc) 42%,transparent); }
	50% { box-shadow:0 0 0 .5rem color-mix(in srgb,var(--acc) 0%,transparent); } }
.bb-bet--wide { animation:breathe 2.6s ease-in-out infinite; }
/* коэффициент мигает при изменении */
@keyframes flash { from { background:color-mix(in srgb,var(--acc) 30%,transparent); } }
.bb-cell.is-up, .bb-cell.is-down, .bb-quick__i.is-up, .bb-quick__i.is-down { animation:flash .8s ease; }
.bb-quick__i u { transition:color .3s; }
.bb-quick__i.is-up u { color:var(--up); } .bb-quick__i.is-down u { color:var(--down); }


/* ===== Телефон: базовые размеры (mobile-first, расширения ниже через min-width) ===== */
.wide { display:none; }
.crumbs { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; font-size:.72rem; padding-top:.55rem; }
.crumbs::-webkit-scrollbar { display:none; }
.crumbs a, .crumbs span { white-space:nowrap; }
.hero { margin-top:.55rem; padding:.8rem; }
h1 { font-size:1.2rem; margin:.55rem 0 .15rem; }
.hero__sub { font-size:.76rem; }
.score { margin-top:.7rem; padding-bottom:1.1rem; gap:.4rem; }
.score .bb-mark { width:2.3rem; height:2.3rem; font-size:.72rem; }
.tm b { font-size:.85rem; }
.sc { font-size:1.7rem; }
.sc small { font-size:.68rem; }
.goals { gap:.35rem .9rem; margin-top:.6rem; padding-top:.55rem; font-size:.74rem; }
.bb-card { padding:.8rem; }
/* подсказка, что вкладки листаются вбок; position не трогаем — он sticky */
.tabs::after { content:""; position:absolute; top:0; bottom:0; right:0; width:2.2rem; pointer-events:none;
	background:linear-gradient(to left,var(--bg),transparent); }
.tabs__in { scroll-snap-type:x proximity; }
.tab { scroll-snap-align:start; padding:.75rem .7rem; }
@media (min-width:1000px){
	.wide { display:inline; }
	.tabs::after { display:none; }
	.crumbs { flex-wrap:wrap; overflow:visible; font-size:.75rem; padding-top:.7rem; }
	.hero { margin-top:.7rem; padding:1rem; }
	.hero__sub { font-size:.8rem; }
	.score { margin-top:.9rem; padding-bottom:1.3rem; gap:.6rem; }
	.goals { gap:.5rem 1.2rem; margin-top:.8rem; padding-top:.7rem; font-size:.78rem; }
	.bb-card { padding:.9rem; }
}


/* ===== Телефон: таблица коэффициентов карточками, без прокрутки вбок ===== */
.bb-tbl thead { display:none; }
.bb-tbl, .bb-tbl tbody, .bb-tbl tr, .bb-tbl td { display:block; }
.bb-tbl tr { padding:.6rem; margin-bottom:.5rem; border:1px solid var(--line); border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 40%,transparent);
	display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; }
.bb-tbl td { border:0; padding:0; text-align:center; }
.bb-tbl .bb-tbl__bk { grid-column:1/-1; text-align:left; }
.bb-tbl .bb-tbl__o { display:grid; gap:.2rem; }
.bb-tbl .bb-tbl__o::before, .bb-tbl .bb-tbl__m::before { content:attr(data-col);
	font-size:.62rem; text-transform:uppercase; letter-spacing:.04em; color:var(--tx2); }
.bb-tbl .bb-cell { width:100%; min-height:2.3rem; }
.bb-tbl .bb-tbl__m { grid-column:1/-1; display:flex; align-items:baseline; gap:.4rem;
	font-size:.76rem; padding-top:.15rem; border-top:1px solid var(--line); }
.bb-tbl .bb-tbl__m::before { margin-right:auto; }
.bb-tbl .bb-tbl__go { grid-column:1/-1; }
/* в карточке место есть — возвращаем подпись кнопке */
.bb-tbl .bb-bet { display:flex; width:100%; min-height:2.4rem; }
.bb-tbl .bb-bet__t { position:static; width:auto; height:auto; clip-path:none; }
.bb-tbl .bb-bet__i { display:none; }

/* ===== Телефон: составы по одной команде ===== */
.bb-lu[data-show="home"] [data-team="away"], .bb-lu[data-show="away"] [data-team="home"] { display:none; }
.bb-seg--teams { display:flex; width:100%; }
.bb-seg--teams button { flex:1; }

@media (min-width:1000px){
	/* на десктопе таблица снова таблица */
	.bb-tbl { display:table; }
	.bb-tbl thead { display:table-header-group; }
	.bb-tbl tbody { display:table-row-group; }
	.bb-tbl tr { display:table-row; padding:0; margin:0; border:0; border-radius:0; background:none; }
	.bb-tbl td { display:table-cell; border-top:1px solid var(--line); padding:.4rem .35rem; text-align:center; }
	.bb-tbl .bb-tbl__o::before, .bb-tbl .bb-tbl__m::before { content:none; }
	/* сбрасываем ровно теми же селекторами, что и в карточном виде,
	   иначе правила карточек остаются сильнее */
	.bb-tbl .bb-tbl__bk, .bb-tbl .bb-tbl__o, .bb-tbl .bb-tbl__go { display:table-cell; }
	.bb-tbl .bb-cell { width:auto; min-height:2rem; }
	.bb-tbl td.bb-tbl__m { display:table-cell; gap:0; padding:.4rem .35rem; text-align:center;
		border-top:1px solid var(--line); }
	.bb-tbl th.bb-tbl__m { border:0; }
	.bb-tbl .bb-bet { display:inline-flex; width:auto; min-height:2.2rem; }
	/* обе команды рядом, переключатель не нужен */
	.bb-lu[data-show] [data-team] { display:block; }
	.bb-seg--teams { display:none; }
}


/* ===== Текст посадочной ===== */
.bb-text h2.bb-card__h { font-size:1.05rem; display:block; margin-bottom:.6rem; }
.bb-text p { margin:0 0 .7rem; font-size:.9rem; }
.bb-text p:last-child { margin-bottom:0; }
@media (min-width:1000px){ .bb-text p { font-size:.94rem; } }

/* ===== Боковая навигация: виды спорта и турниры ===== */
.bb-side { display:grid; gap:.2rem; padding:.7rem; border:1px solid var(--line); border-radius:var(--r);
	background:var(--surf); }
.bb-side__sports, .bb-side__leagues { display:grid; gap:.1rem; list-style:none; margin:0; padding:0; }
.bb-side__i { display:flex; align-items:center; gap:.55rem; padding:.45rem .5rem; border-radius:var(--r-sm);
	font-size:.85rem; font-weight:600; transition:.15s; }
.bb-side__i:hover { background:color-mix(in srgb,var(--surf2) 70%,transparent); }
.bb-side__i.is-on { background:color-mix(in srgb,var(--acc) 16%,transparent); color:var(--acc); }
.bb-side__t { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bb-side__n { font-family:var(--num); font-size:.72rem; color:var(--tx2); font-weight:700; }
.bb-side__n--soon { font-family:inherit; font-weight:500; text-transform:uppercase; letter-spacing:.03em;
	font-size:.62rem; opacity:.6; }
.bb-side__h { margin:.7rem .5rem .2rem; font-size:.7rem; font-weight:700; letter-spacing:.06em;
	text-transform:uppercase; color:var(--tx2); }
.bb-side__leagues .bb-side__i { font-weight:500; font-size:.8rem; }
.bb-side__leagues .bb-mark { font-size:.55rem; }

/* ===== Блоки витрин: матчи, прогнозы, бонусы ===== */
/* Ближайшие матчи с полной линией, сгруппированные по турниру */
.bb-mx { display:grid; gap:.9rem; }
.bb-mx__grp { display:grid; gap:.35rem; }
.bb-mx__grph { display:flex; align-items:center; justify-content:space-between; gap:.4rem; padding:.4rem .4rem .4rem .6rem;
	margin-bottom:.1rem; border-radius:var(--r-sm); background:color-mix(in srgb,var(--acc) 12%,var(--surf2)); }
.bb-mx__grpl { display:flex; align-items:baseline; gap:.4rem; min-width:0; flex:1; }
.bb-mx__grph b { font-size:.82rem; }
.bb-mx__grph small { font-size:.7rem; color:var(--tx2); }
a.bb-mx__grpl:hover b { text-decoration:underline; }
/* Скрыть турнир у себя в браузере — личная настройка показа, не трогает
   данные на сервере (JS: initGroupHide в interactions.js). */
.bb-mx__hide { flex:none; width:1.5rem; height:1.5rem; display:grid; place-items:center; padding:0;
	border:none; border-radius:50%; background:transparent; color:var(--tx2); font-size:.7rem;
	line-height:1; cursor:pointer; opacity:.55; transition:.15s; }
.bb-mx__hide:hover { opacity:1; color:var(--down); background:color-mix(in srgb,var(--down) 18%,transparent); }
/* Свёрнутый турнир: полоса заголовка остаётся (метка, что тут что-то
   скрыто), строки матчей — нет. Крестик поворачивается в «+»: тот же
   клик по тому же месту разворачивает обратно. */
.bb-mx__grp.is-collapsed .bb-mx__i { display:none; }
.bb-mx__grp.is-collapsed .bb-mx__grph { margin-bottom:0; opacity:.7; }
.bb-mx__hide[aria-pressed="true"] { opacity:.85; color:var(--acc); background:color-mix(in srgb,var(--acc) 18%,transparent); transform:rotate(45deg); }
.bb-mx__i { display:grid; grid-template-columns:3.4rem minmax(0,1fr); gap:.6rem; align-items:center;
	padding:.5rem; border-radius:var(--r-sm); border:1px solid transparent; transition:.15s; }
.bb-mx__i:hover { border-color:var(--line); background:color-mix(in srgb,var(--surf2) 50%,transparent); }
.bb-mx__w b { display:block; font-family:var(--num); font-size:.82rem; }
.bb-mx__w small { font-size:.64rem; color:var(--tx2); }
.bb-mx__p b { display:block; font-size:.86rem; }
.bb-mx__p small { font-size:.66rem; color:var(--tx2); }
/* Коэффициенты скрыты, пока не нажали «Показать коэффициенты»: витрина
   матчей не обязана быть ещё и линией букмекеров с первого взгляда. */
.bb-mx__o { display:none; grid-template-columns:repeat(3,1fr); gap:.3rem; grid-column:1/-1; }
.bb-mx--odds .bb-mx__o { display:grid; }
/* Ориентировочный коэффициент без разбивки по исходам — просто строка,
   но заметная: жирным и цветом акцента, а не серым мелким текстом
   (запрос владельца: «кэфы выдели жырным»). */
.bb-mx--odds .bb-mx__o--note { display:block; font-family:var(--num); font-size:.82rem; font-weight:700; color:var(--acc); }
.tick__approx { font-family:var(--num); font-weight:700; color:var(--acc); }
.bb-mx__sw { margin-bottom:.6rem; padding:.4rem .8rem; border-radius:999px; border:1px solid var(--line);
	background:var(--surf2); color:var(--tx); font-size:.78rem; font-weight:600; cursor:pointer; transition:.15s; }
.bb-mx__sw:hover { border-color:var(--acc); }
.bb-mx__sw[aria-pressed="true"] { background:var(--acc); color:#fff; border-color:var(--acc); }
.bb-mx__tm { display:inline-flex; gap:.2rem; margin-right:.4rem; vertical-align:middle; }
.bb-mx__p { display:flex; align-items:center; flex-wrap:wrap; gap:0; }
.bb-mx__o i { display:grid; gap:.05rem; justify-items:center; padding:.3rem; border-radius:7px;
	background:color-mix(in srgb,var(--surf2) 70%,transparent); font-style:normal;
	font-family:var(--num); font-size:.78rem; font-weight:700; }
.bb-mx__o em { font-style:normal; font-family:inherit; font-size:.6rem; color:var(--tx2); font-weight:400; }
@media (min-width:1000px){
	.bb-mx__i { grid-template-columns:3.4rem minmax(0,1fr) 15rem; }
	.bb-mx__o { grid-column:auto; }
}

/* ===== Матч дня ===== */
.bb-mod { display:grid; gap:.7rem; padding:.9rem; border-radius:var(--r-sm);
	background:linear-gradient(135deg, color-mix(in srgb,var(--acc) 14%,transparent), transparent 70%);
	border:1px solid color-mix(in srgb,var(--acc) 22%,var(--line)); }
.bb-mod__h { display:flex; align-items:center; gap:.4rem; font-size:.74rem; color:var(--tx2); flex-wrap:wrap; }
.bb-mod__h b { font-size:.78rem; color:var(--tx); }
.bb-mod__h time { margin-left:auto; font-family:var(--num); }
.bb-mod__t { display:flex; align-items:center; justify-content:center; gap:.8rem; padding:.3rem 0; text-align:center; }
.bb-mod__t i { font-style:normal; color:var(--tx2); }
.bb-mod__tm { display:flex; flex-direction:column; align-items:center; gap:.35rem; flex:1; min-width:0; }
.bb-mod__tm .bb-mark { width:2.4rem; height:2.4rem; }
.bb-mod__tm b { font-size:.9rem; }
.bb-mod__o { display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; }
.bb-mod__o span { display:grid; gap:.1rem; justify-items:center; padding:.45rem .3rem; border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 75%,transparent); }
.bb-mod__o em { font-style:normal; font-size:.64rem; color:var(--tx2); }
.bb-mod__o b { font-family:var(--num); font-size:.95rem; color:var(--acc); }
.bb-mod__go { display:block; padding:.5rem; border-radius:var(--r-sm); text-align:center;
	background:var(--acc); color:#fff; font-size:.8rem; font-weight:600; transition:.15s; }
.bb-mod__go:hover { filter:brightness(1.1); }

/* ===== Результаты ===== */
/* Счёт стоит на месте времени начала и крупнее всего остального: в этом
   блоке читатель ищет именно его, а не турнир и не дату. */
.bb-rs { display:grid; gap:.15rem; }
.bb-rs__i { display:grid; grid-template-columns:3.4rem minmax(0,1fr); gap:.6rem; align-items:center;
	padding:.5rem; border-radius:var(--r-sm); border:1px solid transparent; transition:.15s; }
.bb-rs__i:hover { border-color:var(--line); background:color-mix(in srgb,var(--surf2) 50%,transparent); }
.bb-rs__s { font-family:var(--num); font-size:.95rem; font-weight:700; text-align:center; }
.bb-rs__p { display:flex; align-items:center; flex-wrap:wrap; }
.bb-rs__p b { font-size:.86rem; font-weight:600; }
.bb-rs__m { display:flex; gap:.5rem; align-items:baseline; font-size:.68rem; color:var(--tx2); grid-column:2; }
.bb-rs__m time { font-family:var(--num); }
@media (min-width:1000px){
	.bb-rs__i { grid-template-columns:3.4rem minmax(0,1fr) 12rem; }
	.bb-rs__m { grid-column:auto; justify-content:flex-end; }
}

/* Прогнозы дня */
.bb-pf { display:grid; gap:.4rem; }
.bb-pf__i { display:grid; gap:.35rem; padding:.65rem; border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 40%,transparent); transition:.15s; }
.bb-pf__i:hover { background:color-mix(in srgb,var(--acc) 12%,transparent); }
.bb-pf__t small { display:block; font-size:.66rem; color:var(--tx2); }
.bb-pf__t b { display:block; font-size:.9rem; margin:.1rem 0; }
.bb-pf__b { display:flex; align-items:center; gap:.5rem; }
.bb-pf__b b { font-size:.82rem; flex:1; }
.bb-pf__b u { text-decoration:none; font-family:var(--num); font-weight:700; color:var(--acc); }
.bb-pf__a { display:flex; align-items:center; gap:.4rem; font-size:.68rem; color:var(--tx2); }
.bb-pf__c { font-style:normal; font-family:var(--num); padding:.1rem .4rem; border-radius:999px;
	background:color-mix(in srgb,var(--acc) 14%,transparent); color:var(--acc); }
@media (min-width:1000px){ .bb-pf { grid-template-columns:1fr 1fr; } }

/* Бонусы списком */
.bb-bn { display:grid; gap:.4rem; }
.bb-bn__i { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.5rem; align-items:center;
	padding:.6rem; border-radius:var(--r-sm); background:color-mix(in srgb,var(--surf2) 40%,transparent); }
.bb-bn__t b { display:block; font-size:.88rem; }
.bb-bn__t small { display:block; font-size:.68rem; color:var(--tx2); }
.bb-bn__c { display:none; }
@media (min-width:1000px){
	.bb-bn__i { grid-template-columns:auto minmax(0,1fr) 12rem auto; }
	.bb-bn__c { display:grid; gap:.1rem; font-size:.68rem; color:var(--tx2); }
}

/* ===== Раздел: заголовок и фильтры ===== */
.sec { margin-top:.7rem; }
.sec h1 { font-size:1.3rem; }

/* ===== Шапка главной ===== */
/* Первый экран отвечает на «куда я попал и есть ли тут что-то живое»:
   заголовок под запрос, одна строка объяснения и счётчики по факту
   опубликованного. Цифры считает betbro_home_stats() из тех же данных,
   что и витрины ниже, поэтому разойтись с ними они не могут. */
.bb-hero h1 { font-size:1.45rem; line-height:1.2; letter-spacing:-.01em; max-width:34ch; }
.bb-hero__lead { margin:.55rem 0 0; font-size:.88rem; color:var(--tx2); max-width:52ch; }
.bb-hero__stats { display:flex; flex-wrap:wrap; gap:.4rem; margin:.9rem 0 0; padding:0; list-style:none; }
.bb-hero__stats li { display:flex; align-items:baseline; gap:.35rem; padding:.4rem .7rem;
	border:1px solid var(--line); border-radius:999px; background:var(--surf); }
.bb-hero__stats b { font-family:var(--num); font-size:.95rem; color:var(--acc); }
.bb-hero__stats small { font-size:.7rem; color:var(--tx2); }
@media (min-width:1000px){
	.bb-hero h1 { font-size:2rem; }
	.bb-hero__lead { font-size:.95rem; }
	.bb-hero__stats b { font-size:1.05rem; }
}
.sec p { margin:.5rem 0 0; font-size:.86rem; color:var(--tx2); max-width:46rem; }
.sec__f { display:flex; gap:.3rem; margin-top:.8rem; overflow-x:auto; scrollbar-width:none; }
.sec__f::-webkit-scrollbar { display:none; }
.sec__f button { white-space:nowrap; padding:.42rem .8rem; border-radius:999px; border:1px solid var(--line);
	background:transparent; color:var(--tx2); font:inherit; font-size:.78rem; font-weight:600; cursor:pointer; transition:.15s; }
.sec__f button:hover { color:var(--tx); }
.sec__f button.is-on { background:var(--acc); border-color:var(--acc); color:var(--on-acc); }
@media (min-width:1000px){ .sec { margin-top:1rem; } .sec h1 { font-size:2rem; } .sec p { font-size:.95rem; } }


/* ===== Плитки лиг ===== */
.bb-lgs { display:grid; gap:.35rem; }
.bb-lgs__i { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.55rem; align-items:center;
	padding:.5rem; border-radius:var(--r-sm); border:1px solid transparent; transition:.15s; }
.bb-lgs__i:hover { border-color:var(--line); background:color-mix(in srgb,var(--surf2) 50%,transparent); }
.bb-lgs__t b { display:block; font-size:.88rem; }
.bb-lgs__t small { display:block; font-size:.66rem; color:var(--tx2); }
.bb-lgs__n { display:grid; justify-items:end; font-family:var(--num); font-size:.9rem; font-weight:700; }
.bb-lgs__n small { font-family:inherit; font-size:.62rem; color:var(--tx2); font-weight:400; }
@media (min-width:1000px){ .bb-lgs { grid-template-columns:1fr 1fr; } }

/* ===== Карточки прогнозов на витрине ===== */
.bb-pc { display:grid; gap:.9rem; }
.bb-pc__h small { font-size:.7rem; color:var(--tx2); }
.bb-pc__h h2 { font-size:1.05rem; margin-top:.25rem; }
.bb-pc__h a:hover { color:var(--acc); }
.bb-pc__l { margin:.6rem 0 .8rem; font-size:.88rem; color:var(--tx2); }
.bb-pc__b { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; align-items:center; }
.bb-pc__b > span { display:grid; gap:.1rem; padding:.45rem .6rem; border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 45%,transparent); }
.bb-pc__b small { font-size:.64rem; color:var(--tx2); }
.bb-pc__b b { font-size:.85rem; }
.bb-pc__odd b { font-family:var(--num); color:var(--acc); font-size:1rem; }
.bb-pc__go { grid-column:1/-1; display:flex; align-items:center; justify-content:center; min-height:2.4rem;
	border-radius:var(--r-sm); border:1px solid var(--acc); color:var(--acc); font-size:.82rem; font-weight:700;
	transition:.15s; }
.bb-pc__go:hover { background:color-mix(in srgb,var(--acc) 14%,transparent); }
@media (min-width:1000px){
	.bb-pc__h h2 { font-size:1.2rem; }
	.bb-pc__b { grid-template-columns:1fr 1fr 1fr auto; }
	.bb-pc__go { grid-column:auto; padding:0 1.1rem; }
}

/* ===== Полная турнирная таблица ===== */
.bb-tt { width:100%; border-collapse:collapse; font-size:.8rem; }
.bb-tt th { font-size:.64rem; text-transform:uppercase; letter-spacing:.04em; color:var(--tx2);
	font-weight:600; padding:.35rem .3rem; text-align:center; }
.bb-tt th:nth-child(2) { text-align:left; }
.bb-tt td { padding:.4rem .3rem; border-top:1px solid var(--line); text-align:center; font-family:var(--num); }
.bb-tt td:nth-child(2) { text-align:left; font-family:inherit; }
.bb-tt tr.is-me { background:color-mix(in srgb,var(--acc) 10%,transparent); }
.bb-tt .bb-tt .bb-tt .bb-tt__f { display:flex; gap:.8rem; flex-wrap:wrap; margin-top:.6rem; font-size:.68rem; color:var(--tx2); }
.bb-tt__f span { display:inline-flex; align-items:center; gap:.3rem; }
.bb-tt__f i { width:.6rem; height:.6rem; border-radius:2px; display:inline-block; }
.s-hide2 { display:none; }
@media (min-width:760px){ .s-hide2 { display:table-cell; } }

/* ===== Главная: первый экран ===== */
.hm { display:grid; gap:.9rem; margin-top:.7rem; }
.hm__t h1 { font-size:1.3rem; }
.hm__t p { margin:.6rem 0 0; font-size:.88rem; color:var(--tx2); max-width:44rem; }
.hm__n { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; margin-top:.9rem; }
.hm__n a { display:grid; gap:.1rem; padding:.6rem .5rem; border:1px solid var(--line); border-radius:var(--r-sm);
	background:var(--surf); transition:.16s; }
.hm__n a:hover { border-color:var(--acc); }
.hm__n b { font-family:var(--num); font-size:1.15rem; }
.hm__n small { font-size:.66rem; color:var(--tx2); }
@media (min-width:1000px){
	.hm { grid-template-columns:minmax(0,1fr) 26rem; align-items:start; gap:1.4rem; margin-top:1.1rem; }
	.hm__t h1 { font-size:2.1rem; }
	.hm__t p { font-size:.98rem; }
	.hm__n { margin-top:1.2rem; }
	.hm__n b { font-size:1.4rem; }
}

/* Матч дня */
.fm { background:var(--surf); border:1px solid var(--line); border-radius:var(--r); padding:.9rem; backdrop-filter:blur(18px); }
.fm__h { display:flex; align-items:center; gap:.5rem; font-size:.72rem; color:var(--tx2); margin-bottom:.7rem; }
.fm__h b { color:var(--acc); }
.fm__t { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:.5rem; text-align:center; }
.fm__t b { display:block; font-size:.92rem; margin-top:.4rem; }
.fm__w { font-family:var(--num); font-size:1.5rem; font-weight:800; }
.fm__w small { display:block; font-size:.64rem; color:var(--tx2); font-weight:400; }
.fm__o { display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; margin-top:.8rem; }
.fm__go { display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-top:.7rem;
	font-size:.74rem; color:var(--tx2); }


/* ===== Таблица рейтинга ===== */
.bk-t { display:grid; gap:.45rem; }
.bk-r { display:grid; grid-template-columns:1.4rem auto minmax(0,1fr) auto; gap:.5rem .6rem; align-items:center;
	padding:.7rem; border-radius:var(--r-sm); background:color-mix(in srgb,var(--surf2) 40%,transparent);
	transition:transform .2s cubic-bezier(.2,.7,.3,1), background .2s; }
@media (hover:hover){ .bk-r:hover { background:color-mix(in srgb,var(--acc) 10%,transparent); transform:translateY(-1px); } }
.bk-r__n { font-style:normal; font-family:var(--num); font-size:.8rem; color:var(--tx2); }
.bk-r__t { min-width:0; }
.bk-r__t b { display:block; font-size:.95rem; }
.bk-r__t small { display:block; font-size:.68rem; color:var(--tx2); }
.bk-r__s { display:grid; justify-items:end; }
.bk-r__s u { text-decoration:none; font-family:var(--num); font-size:1.05rem; font-weight:800; color:var(--acc); }
.bk-r__s small { font-size:.64rem; color:var(--tx2); }
.bk-r__d { grid-column:1/-1; display:grid; grid-template-columns:repeat(2,1fr); gap:.35rem; }
.bk-r__d span { display:flex; justify-content:space-between; gap:.4rem; padding:.3rem .45rem; border-radius:7px;
	background:color-mix(in srgb,var(--bg) 35%,transparent); font-size:.72rem; color:var(--tx2); }
.bk-r__d b { color:var(--tx); font-family:var(--num); font-weight:700; }
.bk-r__go { grid-column:1/-1; }
.bk-r__go .bb-bet { display:flex; width:100%; min-height:2.4rem; }
@media (min-width:1000px){
	.bk-r { grid-template-columns:1.6rem auto 13rem minmax(0,1fr) 4.5rem 8rem; }
	.bk-r__d { grid-column:auto; grid-template-columns:repeat(4,1fr); }
	.bk-r__go { grid-column:auto; }
	.bk-r__go .bb-bet { width:auto; min-height:2.2rem; }
}

/* Полосы с одним значением: вторая половина шкалы не нужна */
.bb-card .bb-stats__r b:empty { display:none; }
.bb-card .bb-stats__r:has(b:empty) { grid-template-columns:3.6rem minmax(0,1fr); }
.bb-card .bb-stats__r:has(b:empty) .bb-stats__n { text-align:left; }
.bb-card .bb-stats__r:has(b:empty) .bb-stats__n i { background:color-mix(in srgb,var(--surf2) 70%,transparent); }

/* ===== Карточка букмекера: шапка ===== */
.bk-hero { margin-top:.55rem; padding:.8rem; border:1px solid var(--line); border-radius:var(--r);
	background:var(--surf); backdrop-filter:blur(18px); }
.bk-hero__top { display:grid; grid-template-columns:auto minmax(0,1fr); gap:.7rem; align-items:center; }
.bk-hero__t h1 { font-size:1.25rem; }
.bk-hero__t small { display:block; font-size:.72rem; color:var(--tx2); margin-top:.15rem; }
.bk-hero__sc { display:flex; align-items:center; gap:.4rem; margin-top:.35rem; font-size:.76rem; color:var(--tx2); }
.bk-hero__sc u { text-decoration:none; font-family:var(--num); font-size:1.15rem; font-weight:800; color:var(--acc); }
.stars { display:inline-flex; gap:.1rem; }
.stars i { font-style:normal; color:var(--acc); font-size:.8rem; }
.stars i.off { color:var(--line); }
.bk-hero__b { display:grid; gap:.5rem; margin-top:.8rem; padding-top:.7rem; border-top:1px solid var(--line); }
.bk-hero__b .bb-bet { display:flex; min-height:2.5rem; }
.bk-hero__o { display:grid; gap:.1rem; }
.bk-hero__o b { font-size:.95rem; }
.bk-hero__o small { font-size:.7rem; color:var(--tx2); }
.bk-lic { display:inline-flex; align-items:center; gap:.3rem; padding:.15rem .5rem; border-radius:999px;
	font-size:.68rem; font-weight:600; color:var(--up);
	background:color-mix(in srgb,var(--up) 14%,transparent); }
@media (min-width:1000px){
	.bk-hero { margin-top:.8rem; padding:1.1rem; }
	.bk-hero__t h1 { font-size:1.8rem; }
	.bk-hero__b { grid-template-columns:minmax(0,1fr) auto; align-items:center; }
	.bk-hero__b .bb-bet { min-height:2.7rem; padding:0 2rem; }
}

/* ===== Плюсы и минусы ===== */
.pm { display:grid; gap:.7rem; }
.pm ul { list-style:none; margin:0; padding:0; display:grid; gap:.3rem; }
.pm li { display:flex; gap:.5rem; font-size:.85rem; }
.pm li::before { content:"+"; font-weight:800; color:var(--up); flex:none; width:1rem; text-align:center; }
.pm .pm__m li::before { content:"−"; color:var(--down); }
.pm h3 { font-size:.85rem; margin-bottom:.35rem; color:var(--tx2); }
@media (min-width:760px){ .pm { grid-template-columns:1fr 1fr; gap:1.2rem; } }

/* ===== Характеристики ===== */
.spec { margin:0; display:grid; gap:.3rem; font-size:.84rem; }
.spec > div { display:flex; gap:.6rem; justify-content:space-between; padding-bottom:.3rem; border-bottom:1px solid var(--line); }
.spec dt { color:var(--tx2); }
.spec dd { margin:0; text-align:right; }

/* ===== Способы пополнения ===== */
.pay { display:flex; flex-wrap:wrap; gap:.35rem; }
.pay span { padding:.3rem .6rem; border-radius:999px; font-size:.76rem;
	background:color-mix(in srgb,var(--surf2) 60%,transparent); }

/* Полосы с одним значением: вторая половина шкалы не нужна */
.bb-card .bb-stats__r b:empty { display:none; }
.bb-card .bb-stats__r:has(b:empty) { grid-template-columns:3.6rem minmax(0,1fr); }
.bb-card .bb-stats__r:has(b:empty) .bb-stats__n { text-align:left; }
.bb-card .bb-stats__r:has(b:empty) .bb-stats__n i { background:color-mix(in srgb,var(--surf2) 70%,transparent); }

/* ===== Переключатель оформления ===== */
.bb-scheme { display:flex; gap:.15rem; margin:0; padding:.15rem; border:1px solid var(--line);
	border-radius:999px; background:color-mix(in srgb,var(--surf2) 60%,transparent); }
.bb-scheme__legend { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.bb-scheme__option { display:block; }
.bb-scheme__input { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.bb-scheme__face { display:grid; place-items:center; width:1.9rem; height:1.9rem; border-radius:999px;
	color:var(--tx2); cursor:pointer; transition:.15s; }
.bb-scheme__face:hover { color:var(--tx); }
.bb-scheme__input:checked + .bb-scheme__face { background:var(--acc); color:var(--on-acc); }
.bb-scheme__input:focus-visible + .bb-scheme__face { outline:2px solid var(--acc); outline-offset:2px; }
.bb-scheme__icon { width:1rem; height:1rem; }
.bb-scheme__label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }

/* Основная колонка без боковой занимает всю ширину */
@media (min-width:1000px){ .main--wide { grid-template-columns:minmax(0,1fr); } }

/* Меню выводится списком: маркеры и отступы убираем */
.nav__l, .menu__p, .foot__n { list-style:none; }
.nav__l li, .menu__p li, .foot__n li { list-style:none; margin:0; }
.menu__p li a { display:flex; }

/* ===== Поиск ===== */
.bb-search { display:flex; gap:.5rem; margin-top:.9rem; max-width:32rem; }
.bb-search__l { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.bb-search__i { flex:1; min-width:0; font:inherit; font-size:.9rem; padding:.55rem .8rem; color:var(--tx);
	background:color-mix(in srgb,var(--surf2) 60%,transparent); border:1px solid var(--line); border-radius:999px; }
.bb-search__i:focus-visible { outline:2px solid var(--acc); outline-offset:1px; }
.bb-search .bb-bet { min-height:2.4rem; padding:0 1.2rem; }

/* ===== Текст посадочной: подзаголовки, списки, таблицы ===== */
.bb-text > h2 { font-size:1.15rem; margin:1.4rem 0 .6rem; scroll-margin-top:4.5rem; }
.bb-text > h2:first-child { margin-top:0; }
.bb-text > h3 { font-size:1rem; margin:1.1rem 0 .5rem; }
.bb-text p { margin:0 0 .8rem; font-size:.92rem; }
.bb-text p:last-child { margin-bottom:0; }
.bb-text a { color:var(--acc); text-decoration:underline; text-underline-offset:.15em; }
.bb-text a:hover { text-decoration:none; }
.bb-text ul, .bb-text ol { margin:0 0 .9rem; padding-left:1.1rem; display:grid; gap:.3rem; font-size:.92rem; }
.bb-text li::marker { color:var(--acc); }
.bb-text blockquote { margin:0 0 .9rem; padding:.7rem .9rem; border-left:2px solid var(--acc);
	border-radius:0 var(--r-sm) var(--r-sm) 0; background:color-mix(in srgb,var(--acc) 8%,transparent);
	font-size:.92rem; color:var(--tx2); }
.bb-text blockquote p:last-child { margin:0; }
.bb-text table { width:100%; border-collapse:collapse; margin:0 0 .9rem; font-size:.86rem; }
.bb-text th { text-align:left; font-size:.68rem; text-transform:uppercase; letter-spacing:.04em;
	color:var(--tx2); font-weight:600; padding:.35rem .4rem; }
.bb-text td { padding:.42rem .4rem; border-top:1px solid var(--line); }
.bb-text img { border-radius:var(--r-sm); }
@media (min-width:1000px){
	.bb-text > h2 { font-size:1.35rem; }
	.bb-text p, .bb-text ul, .bb-text ol { font-size:.96rem; }
}

/* ===== Оглавление ===== */
.bb-toc { margin:0 0 1.1rem; padding:.8rem .9rem; border-radius:var(--r-sm);
	background:color-mix(in srgb,var(--surf2) 45%,transparent); }
.bb-toc b { display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em;
	color:var(--tx2); margin-bottom:.45rem; }
.bb-toc ol { margin:0; padding-left:1.1rem; display:grid; gap:.25rem; font-size:.88rem; }
.bb-toc a { color:var(--tx); text-decoration:none; }
.bb-toc a:hover { color:var(--acc); }

/* Полоса фактов под заголовком работает и на посадочной */
.sec .hm__n { margin-top:.9rem; }
.sec .hm__n span { display:grid; gap:.1rem; padding:.6rem .5rem; border:1px solid var(--line);
	border-radius:var(--r-sm); background:var(--surf); }
.sec .hm__n b { font-family:var(--num); font-size:1.15rem; }
.sec .hm__n small { font-size:.66rem; color:var(--tx2); }

/* ===== Появление блоков ===== */
@media (prefers-reduced-motion:no-preference){
	.is-reveal { opacity:0; transform:translateY(10px); }
	.is-reveal.is-in { opacity:1; transform:none;
		transition:opacity .35s ease var(--delay,0ms), transform .35s cubic-bezier(.2,.7,.3,1) var(--delay,0ms); }
}

/* ===== Пометка о рекламе ===== */
.bb-erid { background:none; border:1px solid var(--line); border-radius:999px; color:var(--tx2);
	font:inherit; font-size:.7rem; padding:.15rem .6rem; cursor:pointer; }
.bb-erid:hover { border-color:var(--acc); color:var(--tx); }
.bb-erid__note { display:block; margin-top:.4rem; font-size:.68rem; color:var(--tx2); word-break:break-word; }

/* ===== Сортировка таблицы ===== */
.bb-tbl th[data-sort] { cursor:pointer; user-select:none; }
.bb-tbl th[data-sort]:hover { color:var(--acc); }
.bb-tbl th[data-sort][data-dir]::after { content:"↓"; margin-left:.2rem; color:var(--acc); }
.bb-tbl th[data-sort][data-dir="asc"]::after { content:"↑"; }

/* ===== Шапка матча на широких мониторах ===== */
@media (min-width:1400px){
	.hero { padding:1.5rem 1.8rem; }
	.hero h1 { font-size:2.4rem; }
	.hero__sub { font-size:.9rem; }
	.score { margin-top:1.4rem; padding-bottom:1.6rem; gap:1rem; }
	.score .bb-mark { width:4rem; height:4rem; font-size:1.15rem; }
	.score .tm b { font-size:1.5rem; }
	.sc { font-size:3.4rem; }
	.sc small { font-size:.85rem; margin-top:.45rem; }
	.goals { font-size:.85rem; }
}
@media (min-width:1800px){
	.hero h1 { font-size:2.8rem; }
	.score .bb-mark { width:4.6rem; height:4.6rem; font-size:1.3rem; }
	.score .tm b { font-size:1.7rem; }
	.sc { font-size:4rem; }
}

/* Значки движения линии в бегущей строке */
.tick__i u { text-decoration:none; font-family:var(--num); color:var(--tx); }
.tick__i small { font-size:.7rem; }
.tick__i small.is-up { color:var(--up); }
.tick__i small.is-down { color:var(--down); }

/* Фильтры разделов: ссылки, чтобы на выбор можно было сослаться */
.sec__f a { white-space:nowrap; padding:.42rem .8rem; border-radius:999px; border:1px solid var(--line);
	color:var(--tx2); font-size:.78rem; font-weight:600; transition:.15s; }
.sec__f a:hover { color:var(--tx); border-color:color-mix(in srgb,var(--acc) 50%,var(--line)); }
.sec__f a.is-on { background:var(--acc); border-color:var(--acc); color:var(--on-acc); }

/* ===== Зоны турнирной таблицы ===== */
.bb-tt .zone--top { background:var(--up); }
.bb-tt .zone--middle { background:var(--acc); }
.bb-tt .zone--bottom { background:var(--down); }
.bb-tt__f i.zone--top { background:var(--up); }
.bb-tt__f i.zone--middle { background:var(--acc); }
.bb-tt__f i.zone--bottom { background:var(--down); }

/* Полоса с одним значением: вторая половина шкалы не нужна */
.bb-stats__r--one { grid-template-columns:3.8rem minmax(0,1fr); }
.bb-stats__r--one .bb-stats__n { text-align:left; }
.bb-stats__r--one .bb-stats__n i { background:color-mix(in srgb,var(--surf2) 70%,transparent); }

/* ===== Светлая тема: поправки там, где тёмные приёмы не работают ===== */
:root[data-theme="light"] body::before {
	background:
		radial-gradient(44rem 34rem at clamp(4rem, 18vw, 30rem) -6rem,
			color-mix(in srgb,var(--acc) 16%,transparent), transparent 62%),
		radial-gradient(40rem 32rem at calc(100% - clamp(4rem, 18vw, 30rem)) 2rem,
			color-mix(in srgb,#db2777 10%,transparent), transparent 62%),
		var(--bg);
}
:root[data-theme="light"] .bb-card,
:root[data-theme="light"] .hero,
:root[data-theme="light"] .bk-hero { box-shadow:0 1px 2px rgba(22,11,46,.05); }
:root[data-theme="light"] .nav,
:root[data-theme="light"] .tabs { background:color-mix(in srgb,var(--bg) 92%,transparent); }
:root[data-theme="light"] .tick { background:color-mix(in srgb,var(--bg2) 80%,transparent); }
:root[data-theme="light"] .menu__v { background:rgba(22,11,46,.35); }
