/* onlinebasketballbetting.net — TIP-OFF, скин прогона obb 27.09.2026 */
:root{
 --ink:#14121A; --ink-2:#463F52; --ink-3:#6E6678;
 --canvas:#F6F3EC; --paper:#FFFFFF; --rule:#DCD5C7; --rule-2:#EFEAE0;
 --primary:#5B2A86; --primary-d:#421C64; --primary-l:#EDE4F6;
 --accent:#E3A21A; --accent-d:#A8760C; --accent-l:#FBF0D6;
 --plus:#1F7A4D; --minus:#B3261E;
 --sheet:24px; --text:760px; --wide:888px; --hull:1120px;
 --r:10px; --r-s:6px;
 --sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
 --head:"Oswald",var(--sans);
 --shadow:0 1px 0 rgba(20,18,26,.05),0 6px 18px rgba(20,18,26,.06);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink);
 font:400 17px/1.66 var(--sans);overflow-x:hidden}
img,svg,video,iframe{max-width:100%;height:auto}
a{color:var(--primary-d);text-underline-offset:.15em}
a:hover{color:var(--primary)}
h1,h2,h3,h4,h5{font-family:var(--head);font-weight:600;line-height:1.14;
 letter-spacing:-.005em;margin:0 0 .5em;color:var(--ink)}
h1{font-size:clamp(30px,4.6vw,45px);font-weight:700;letter-spacing:-.012em}
h2{font-size:clamp(24px,3vw,31px);margin-top:1.75em}
h3{font-size:clamp(20px,2.3vw,23px);margin-top:1.5em}
h4{font-size:19px;margin-top:1.3em}
p,ul,ol,table,figure,blockquote{margin:0 0 1.1em}
ul,ol{padding-left:1.25em}
li{margin:.3em 0}
strong,b{font-weight:700}
hr{border:0;border-top:1px solid var(--rule);margin:2em 0}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* ─── полосы и полотно ─────────────────────────────────────────────────── */
.obb-w{width:100%;max-width:calc(var(--hull) + var(--sheet)*2);margin:0 auto;padding:0 var(--sheet)}
.obb-sheet{width:100%;max-width:calc(var(--wide) + var(--sheet)*2);margin:0 auto;padding:0 var(--sheet)}
.obb-main{padding:26px 0 8px}
.obb-mainc{min-width:0}
.obb-grid{display:grid;grid-template-columns:minmax(0,1fr) 316px;gap:38px;align-items:start}
@media(max-width:1000px){.obb-grid{grid-template-columns:minmax(0,1fr);gap:26px}}

/* ─── верхняя планка ───────────────────────────────────────────────────── */
.obb-strip{background:var(--ink);color:#E7E2F0;font-size:13px;line-height:1.4}
.obb-strip .obb-w{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;
 min-height:38px;padding-top:7px;padding-bottom:7px}
.obb-strip a{color:#E7E2F0;text-decoration:none;border-bottom:1px solid rgba(231,226,240,.35)}
.obb-strip a:hover{color:var(--accent);border-color:var(--accent)}
.obb-strip__date{font-family:var(--head);letter-spacing:.06em;text-transform:uppercase;
 font-size:12px;color:#B9B0C8}
.obb-strip__sp{margin-left:auto}
.obb-age{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:20px;
 padding:0 6px;border:1.5px solid var(--accent);border-radius:99px;color:var(--accent);
 font:600 11px/1 var(--head);letter-spacing:.08em}

/* ─── шапка ────────────────────────────────────────────────────────────── */
/* ⛔ Верхняя планка со «21+ · 1-800-GAMBLER» лежит ВНУТРИ <header> первой строкой,
   а не отдельным блоком над ним. Снаружи она даёт «зазор НАД шапкой 38px» на каждой
   странице (R6 мерит `header.getBoundingClientRect().top` и ждёт нуля), и R20 не видит
   её как строку шапки — то есть не сверяет её левый край с логотипом. Липкости у шапки
   нет намеренно: со планкой она заняла бы 112px десктопа и ~100px телефона. */
.obb-head{background:var(--paper);border-bottom:2px solid var(--ink)}
.obb-head__r{display:flex;align-items:center;gap:18px;min-height:74px;
 padding-top:10px;padding-bottom:10px}
/* ⛔ Логотип обязан УМЕТЬ СЖИМАТЬСЯ: при `flex:0 0 auto` его минимальная ширина
   (знак 40 + «ONLINE BASKETBALL BETTING» 21px) выдавливала кнопку меню за правый
   край — документ 395px при вьюпорте 390. */
.obb-logo{display:inline-flex;align-items:center;gap:11px;text-decoration:none;
 color:var(--ink);flex:0 1 auto;min-width:0}
.obb-logo__m{width:40px;height:40px;flex:0 0 40px}
.obb-logo__t{display:block;font:700 21px/1.02 var(--head);letter-spacing:-.015em;text-transform:uppercase}
.obb-logo__s{display:block;font:500 10.5px/1.3 var(--head);letter-spacing:.17em;
 text-transform:uppercase;color:var(--primary)}
.obb-nav{margin-left:auto}
.obb-nav__l{list-style:none;display:flex;align-items:center;gap:4px;margin:0;padding:0}
.obb-nav__l li{margin:0}
.obb-nav a{display:inline-block;padding:9px 11px;border-radius:var(--r-s);text-decoration:none;
 color:var(--ink);font:500 14.5px/1 var(--head);letter-spacing:.045em;text-transform:uppercase;
 white-space:nowrap}
.obb-nav a:hover{background:var(--primary-l);color:var(--primary-d)}
.obb-nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--accent)}
/* цель тапа — не меньше 44×44 (N1): было 68×31 */
.obb-burger{display:none;margin-left:auto;align-items:center;justify-content:center;gap:8px;
 background:var(--ink);color:#fff;border:0;border-radius:var(--r-s);
 min-height:46px;min-width:46px;padding:10px 15px;flex:0 0 auto;
 font:500 13px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
@media(max-width:1000px){
 .obb-nav{display:none;order:9;width:100%;margin:0;padding-top:10px;
  border-top:1px solid var(--rule-2)}
 .obb-nav.is-open{display:block}
 .obb-nav__l{flex-wrap:wrap;gap:2px}
 .obb-nav__l li{flex:1 1 44%}
 /* N4: цель каждой ссылки открытого меню ≥44px по высоте */
 .obb-nav a{display:flex;align-items:center;justify-content:center;min-height:46px;
  padding:6px 11px;text-align:center}
 .obb-burger{display:inline-flex}
 .obb-head__r{flex-wrap:wrap;gap:12px}
}
@media(max-width:430px){
 .obb-logo__t{font-size:17px}
 .obb-logo__s{display:none}
}

/* ─── крошки, служебная строка ─────────────────────────────────────────── */
.obb-crumbs{font-size:13.5px;color:var(--ink-3);padding:14px 0 0}
.obb-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.obb-crumbs li::after{content:"›";margin-left:6px;color:var(--rule)}
.obb-crumbs li:last-child::after{content:""}
.obb-crumbs a{color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--rule)}
.obb-crumbs a:hover{color:var(--primary);border-color:var(--primary)}
.obb-upd{margin:0 0 18px;font-size:13.5px;color:var(--ink-3);
 display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
.obb-upd time{font-weight:600;color:var(--ink-2)}
.obb-kicker{display:inline-block;margin:0 0 9px;padding:4px 10px;border-radius:99px;
 background:var(--primary);color:#fff;font:600 11.5px/1.5 var(--head);
 letter-spacing:.14em;text-transform:uppercase}

/* ─── лид ──────────────────────────────────────────────────────────────── */
.obb-lede{font-size:20.5px;line-height:1.52;color:var(--ink-2);margin:0 0 1.2em;max-width:var(--text)}
.obb-hero{margin:0 0 26px;border-radius:var(--r);overflow:hidden;background:var(--rule-2)}
.obb-hero img{display:block;width:100%}
.obb-hero figcaption{padding:9px 14px;font-size:13px;color:var(--ink-3);background:var(--paper)}

/* ─── текстовое полотно ────────────────────────────────────────────────── */
.obb-body{max-width:var(--text)}
.obb-body>*{max-width:100%}
.obb-body img{border-radius:var(--r-s)}
.obb-body figure{margin:1.6em 0;max-width:100%}
/* ⚠️ Донорские классы выравнивания приезжают в прозе как есть (правило 4: разметку
   тела не переписываем), а CSS редактора WordPress мы не тащим — и `aligncenter`
   без правила превращался в «прижато влево»: FIGURE 760px в колонке 1243px давала
   зазор 14px слева и 469px справа, гейт паддинга писал «прилипший текст» (27.09.2026).
   `is-resized` несёт инлайновую ширину — её оставляем, ограничиваем только потолком. */
.obb-body .aligncenter{margin-left:auto;margin-right:auto}
.obb-body figure.alignleft{margin-right:auto}
.obb-body figure.alignright{margin-left:auto}
.obb-body .is-resized img,.obb-body figure img{max-width:100%;height:auto}
.obb-body figcaption{font-size:13.5px;color:var(--ink-3);padding-top:7px}
.obb-body blockquote{margin:1.6em 0;padding:4px 0 4px 20px;border-left:4px solid var(--accent);
 font-size:19px;line-height:1.55;color:var(--ink-2)}
.obb-body a{color:var(--primary-d)}
/* ─── голый HTML робота автопостинга: статья приезжает по шаблону БЕЗ обёрток
   сборщика (таблица без .obb-scroll, <pre>, длинная ссылка без пробелов). Свои
   страницы под это правило не попадают — у них таблица лежит внутри .obb-scroll. */
.obb-body{overflow-wrap:break-word}
.obb-body a{overflow-wrap:anywhere}
.obb-body>table,.obb-body>pre{display:block;max-width:100%;overflow-x:auto;
 container-type:inline-size}
.obb-body>table>caption{position:sticky;left:0;width:100cqi;text-align:left}
.obb-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 1.3em;
 border:1px solid var(--rule);border-radius:var(--r);background:var(--paper)}
.obb-scroll>table{margin:0;min-width:520px;border:0}
table{width:100%;border-collapse:collapse;font-size:15.5px;background:var(--paper)}
/* 16px — не вкус, а норма гейта отступов: текст первой ячейки мерится от края
   контейнера-прокрутки `.obb-scroll`, и 13px давали «зазор слева 14» на каждой таблице */
th,td{padding:10px 17px;border-bottom:1px solid var(--rule-2);text-align:left;vertical-align:top}
thead th{background:var(--ink);color:#fff;font:600 12.5px/1.3 var(--head);
 letter-spacing:.09em;text-transform:uppercase;border-bottom:0}
tbody tr:nth-child(even){background:#FCFAF6}

/* ─── оглавление ───────────────────────────────────────────────────────── */
.obb-toc{margin:0 0 26px;padding:16px 20px;background:var(--paper);border:1px solid var(--rule);
 border-left:4px solid var(--primary);border-radius:var(--r)}
.obb-toc h2{margin:0 0 9px;font-size:13px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.obb-toc ol{margin:0;padding-left:1.15em;font-size:15.5px}
.obb-toc li{margin:.22em 0}
.obb-toc a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--rule-2)}
.obb-toc a:hover{color:var(--primary);border-color:var(--primary)}

/* ⚠️ Рельса фактов на сайте нет: цифры для неё пришлось бы брать не из источника
   (правило 5), поэтому и правил скина под неё не держим — C09.31 считает правило
   без разметки браком, а не запасом. */

/* ─── лента автопостинга: сюда робот вставляет запись сразу за маркером ленты.
   ⛔ Сам маркер в комментарии НЕ ЦИТИРОВАТЬ: он подстрока, а не тег, и вторая его
   копия в таблице стилей — второй маркер на сайте (B3 насчитает два, и достаточно
   перестановки remote_path, чтобы анонс приехал в css).
   Разметку робот приносит свою, с инлайновым margin-bottom:20px — перебиваем, иначе
   записи слипаются с разным шагом и лента выглядит не как раздел, а как свалка.
   C09.31: класс живой, его печатает obb_articles.py (функция wire()) на хабе /blog/;
   в момент сборки лента пуста — записи появляются позже. Не удалять как мёртвый. */
.obb-wire{margin:26px 0 0}
/* до первой публикации гнездо пусто — заглушка снимется сама с первым анонсом */
.obb-wire:empty::before{content:"Fresh posts land here as our desk files them.";
 display:block;padding:18px 20px;border:1px dashed var(--rule-2);border-radius:var(--r);
 font-size:15px;line-height:1.55;color:var(--ink-3);background:var(--paper)}
.obb-wire>div{margin:0 0 26px!important;padding:0 0 24px;border-bottom:1px solid var(--rule-2)}
.obb-wire>div:last-child{border-bottom:0;padding-bottom:0}
.obb-wire h2,.obb-wire h3,.obb-wire h4{font:600 21px/1.28 var(--head);margin:0 0 9px;color:var(--ink)}
.obb-wire h2 a,.obb-wire h3 a,.obb-wire h4 a{color:var(--ink);text-decoration:none}
.obb-wire h2 a:hover,.obb-wire h3 a:hover,.obb-wire h4 a:hover{color:var(--primary-d)}
.obb-wire p{margin:0 0 10px!important;font-size:15.5px;line-height:1.62;color:var(--ink-2)}
.obb-wire img{max-width:100%;height:auto;border-radius:var(--r);margin:0 0 12px}

/* ─── карточки хаба (блоки карточек — требование владельца) ────────────── */
.obb-cards{list-style:none;display:grid;gap:18px;margin:0 0 30px;padding:0;
 grid-template-columns:repeat(auto-fill,minmax(258px,1fr))}
.obb-card{background:var(--paper);border:1px solid var(--rule);border-radius:var(--r);
 overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow)}
.obb-card__i{display:block;aspect-ratio:16/9;background:var(--primary-l);object-fit:cover;width:100%}
.obb-card__b{padding:14px 17px 17px;display:flex;flex-direction:column;gap:7px;flex:1}
.obb-card__k{font:600 10.5px/1.4 var(--head);letter-spacing:.14em;text-transform:uppercase;
 color:var(--primary)}
.obb-card__t{font:600 18.5px/1.24 var(--head);margin:0}
.obb-card__t a{color:var(--ink);text-decoration:none}
.obb-card__t a:hover{color:var(--primary-d)}
.obb-card__d{font-size:14.5px;line-height:1.5;color:var(--ink-3);margin:0}
.obb-card__m{margin-top:auto;padding-top:9px;font-size:12.5px;color:var(--ink-3);
 display:flex;gap:12px;align-items:center;border-top:1px solid var(--rule-2)}
/* Плитка-знак у страницы без своего кадра: коробка ТОЙ ЖЕ пропорции, что и снимок, —
   иначе карточки в ряду разной высоты, а пустого места на месте кадра быть не должно. */
.obb-card__f{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;
 background:var(--primary-l);color:var(--primary-d);border-bottom:1px solid var(--rule-2)}
.obb-card__fi{width:34px;height:34px;opacity:.85}
/* Буквенные группы: с ~80 карточек сплошная сетка не читается ни на десктопе, ни на телефоне */
.obb-cards-az{margin:0 0 30px}
.obb-cards__az{font:600 13px/1.3 var(--head);letter-spacing:.16em;text-transform:uppercase;
 color:var(--ink-3);margin:26px 0 12px;padding-bottom:7px;border-bottom:2px solid var(--accent)}
.obb-cards-az .obb-cards__az:first-child{margin-top:0}
.obb-cards-az .obb-cards{margin-bottom:0}
/* Лента страниц раздела: без неё пагинация донора — восемь сирот */
.obb-pager{margin:0 0 30px}
.obb-pager__l{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.obb-pager__l a,.obb-pager__c{display:block;min-width:40px;padding:8px 11px;text-align:center;
 border:1px solid var(--rule);border-radius:var(--r-s);font:600 14.5px/1.2 var(--head);
 text-decoration:none;background:var(--paper);color:var(--ink)}
.obb-pager__l a:hover{border-color:var(--primary);color:var(--primary-d)}
.obb-pager__c{background:var(--ink);border-color:var(--ink);color:#fff}

/* ─── сайдбар ──────────────────────────────────────────────────────────── */
.obb-side{display:flex;flex-direction:column;gap:22px;min-width:0}
.obbs-box{background:var(--paper);border:1px solid var(--rule);border-radius:var(--r);
 overflow:hidden;box-shadow:var(--shadow)}
.obbs-box__h{background:var(--ink);color:#fff;padding:11px 16px;
 font:600 12.5px/1.35 var(--head);letter-spacing:.13em;text-transform:uppercase;
 display:flex;align-items:center;gap:9px}
.obbs-box__b{padding:15px 16px}
.obbs-box__b>:last-child{margin-bottom:0}
.obbs-list{list-style:none;margin:0;padding:0}
.obbs-list li{border-bottom:1px solid var(--rule-2)}
.obbs-list li:last-child{border-bottom:0}
.obbs-list a{display:flex;gap:11px;align-items:center;padding:11px 16px;text-decoration:none;
 color:var(--ink);font-size:15px;line-height:1.35}
.obbs-list a:hover{background:var(--primary-l)}
.obbs-rank{flex:0 0 26px;height:26px;display:grid;place-items:center;border-radius:var(--r-s);
 background:var(--primary);color:#fff;font:600 13px/1 var(--head)}
.obbs-op{display:flex;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--rule-2)}
.obbs-op:last-of-type{border-bottom:0}
.obbs-op__l{flex:0 0 74px;height:44px;display:grid;place-items:center;border-radius:var(--r-s);
 border:1px solid var(--rule-2);padding:4px}
.obbs-op__l img{max-height:36px;width:auto;display:block}
.obbs-op__n{font:600 15.5px/1.2 var(--head);margin:0 0 2px}
.obbs-op__o{font-size:13px;color:var(--ink-3);line-height:1.35}
.obbs-cta{display:block;margin:13px 16px 16px;padding:11px;border-radius:var(--r-s);
 background:var(--accent);color:var(--ink);text-align:center;text-decoration:none;
 font:600 14px/1 var(--head);letter-spacing:.1em;text-transform:uppercase}
.obbs-cta:hover{background:var(--accent-d);color:#fff}

/* ─── полоса ответственной игры ────────────────────────────────────────── */
.obbb-care{margin:30px 0 0;padding:15px 18px;border-radius:var(--r);background:var(--primary-l);
 border:1px solid #D8C6EA;font-size:14.5px;line-height:1.55;color:var(--ink-2);
 display:flex;gap:13px;align-items:flex-start}
.obbb-care svg{flex:0 0 20px;margin-top:2px;color:var(--primary)}
.obbb-care a{color:var(--primary-d)}

/* ─── подпись редакции ─────────────────────────────────────────────────── */
.obbb-by{margin:32px 0 0;padding:17px 20px;background:var(--paper);border:1px solid var(--rule);
 border-radius:var(--r);display:flex;gap:15px;align-items:flex-start;max-width:var(--text)}
.obbb-by__m{flex:0 0 42px}
.obbb-by__t{font:600 15.5px/1.3 var(--head);margin:0 0 4px}
.obbb-by__t a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule-2)}
.obbb-by__t a:hover{color:var(--primary-d);border-bottom-color:currentColor}
.obbb-by p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-3)}

/* ─── подвал ───────────────────────────────────────────────────────────── */
.obb-foot{margin-top:46px;background:var(--ink);color:#CFC8DA;font-size:14.5px;line-height:1.6}
.obb-foot a{color:#E7E2F0;text-decoration:none;border-bottom:1px solid rgba(231,226,240,.28)}
.obb-foot a:hover{color:var(--accent);border-color:var(--accent)}
.obb-foot__g{display:grid;gap:30px;padding:36px 0 26px;
 grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr))}
@media(max-width:860px){.obb-foot__g{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}
@media(max-width:520px){.obb-foot__g{grid-template-columns:minmax(0,1fr)}}
.obb-foot h2{color:#fff;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 11px}
.obb-foot ul{list-style:none;margin:0;padding:0}
.obb-foot li{margin:.42em 0}
.obb-foot__b{border-top:1px solid rgba(231,226,240,.16);padding:16px 0 30px;font-size:13px;
 color:#A79FB6;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center}
.obb-foot__m{display:flex;gap:11px;align-items:center;margin:0 0 12px}
.obb-foot__m svg{color:var(--accent)}

/* ─── плита бренда на обзоре (НЕ витрина: свои классы, см. brand_plate) ──── */
.obbp{margin:0 0 30px;max-width:var(--wide);background:var(--paper);
 border:1px solid var(--rule);border-left:4px solid var(--primary);border-radius:var(--r);
 box-shadow:var(--shadow);display:grid;align-items:center;gap:14px 18px;padding:16px 18px;
 grid-template-columns:46px minmax(0,1fr) 212px}
.obbp__m{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;
 background:var(--primary-l);color:var(--primary-d)}
.obbp__m svg{width:24px;height:24px}
.obbp__n{font:600 20px/1.2 var(--head);margin:0 0 4px}
.obbp__v{font-size:14.5px;line-height:1.46;color:var(--ink-3);margin:0}
.obbp__o{text-align:center;border-left:1px dashed var(--rule);padding-left:16px}
.obbp__k{display:block;font:500 10px/1.4 var(--head);letter-spacing:.12em;
 text-transform:uppercase;color:var(--ink-3);margin-bottom:7px}
.obbp__go{display:block;padding:12px 10px;border-radius:var(--r-s);background:var(--accent);
 color:var(--ink);font:700 14.5px/1.2 var(--head);text-decoration:none}
.obbp__go:hover{background:var(--accent-d);color:#fff}
.obbp__alt{display:inline-block;margin-top:7px;font:600 12px/1.5 var(--head);
 letter-spacing:.06em;color:var(--ink-2)}
@media(max-width:760px){
 .obbp{grid-template-columns:46px minmax(0,1fr)}
 .obbp__o{grid-column:1/-1;text-align:left;border-left:0;padding-left:0;
  display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:4px 12px;align-items:center}
 .obbp__k{grid-column:1}
 .obbp__go{grid-column:2;grid-row:1/3;align-self:center}
 .obbp__alt{grid-column:1;margin-top:0}
}

/* ─── витрина TIP-OFF ──────────────────────────────────────────────────── */
.obbv-wrap{margin:0 0 34px;max-width:var(--wide)}
.obbv-head{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:baseline;margin:0 0 6px}
.obbv-head h2{margin:0;font-size:clamp(22px,2.7vw,28px)}
.obbv-note{font-size:13.5px;color:var(--ink-3);margin:0 0 16px}
.obbv-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.obbv-filter button{background:var(--paper);border:1px solid var(--rule);border-radius:99px;
 padding:7px 15px;font:500 13px/1 var(--head);letter-spacing:.07em;text-transform:uppercase;
 color:var(--ink-2);cursor:pointer}
.obbv-filter button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.obbv-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.obbv-row{position:relative;background:var(--paper);border:1px solid var(--rule);
 border-radius:var(--r);box-shadow:var(--shadow);display:grid;align-items:center;gap:16px;
 padding:16px 18px 16px 14px;
 grid-template-columns:52px 225px minmax(0,296px) minmax(0,1fr) 212px}
.obbv-row--top{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-l),var(--shadow)}
.obbv-chev{grid-column:1;width:52px;height:58px;display:grid;place-items:center;
 clip-path:polygon(0 0,74% 0,100% 50%,74% 100%,0 100%,26% 50%);
 background:var(--primary);color:#fff;font:700 25px/1 var(--head)}
.obbv-row--top .obbv-chev{background:var(--accent);color:var(--ink)}
/* ─── плитка логотипа: белая, знак не мельче 100px и не вылезает ──────────
   Размер поля посчитан под РАЗБРОС ПРОПОРЦИЙ пула (0,71 … 8,06, медиана 2,53):
   • пол абсолютного размера — 100px по длинной стороне на десктопе, 90px на телефоне
     (владелец 25.09.2026). Самый «стоячий» знак пула — Bovada 170×240: у него длинная
     сторона равна ВЫСОТЕ поля, значит высота поля ≥100px, отсюда плитка 225×128
     (поле 205×108) и 168×110 на телефоне (поле 150×92);
   • доля площади знака в поле = min(ar,A)/max(ar,A), поэтому пропорция поля A≈1,9
     держит медиану на 65 % (норма ≥35 %);
   • `width:100%;height:100%;object-fit:contain` — единственная запись, при которой знак
     ФИЗИЧЕСКИ не выходит за поле: `max-width/max-height:100%` внутри grid браузер
     считает по ширине и высоту берёт по пропорции [[showcase-logo-tile-must-be-chosen-by-contrast]].
   ⛔ Но работает она ТОЛЬКО во flex-плитке. В `display:grid;place-items:center` поле
     по высоте для браузера неопределённое, `height:100%` схлопывается в `auto`, и знак
     240×240 рисовался 203×203 в поле 203×106 — «вылез за плитку», замер 27.09.2026
     (BetUS, EveryGame; Bovada 170×240 вылезал на 181px). Во flex-контейнере с заданной
     высотой процент считается от его content-box и 100 % — это ровно 106px. */
.obbv-tile{grid-column:2;width:225px;height:128px;display:flex;align-items:center;
 justify-content:center;
 border-radius:var(--r-s);padding:10px;font:600 17px/1.2 var(--head);color:var(--ink);
 text-align:center;text-decoration:none}
.obbv-tile--paper{background:#fff;border:1px solid var(--rule-2)}
.obbv-tile img{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;display:block}
.obbv-id{grid-column:3;min-width:0}
.obbv-name{font:600 20px/1.2 var(--head);margin:0 0 4px}
.obbv-name a{color:var(--ink);text-decoration:none}
.obbv-name a:hover{color:var(--primary-d)}
.obbv-verdict{font-size:14.5px;line-height:1.46;color:var(--ink-3);margin:0 0 8px}
.obbv-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.obbv-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:99px;
 background:var(--rule-2);color:var(--ink-2);font-size:12.5px;line-height:1.5}
.obbv-chip svg{width:14px;height:14px}
.obbv-stats{grid-column:4;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
 background:var(--rule-2);border:1px solid var(--rule-2);border-radius:var(--r-s);overflow:hidden;
 min-width:0}
.obbv-stat{background:#FCFAF6;padding:8px 11px;min-width:0}
.obbv-stat b{display:block;font:500 10px/1.4 var(--head);letter-spacing:.11em;
 text-transform:uppercase;color:var(--ink-3)}
.obbv-stat span{display:block;font:600 15.5px/1.3 var(--head);color:var(--ink);
 overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.obbv-offer{grid-column:5;text-align:center;border-left:1px dashed var(--rule);padding-left:16px}
.obbv-kind{font:500 10px/1.4 var(--head);letter-spacing:.12em;text-transform:uppercase;
 color:var(--primary);display:block;margin-bottom:2px}
.obbv-sum{display:block;font:700 23px/1.14 var(--head);color:var(--ink);margin-bottom:3px;
 overflow-wrap:anywhere}
.obbv-terms{display:block;font-size:12px;line-height:1.45;color:var(--ink-3);margin-bottom:9px}
.obbv-go{display:block;padding:12px 10px;border-radius:var(--r-s);background:var(--accent);
 color:var(--ink);text-decoration:none;font:600 14.5px/1 var(--head);letter-spacing:.09em;
 text-transform:uppercase}
.obbv-go:hover{background:var(--accent-d);color:#fff}
.obbv-code{display:block;margin-top:7px;font:600 12px/1.5 var(--head);letter-spacing:.09em;
 color:var(--ink-3)}
.obbv-code em{font-style:normal;color:var(--ink);border-bottom:1px dashed var(--rule)}
.obbv-hid{display:none}
.obbv-more{display:inline-flex;align-items:center;gap:8px;margin:16px 0 0;padding:11px 20px;
 background:var(--paper);border:1.5px solid var(--ink);border-radius:var(--r-s);cursor:pointer;
 font:600 13.5px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.obbv-more:hover{background:var(--ink);color:#fff}
.obbv-foot{margin:14px 0 0;font-size:12.5px;line-height:1.55;color:var(--ink-3)}

/* ⛔⛔ `grid-area:s` СБРАСЫВАЕТСЯ следующим за ним `grid-column:auto`: имя области задаёт
   и строку, и колонку, а `auto` колонку отбирает — блок уезжает в первую колонку сетки
   (44px) и вытягивается в высоту. Именно так строка витрины на телефоне выросла до
   882px вместо 150–290 (`obbv-stats 44×131`, `obbv-offer 44×451` в замере браузером),
   при этом ни одна проверка разметки не краснеет: CSS формально валиден. Раскладка по
   именам областей ставится ОДНИМ свойством `grid-area`, без `grid-column` рядом. */
@media(max-width:1000px){
 .obbv-row{grid-template-columns:44px 168px minmax(0,1fr);
  grid-template-areas:"c t i" "s s s" "o o o";padding:14px;gap:12px 14px}
 .obbv-chev{grid-area:c;width:44px;height:50px;font-size:21px}
 .obbv-tile{grid-area:t;width:168px;height:110px;padding:9px}
 .obbv-id{grid-area:i}
 .obbv-name{font-size:18px}
 .obbv-verdict{margin-bottom:6px}
 .obbv-stats{grid-area:s;grid-template-columns:repeat(4,minmax(0,1fr))}
 .obbv-offer{grid-area:o;text-align:left;border-left:0;padding-left:0;
  border-top:1px dashed var(--rule);padding-top:12px;
  display:grid;grid-template-columns:minmax(0,1fr) 168px;gap:4px 14px;align-items:center}
 .obbv-kind{grid-column:1}
 .obbv-sum{grid-column:1;font-size:21px;margin:0}
 .obbv-terms{grid-column:1;margin:0}
 .obbv-go{grid-column:2;grid-row:1/4;align-self:center}
 .obbv-code{grid-column:1/-1}
}
@media(max-width:560px){
 :root{--sheet:16px}
 body{font-size:16.5px}
 .obbv-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 /* оффер остаётся В ДВЕ КОЛОНКИ и на телефоне: в один столбец сумма, условия и кнопка
    добавляли строке ~120px, а высота строки нормируется (150–290) */
 .obbv-offer{grid-template-columns:minmax(0,1fr) 140px;gap:4px 12px}
 .obbv-go{grid-column:2;grid-row:1/4;padding:14px 8px;font-size:13.5px}
 /* ⚠ Метки строки (`Casino bonus on the same account`, 204px при `nowrap`) на телефоне
    вылезали за вьюпорт — документ 431px при 390 — и давали «текст у края». В узкой
    строке они третьи по важности после суммы и кнопки: на ≤560 их не показываем,
    от 561 они переносятся по словам. R5 сюда не смотрит — `.obbv-list` в его исключениях. */
 .obbv-chips{display:none}
 .obb-cards{grid-template-columns:minmax(0,1fr)}
}

/* ─── утилиты ──────────────────────────────────────────────────────────── */
.obb-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
 clip:rect(0 0 0 0);white-space:nowrap;border:0}
.obb-skip{position:absolute;left:-9999px;top:0;z-index:99;background:var(--accent);
 color:var(--ink);padding:10px 16px;border-radius:0 0 var(--r-s) 0;font-weight:600}
.obb-skip:focus{left:0}

/* ─── виджеты владельца (fortunida) ────────────────────────────────────── */
/* ⛔ Классы ТОЛЬКО настоящие: `.subscribe-form`/`.fortunida` у виджета нет вовсе.
   Скоуп по id контейнера — id+класс специфичнее одиночного класса, которым виджет
   красится сам, поэтому `!important` нужен ровно на honeypot. */
#subscribe-form-target,#feedback-form{margin:26px 0 8px}
#subscribe-form-target .subscribe-form-container,
#feedback-form .feedback-form-container{
 background:var(--paper);border:1px solid var(--rule);border-radius:var(--r);
 box-shadow:var(--shadow);padding:22px var(--sheet)}
#subscribe-form-target .subscribe-form-wrapper,
#feedback-form .feedback-form-wrapper{max-width:var(--text);margin:0 auto}
#subscribe-form-target .subscribe-form-header,
#feedback-form .feedback-form-header{font-family:var(--head);color:var(--ink)}
#subscribe-form-target .subscribe-form-icon{color:var(--primary)}
#subscribe-form-target .subscribe-form-input,
#feedback-form .feedback-form-input,#feedback-form .feedback-form-textarea{
 width:100%;font:400 16.5px/1.5 var(--sans);color:var(--ink);background:var(--paper);
 border:1px solid var(--rule);border-radius:var(--r-s);padding:11px 13px}
#feedback-form .feedback-form-textarea{min-height:132px;resize:vertical}
#subscribe-form-target .subscribe-form-input:focus,
#feedback-form .feedback-form-input:focus,#feedback-form .feedback-form-textarea:focus{
 outline:3px solid var(--accent);outline-offset:1px;border-color:var(--primary)}
/* ⛔ Подводка виджета — `#6B7280` (2.9 к полотну), приватность — `#9CA3AF` (2.3):
   на светлом R3 краснеет обеими. Берём свои `--ink-3` (4.9) и `--ink-2` (7.6). */
#subscribe-form-target .subscribe-form-input::placeholder,
#feedback-form .feedback-form-input::placeholder,
#feedback-form .feedback-form-textarea::placeholder{color:var(--ink-3);opacity:1}
#subscribe-form-target .subscribe-form-privacy{color:var(--ink-2);font-size:14px;line-height:1.5}
#feedback-form .feedback-form-label{font-weight:600;color:var(--ink);font-size:15px}
#feedback-form .feedback-form-required{color:var(--minus)}
#feedback-form .feedback-form-group{margin-bottom:14px}
#subscribe-form-target .subscribe-form-submit,#feedback-form .feedback-form-submit{
 font-family:var(--head);font-weight:600;font-size:16px;letter-spacing:.01em;
 background:var(--primary);color:#fff;border:0;border-radius:var(--r-s);
 padding:13px 24px;cursor:pointer}
#subscribe-form-target .subscribe-form-submit:hover,
#feedback-form .feedback-form-submit:hover{background:var(--primary-d)}
#subscribe-form-target .subscribe-form-success,#feedback-form .feedback-form-success{
 color:var(--plus);font-weight:600}
#subscribe-form-target .subscribe-form-error,#feedback-form .feedback-form-error{
 color:var(--minus);font-weight:600}
/* ⛔ Honeypot виджета висит на инлайновом `left:-10000px` — документ уезжает вширь и
   гейт даёт `overflow [INPUT.]`. Ловушку оставляем рабочей: поле на месте и невидимо,
   но не вытягивает полотно. Единственный `!important` во всём блоке. */
#subscribe-form-target input[aria-hidden=true][tabindex="-1"],
#feedback-form input[aria-hidden=true][tabindex="-1"]{
 left:0!important;position:absolute!important;width:1px!important;height:1px!important;
 opacity:0!important;pointer-events:none}