/* suomikasinot.biz — скин прогона 26.09.2026, префикс skb
Композиция casino.co.uk в манере postimees.ee. Палитра «песок и хвоя».
Донорский CSS снят целиком (bootstrap, affiliatetheme, font-awesome, tablepress,
swiper, slick, lightbox) — поэтому здесь описаны И свои блоки, И блоки донора,
которые остаются в теле страниц (DESIGN-ELEMENTS §15b). */
/* ============================================================ 0. ШРИФТЫ */
@font-face{font-family:'SkbHead';font-style:normal;font-weight:600;font-display:swap;
src:url(/x/skb/f/skb-spectral-600-latin.woff2) format('woff2');
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'SkbHead';font-style:normal;font-weight:600;font-display:swap;
src:url(/x/skb/f/skb-spectral-600-latin-ext.woff2) format('woff2');
unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'SkbHead';font-style:normal;font-weight:700;font-display:swap;
src:url(/x/skb/f/skb-spectral-700-latin.woff2) format('woff2');
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'SkbHead';font-style:normal;font-weight:700;font-display:swap;
src:url(/x/skb/f/skb-spectral-700-latin-ext.woff2) format('woff2');
unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'SkbText';font-style:normal;font-weight:400 600;font-stretch:100%;font-display:swap;
src:url(/x/skb/f/skb-asap-400-600-latin.woff2) format('woff2');
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'SkbText';font-style:normal;font-weight:400 600;font-stretch:100%;font-display:swap;
src:url(/x/skb/f/skb-asap-400-600-latin-ext.woff2) format('woff2');
unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ============================================================ 1. ТОКЕНЫ */
:root{
--skb-canvas:#f2efe9; --skb-paper:#ffffff; --skb-insert:#e7efe9;
--skb-ink:#15211d; --skb-muted:#5d6a64;
--skb-pine:#0f5c4a; --skb-pine-d:#0a4034;
--skb-cta:#9e2a3c; --skb-cta-h:#7f2130;
--skb-rule:#ddd7cb; --skb-rule-s:#efeae0;
--skb-text:760px; --skb-wide:888px; --skb-band:1120px;
--skb-sheet:36px; /* поле листа */
--skb-pad:20px; /* полоса во всю ширину */
--skb-gap:16px; /* карточка внутри контента */
--skb-r1:16px; --skb-r2:28px; --skb-r3:48px; /* вертикальный ритм */
--skb-shadow:0 1px 0 rgba(21,33,29,.04),0 10px 30px -18px rgba(21,33,29,.28);
}
@media(max-width:900px){:root{--skb-sheet:16px;--skb-pad:14px;--skb-r3:32px}}
/* ============================================================ 2. БАЗА */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.skb-page{margin:0;background:var(--skb-canvas);color:var(--skb-ink);
font:400 17px/1.65 'SkbText',-apple-system,'Segoe UI',Arial,sans-serif;
text-rendering:optimizeLegibility}
body.skb-page img,body.skb-page svg{max-width:100%;height:auto}
body.skb-page img{border:0}
:where(body.skb-page a){color:var(--skb-pine);text-decoration:underline;
text-decoration-thickness:1px;text-underline-offset:2px}
:where(body.skb-page a:hover){color:var(--skb-pine-d)}
:where(body.skb-page h1,body.skb-page h2,body.skb-page h3,body.skb-page h4,
body.skb-page .h3,body.skb-page .title){
hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;word-break:normal}
body.skb-page p,body.skb-page ul,body.skb-page ol,body.skb-page table{overflow-wrap:break-word}
body.skb-page hr{border:0;border-top:1px solid var(--skb-rule);margin:var(--skb-r2) 0}
.skb-skip{position:absolute;left:-9999px}
.skb-skip:focus{left:8px;top:8px;z-index:99;background:#fff;padding:8px 12px;border:2px solid var(--skb-pine)}
body.skb-page :focus-visible{outline:2px solid var(--skb-cta);outline-offset:2px}
/* ------ сброс бутстраповских обёрток донора (только габариты, §05 05.14) */
body.skb-page .container,body.skb-page .container-fluid{
width:auto!important;max-width:100%!important;margin:0!important;padding:0!important;float:none!important}
body.skb-page .row{margin:0!important;width:auto!important;float:none!important;
display:block!important}
body.skb-page [class*="col-xs-"],body.skb-page [class*="col-sm-"],
body.skb-page [class*="col-md-"],body.skb-page [class*="col-lg-"],
body.skb-page [class*="col-xxs-"]{
width:100%!important;max-width:100%!important;float:none!important;
margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}
body.skb-page .pull-right,body.skb-page .pull-left{float:none!important}
body.skb-page .hidden-xs,body.skb-page .visible-xs{display:initial}
body.skb-page .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
body.skb-page .list-inline{list-style:none;padding:0}
/* ============================================================ 3. ХЕДЕР */
.skb-hd{background:var(--skb-paper);border-bottom:1px solid var(--skb-rule)}
.skb-hd-in{max-width:var(--skb-band);margin:0 auto;padding:14px var(--skb-pad);
display:flex;align-items:center;gap:20px}
.skb-logo{display:flex;align-items:center;gap:10px;text-decoration:none!important;
color:var(--skb-ink);flex:0 0 auto}
.skb-logo svg{width:42px;height:42px;display:block}
.skb-logo b{font:700 22px/1.1 'SkbHead',Georgia,serif;letter-spacing:.01em}
.skb-logo i{display:block;font:400 11.5px/1.3 'SkbText',sans-serif;font-style:normal;
color:var(--skb-muted);letter-spacing:.06em;text-transform:uppercase}
.skb-nav{margin-left:auto}
.skb-nav>ul{display:flex;gap:2px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.skb-nav>ul>li{position:relative}
.skb-nav>ul>li>a,.skb-nav>ul>li>span{display:block;padding:10px 12px;cursor:pointer;
font:600 14.5px/1.2 'SkbText',sans-serif;color:var(--skb-ink);text-decoration:none!important;
border-radius:3px}
.skb-nav>ul>li>span::after{content:"";display:inline-block;width:8px;height:8px;margin-left:7px;
vertical-align:1px;background:currentColor;
-webkit-mask:var(--skb-i-caret) center/8px 8px no-repeat;mask:var(--skb-i-caret) center/8px 8px no-repeat;
opacity:.55}
.skb-nav>ul>li:hover>a,.skb-nav>ul>li:hover>span,.skb-nav>ul>li:focus-within>a,
.skb-nav>ul>li:focus-within>span{background:var(--skb-insert);color:var(--skb-pine-d)}
.skb-nav .skb-drop{position:absolute;left:0;top:100%;z-index:40;min-width:268px;
background:var(--skb-paper);border:1px solid var(--skb-rule);box-shadow:var(--skb-shadow);
list-style:none;margin:0;padding:8px;visibility:hidden;opacity:0;transition:opacity .12s}
.skb-nav>ul>li:hover>.skb-drop,.skb-nav>ul>li:focus-within>.skb-drop{visibility:visible;opacity:1}
.skb-nav>ul>li:nth-last-child(-n+2)>.skb-drop{left:auto;right:0}
.skb-nav .skb-drop a{display:block;padding:7px 10px;font:400 15px/1.35 'SkbText',sans-serif;
color:var(--skb-ink);text-decoration:none!important;border-radius:3px}
.skb-nav .skb-drop a:hover{background:var(--skb-insert);color:var(--skb-pine-d)}
.skb-nav-t,.skb-burger{display:none}
/* плашка доверия под мачтой */
.skb-trust{background:var(--skb-insert);border-top:1px solid var(--skb-rule)}
.skb-trust-in{max-width:var(--skb-band);margin:0 auto;padding:8px var(--skb-pad);
display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center;
font:600 12.5px/1.5 'SkbText',sans-serif;letter-spacing:.05em;text-transform:uppercase;
color:var(--skb-pine)}
.skb-trust-in span{display:flex;align-items:center;gap:7px}
.skb-trust-in span::before{content:"";width:14px;height:14px;flex:0 0 14px;background:currentColor;
-webkit-mask:var(--skb-i-check) center/14px 14px no-repeat;mask:var(--skb-i-check) center/14px 14px no-repeat}
.skb-trust-in .skb-age::before{-webkit-mask:var(--skb-i-age) center/14px 14px no-repeat;mask:var(--skb-i-age) center/14px 14px no-repeat}
.skb-trust-in .skb-lic::before{-webkit-mask:var(--skb-i-shield) center/14px 14px no-repeat;mask:var(--skb-i-shield) center/14px 14px no-repeat}
/* ============================================================ 4. КАРКАС СТРАНИЦЫ */
.skb-main{padding:32px var(--skb-pad) var(--skb-r3)}
@media(max-width:900px){.skb-main{padding-top:20px}}
.skb-crumbs{max-width:calc(var(--skb-wide) + var(--skb-sheet)*2);margin:0 auto 12px;
font:400 13px/1.5 'SkbText',sans-serif;color:var(--skb-muted)}
.skb-crumbs a{color:var(--skb-muted)}
.skb-crumbs b{font-weight:600;color:var(--skb-ink)}
.skb-crumbs span{padding:0 6px;opacity:.6}
.skb-paper{max-width:calc(var(--skb-wide) + var(--skb-sheet)*2);margin:0 auto;
background:var(--skb-paper);border:1px solid var(--skb-rule);box-shadow:var(--skb-shadow);
padding:var(--skb-sheet)}
/* текстовая колонка 760 внутри листа 888 */
.skb-paper>*{max-width:var(--skb-text);margin-left:auto;margin-right:auto}
.skb-paper>.skbv-wrap,
.skb-paper>.skb-hub,.skb-paper>.skb-cards,.skb-paper>table,
.skb-paper>.product-list,.skb-paper>.pros_cons_box,.skb-paper>.sticky-toc-wrapper{max-width:100%}
/* шапка материала */
.skb-kicker{font:600 12.5px/1.4 'SkbText',sans-serif;letter-spacing:.06em;text-transform:uppercase;
color:var(--skb-pine);margin:0 0 8px}
.skb-kicker a{color:inherit;text-decoration:none!important}
.skb-kicker a:hover{text-decoration:underline!important}
body.skb-page h1{font:600 34px/1.22 'SkbHead',Georgia,serif;margin:0 0 10px;letter-spacing:-.005em}
.skb-meta{font:400 13.5px/1.5 'SkbText',sans-serif;color:var(--skb-muted);margin:0 0 var(--skb-r2);
padding-bottom:var(--skb-r1);border-bottom:1px solid var(--skb-rule)}
.skb-meta b{font-weight:600;color:var(--skb-ink)}
.skb-meta span{padding:0 8px;opacity:.5}
/* ============================================================ 5. ТИПОГРАФИКА */
body.skb-page h2{font:600 24px/1.3 'SkbHead',Georgia,serif;margin:var(--skb-r3) 0 var(--skb-r1);
padding-top:var(--skb-r1);border-top:1px solid var(--skb-rule)}
body.skb-page h2:first-child{margin-top:0;padding-top:0;border-top:0}
body.skb-page h3,body.skb-page .h3{font:600 19px/1.35 'SkbHead',Georgia,serif;
margin:var(--skb-r2) 0 10px}
body.skb-page h4{font:600 16.5px/1.4 'SkbText',sans-serif;margin:var(--skb-r2) 0 8px}
body.skb-page p{margin:0 0 var(--skb-r1)}
body.skb-page ul,body.skb-page ol{margin:0 0 var(--skb-r1);padding-left:22px}
body.skb-page li{margin-bottom:7px}
body.skb-page li>ul,body.skb-page li>ol{margin-top:7px}
body.skb-page strong,body.skb-page b{font-weight:600}
body.skb-page blockquote{margin:var(--skb-r2) 0;padding:18px 22px;background:var(--skb-insert);
border-left:3px solid var(--skb-pine);font:400 17px/1.6 'SkbText',sans-serif}
body.skb-page blockquote p:last-child{margin:0}
body.skb-page .internal_anchor{display:block;position:relative;top:-90px;visibility:hidden}
body.skb-page small{font-size:13.5px;color:var(--skb-muted)}
/* первая картинка материала — обтекание (§13) */
.skb-float{float:right;width:clamp(170px,32%,300px);margin:4px 0 var(--skb-r1) var(--skb-r2);
border:1px solid var(--skb-rule);background:var(--skb-paper)}
.skb-float img{display:block;width:100%}
.skb-cap{font:400 12.5px/1.45 'SkbText',sans-serif;color:var(--skb-muted);
padding:8px 10px;border-top:1px solid var(--skb-rule-s)}
.skb-cap b{font-weight:600;color:var(--skb-ink)}
/* ============================================================ 6. ОГЛАВЛЕНИЕ (своё, свёрнутое) */
.skb-toc{margin:0 auto var(--skb-r2);border:1px solid var(--skb-rule);background:var(--skb-insert)}
.skb-toc>summary{cursor:pointer;list-style:none;padding:12px 16px;
font:600 14px/1.3 'SkbText',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--skb-pine-d);
display:flex;align-items:center;gap:10px}
.skb-toc>summary::-webkit-details-marker{display:none}
.skb-toc>summary::after{content:"";width:12px;height:12px;margin-left:auto;background:currentColor;
-webkit-mask:var(--skb-i-caret) center/12px 12px no-repeat;mask:var(--skb-i-caret) center/12px 12px no-repeat;
transition:transform .15s}
.skb-toc[open]>summary::after{transform:rotate(180deg)}
.skb-toc ol{margin:0;padding:0 16px 14px 34px;counter-reset:skbtoc}
.skb-toc li{margin:5px 0;font-size:15.5px}
.skb-toc a{color:var(--skb-pine-d)}
/* ============================================================ 7. ТАБЛИЦЫ */
body.skb-page table{width:100%;border-collapse:collapse;margin:0 0 var(--skb-r2);
font:400 15.5px/1.5 'SkbText',sans-serif;background:var(--skb-paper)}
body.skb-page caption{caption-side:top;text-align:left;font:600 14px/1.4 'SkbText',sans-serif;
color:var(--skb-muted);padding:0 0 8px}
/* Горизонтальный отступ в ячейке 15px + 1px рамка = зазор 16px: норма §2 на
1440/1024 (gate_padding.js мерит край блока → первый текст и считает рамку). */
body.skb-page th{background:var(--skb-pine);color:#fff;font-weight:600;text-align:left;
padding:11px 15px;border:1px solid var(--skb-pine)}
body.skb-page td{padding:11px 15px;border:1px solid var(--skb-rule);vertical-align:middle;
height:auto!important}
body.skb-page tr:nth-child(even) td{background:#fbfaf7}
body.skb-page #table-wrapper{overflow:visible;margin-bottom:var(--skb-r2)}
body.skb-page #table-wrapper table{margin:0}
body.skb-page td img{max-width:130px;height:auto!important}
/* карточная раскладка: узкий экран или 6+ колонок (§8) */
@media(max-width:640px){
body.skb-page table.skb-t,body.skb-page table.skb-t tbody,body.skb-page table.skb-t tr,
body.skb-page table.skb-t td{display:block;width:auto!important}
/* шапка таблицы прячется целиком: донор пишет | прямо в | ,
одного `thead{display:none}` не хватает — на /live-kasinot/ th вылезал за 390 px */
body.skb-page table.skb-t thead,body.skb-page table.skb-t th,
body.skb-page table.skb-t tr.skb-thr{display:none}
body.skb-page table.skb-t tr{border:1px solid var(--skb-rule);margin-bottom:12px;
background:var(--skb-paper)}
body.skb-page table.skb-t tr:nth-child(even) td{background:transparent}
/* метка НАД значением (§8 label→value): flex тут нельзя — в ячейке инлайновая
разметка, и каждый прогон текста стал бы отдельным flex-элементом */
body.skb-page table.skb-t td{border:0;border-bottom:1px solid var(--skb-rule-s);
padding:9px 14px}
body.skb-page table.skb-t td:last-child{border-bottom:0}
body.skb-page table.skb-t td[data-skb-l]::before{content:attr(data-skb-l);display:block;
margin-bottom:2px;font:600 11.5px/1.5 'SkbText',sans-serif;letter-spacing:.05em;
text-transform:uppercase;color:var(--skb-muted)}
}
body.skb-page table.skb-t6{display:block}
body.skb-page table.skb-t6 tbody,body.skb-page table.skb-t6 tr{display:block}
body.skb-page table.skb-t6 thead,body.skb-page table.skb-t6 th,
body.skb-page table.skb-t6 tr.skb-thr{display:none}
body.skb-page table.skb-t6 tr{border:1px solid var(--skb-rule);margin-bottom:12px;padding:4px 0}
body.skb-page table.skb-t6 td{display:block;border:0;
border-bottom:1px solid var(--skb-rule-s);background:transparent!important}
body.skb-page table.skb-t6 tr td:last-child{border-bottom:0}
body.skb-page table.skb-t6 td[data-skb-l]::before{content:attr(data-skb-l);display:block;
margin-bottom:2px;font:600 11.5px/1.5 'SkbText',sans-serif;letter-spacing:.05em;
text-transform:uppercase;color:var(--skb-muted)}
/* ============================================================ 8. КНОПКИ И CTA */
body.skb-page .skb-cta,body.skb-page .btn{display:inline-block;padding:12px 22px;
background:var(--skb-cta);color:#fff!important;border:0;border-radius:2px;
font:600 15.5px/1.2 'SkbText',sans-serif;text-align:center;text-decoration:none!important;
cursor:pointer;transition:background .13s}
body.skb-page .skb-cta:hover,body.skb-page .btn:hover{background:var(--skb-cta-h);color:#fff!important}
body.skb-page .btn-block{display:block;width:100%}
body.skb-page .btn i{display:none}
/* ============================================================ 9. БЛОКИ ДОНОРА (§15b) */
/* 9.1 карточка-виджет бренда */
body.skb-page article.product{max-width:100%}
body.skb-page .section-content{margin:0}
body.skb-page .product-list{border:1px solid var(--skb-rule);background:var(--skb-paper);
margin:0 0 var(--skb-r2)}
body.skb-page .product-list>.caption{display:block;padding:0}
body.skb-page .flex-container-title{display:flex;gap:18px;align-items:center;
padding:18px 20px;border-bottom:1px solid var(--skb-rule);background:var(--skb-insert)}
body.skb-page .img-list-wrapper{flex:0 0 auto}
body.skb-page .img-list-wrapper img{display:block;width:106px;height:auto;
background:#fff;border:1px solid var(--skb-rule);padding:3px}
body.skb-page .title-wrapper{font:600 19px/1.35 'SkbHead',Georgia,serif;min-width:0}
body.skb-page .content-row{display:grid;grid-template-columns:1fr minmax(0,300px);gap:0}
body.skb-page .left-side{padding:18px 20px;min-width:0}
body.skb-page .right-side{padding:18px 20px;border-left:1px solid var(--skb-rule);
background:#fbfaf7;min-width:0}
body.skb-page .product-details-list table{margin:0;font-size:15px}
body.skb-page .product-details-list td{border:0;border-bottom:1px solid var(--skb-rule-s);
padding:8px 0;background:transparent!important}
body.skb-page .product-details-list tr:last-child td{border-bottom:0}
body.skb-page .product-details-list td:first-child{width:38%;
font:600 12.5px/1.6 'SkbText',sans-serif;letter-spacing:.04em;text-transform:uppercase;
color:var(--skb-muted)}
body.skb-page .svg-text{display:none}
body.skb-page .box-title .title{background:transparent!important;color:var(--skb-pine)!important;
font:600 12.5px/1.4 'SkbText',sans-serif!important;letter-spacing:.06em;text-transform:uppercase;
padding:0 0 10px}
body.skb-page .product-buybox .container-top{padding:0}
body.skb-page .product-price p{margin:0;font:600 26px/1.2 'SkbHead',Georgia,serif;color:var(--skb-ink)}
body.skb-page .product-price strong{font-weight:600}
body.skb-page .price-hint{font-size:14.5px;color:var(--skb-muted);margin:4px 0 14px}
body.skb-page .lockpad{position:relative;padding-left:18px;margin-top:10px;
font:400 12.5px/1.5 'SkbText',sans-serif;color:var(--skb-muted)}
body.skb-page .lockpad i{position:absolute;left:0;top:3px;
width:12px;height:12px;background:currentColor;
-webkit-mask:var(--skb-i-lock) center/12px 12px no-repeat;mask:var(--skb-i-lock) center/12px 12px no-repeat}
body.skb-page .payment-methods{margin-top:12px}
body.skb-page .payment-methods .label{font:600 11.5px/1.5 'SkbText',sans-serif;letter-spacing:.06em;
text-transform:uppercase;color:var(--skb-muted)}
body.skb-page .container-payment-methods{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
body.skb-page .container-payment-methods img{height:20px;width:auto}
body.skb-page .terms-conditions-container{padding:0 20px 16px;font-size:13px;color:var(--skb-muted)}
body.skb-page .terms-container-box:empty{display:none}
/* 9.2 донорское оглавление-полоска */
body.skb-page .sticky-toc-wrapper{margin:0 0 var(--skb-r2)}
body.skb-page .sticky-toc{border:1px solid var(--skb-rule);background:var(--skb-insert);
padding:8px 10px}
body.skb-page .sticky-toc-prev{display:none}
body.skb-page .swiper-container{overflow:visible}
body.skb-page .swiper-wrapper{display:flex;flex-wrap:wrap;gap:8px;transform:none!important}
body.skb-page .swiper-slide{width:auto!important;padding:6px 12px;background:var(--skb-paper);
border:1px solid var(--skb-rule);font:600 13.5px/1.3 'SkbText',sans-serif;
color:var(--skb-pine-d);text-decoration:none!important}
body.skb-page .swiper-slide:hover{background:var(--skb-pine);color:#fff}
body.skb-page .swiper-slide:empty{display:none}
/* 9.3 плюсы/минусы — только положительные чипы не требуются, это таблица суждений */
body.skb-page .pros_cons_box{display:grid;grid-template-columns:1fr 1fr;gap:var(--skb-gap);
margin:0 0 var(--skb-r2)}
body.skb-page .pros_cons_box>.col{min-width:0}
body.skb-page .pros,body.skb-page .cons{height:100%;border:1px solid var(--skb-rule);
background:var(--skb-paper);padding:16px 18px}
body.skb-page .pros{background:var(--skb-insert)}
body.skb-page .pros .title,body.skb-page .cons .title{font:600 16px/1.35 'SkbHead',Georgia,serif;
margin:0 0 10px;padding:0;background:transparent}
body.skb-page .pros-list,body.skb-page .cons-list{list-style:none;margin:0;padding:0}
body.skb-page .pros-list li,body.skb-page .cons-list li{position:relative;padding-left:24px;
margin-bottom:9px;font-size:15.5px;line-height:1.5}
body.skb-page .pros-list li>i,body.skb-page .cons-list li>i{position:absolute;left:0;top:5px;
width:15px;height:15px;background:var(--skb-pine)}
body.skb-page .pros-list li>i{-webkit-mask:var(--skb-i-check) center/15px 15px no-repeat;mask:var(--skb-i-check) center/15px 15px no-repeat}
body.skb-page .cons-list li>i{background:var(--skb-muted);
-webkit-mask:var(--skb-i-minus) center/15px 15px no-repeat;mask:var(--skb-i-minus) center/15px 15px no-repeat}
body.skb-page .pros-list strong,body.skb-page .cons-list strong{font-weight:600}
/* 9.4 иконки font-awesome донора, шрифт снят — рисуем своими масками */
body.skb-page i.fa{display:inline-block;width:1em;height:1em;vertical-align:-2px;
background:currentColor;-webkit-mask-position:center;mask-position:center;
-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
-webkit-mask-size:contain;mask-size:contain}
body.skb-page i.fa-check{-webkit-mask-image:var(--skb-i-check);mask-image:var(--skb-i-check);color:var(--skb-pine)}
body.skb-page i.fa-times{-webkit-mask-image:var(--skb-i-minus);mask-image:var(--skb-i-minus);color:var(--skb-muted)}
/* звёзд в разметке нет: донорская оценка «4.8/5» снята как число без источника
(su_05_skin.py, no_scores) — правила для i.fa-star* сняты вместе с ней */
body.skb-page i.fa-lock{-webkit-mask-image:var(--skb-i-lock);mask-image:var(--skb-i-lock)}
body.skb-page i.fa-chevron-left,body.skb-page i.fa-play-circle{display:none}
body.skb-page .skb-yes{display:inline-block;width:15px;height:15px;vertical-align:-2px;
background:var(--skb-pine);
-webkit-mask:var(--skb-i-check) center/15px 15px no-repeat;mask:var(--skb-i-check) center/15px 15px no-repeat}
/* ============================================================ 10. СВОИ БЛОКИ */
/* 10.1 ряд иконок-действий под шапкой материала (композиция casino.co.uk) */
.skb-acts{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:0 auto var(--skb-r2);
max-width:100%!important}
.skb-acts a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px;
border:1px solid var(--skb-rule);background:var(--skb-paper);text-decoration:none!important;
color:var(--skb-ink);font:600 12.5px/1.3 'SkbText',sans-serif;text-align:center}
.skb-acts a:hover{background:var(--skb-insert);border-color:var(--skb-pine)}
.skb-acts i{width:26px;height:26px;background:var(--skb-pine);
-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
-webkit-mask-size:contain;mask-size:contain}
.skb-acts .i-slot{-webkit-mask-image:var(--skb-i-slot);mask-image:var(--skb-i-slot)}
.skb-acts .i-live{-webkit-mask-image:var(--skb-i-live);mask-image:var(--skb-i-live)}
.skb-acts .i-card{-webkit-mask-image:var(--skb-i-card);mask-image:var(--skb-i-card)}
.skb-acts .i-wheel{-webkit-mask-image:var(--skb-i-wheel);mask-image:var(--skb-i-wheel)}
.skb-acts .i-pay{-webkit-mask-image:var(--skb-i-pay);mask-image:var(--skb-i-pay)}
.skb-acts .i-gift{-webkit-mask-image:var(--skb-i-gift);mask-image:var(--skb-i-gift)}
/* 10.2 блок ценности (текст — 09.25) */
.skb-value{border:1px solid var(--skb-rule);border-left:3px solid var(--skb-pine);
background:var(--skb-insert);padding:18px 20px;margin:0 auto var(--skb-r2)}
.skb-value h2{margin:0 0 10px!important;padding:0!important;border:0!important;font-size:19px!important}
.skb-value ul{list-style:none;margin:0;padding:0}
/* ⚠️ иконка — абсолютом, а не flex-элементом: у li есть инлайновая разметка (),
при display:flex каждый текстовый прогон становится отдельным flex-элементом
и строка не переносится — ровно так на 390 px вылезало 608 px. */
.skb-value li{position:relative;padding-left:24px;margin-bottom:8px;font-size:15.5px;
line-height:1.5}
.skb-value li::before{content:"";position:absolute;left:0;top:5px;width:15px;height:15px;
background:var(--skb-pine);
-webkit-mask:var(--skb-i-check) center/15px 15px no-repeat;mask:var(--skb-i-check) center/15px 15px no-repeat}
.skb-value p:last-child{margin-bottom:0}
/* 10.3 карточки раздела (хабы и «читай дальше») — манера postimees */
.skb-cards{margin:0 auto var(--skb-r3);max-width:100%!important}
.skb-cards>h2{max-width:var(--skb-text);margin-left:auto;margin-right:auto}
.skb-cards-l{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--skb-gap);
list-style:none;margin:0;padding:0}
.skb-cards-l li{margin:0;display:flex}
.skb-card{display:flex;flex-direction:column;width:100%;border:1px solid var(--skb-rule);
background:var(--skb-paper);padding:16px 18px;text-decoration:none!important;color:var(--skb-ink)}
.skb-card:hover{border-color:var(--skb-pine);background:var(--skb-insert)}
.skb-card .skb-ck{font:600 11.5px/1.4 'SkbText',sans-serif;letter-spacing:.06em;
text-transform:uppercase;color:var(--skb-pine);margin-bottom:7px}
.skb-card b{font:600 17px/1.32 'SkbHead',Georgia,serif;font-weight:600;margin-bottom:7px}
.skb-card em{font-style:normal;font-size:14.5px;line-height:1.5;color:var(--skb-muted)}
.skb-cards-row{list-style:none;margin:0;padding:0;border-top:1px solid var(--skb-rule)}
.skb-cards-row li{margin:0;border-bottom:1px solid var(--skb-rule)}
.skb-row{display:grid;grid-template-columns:132px 1fr;gap:16px;padding:14px 0;
text-decoration:none!important;color:var(--skb-ink);align-items:start}
.skb-row img{display:block;width:100%;border:1px solid var(--skb-rule)}
.skb-row .skb-ck{font:600 11.5px/1.4 'SkbText',sans-serif;letter-spacing:.06em;
text-transform:uppercase;color:var(--skb-pine)}
.skb-row b{display:block;font:600 18px/1.3 'SkbHead',Georgia,serif;margin:5px 0}
.skb-row em{font-style:normal;font-size:14.5px;color:var(--skb-muted)}
.skb-row:hover b{color:var(--skb-pine-d)}
/* 10.4 FAQ — развёрнут всегда */
.skb-faq{margin:0 auto var(--skb-r3)}
.skb-faq-i{border:1px solid var(--skb-rule);background:var(--skb-paper);padding:16px 18px;
margin-bottom:10px}
.skb-faq-i h3{margin:0 0 8px;font-size:17.5px}
.skb-faq-i p:last-child{margin:0}
/* 10.6 автор */
.skb-author{border-top:1px solid var(--skb-rule);margin:var(--skb-r3) auto 0;padding-top:var(--skb-r2)}
.skb-author>b{display:block;font:600 11.5px/1.4 'SkbText',sans-serif;letter-spacing:.06em;
text-transform:uppercase;color:var(--skb-muted);margin-bottom:10px}
.skb-author-in{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
.skb-author-av{width:44px;height:44px;border-radius:50%;background:var(--skb-pine);color:#fff;
display:flex;align-items:center;justify-content:center;
font:600 17px/1 'SkbHead',Georgia,serif}
.skb-author-n{font:600 16.5px/1.35 'SkbText',sans-serif;margin:0 0 4px}
.skb-author-t{font-size:15px;line-height:1.55;color:var(--skb-muted);margin:0}
.skb-author-d{font-size:13px;color:var(--skb-muted);margin-top:8px}
body.skb-page #author-review-comments{display:none}
/* ============================================================ 11. ВИТРИНА (ЭТАП 08) */
/* Разметку печатает su_08_showcase.py: section.skbv-wrap → h2, p.skbv-sub, скрытые
input.skbv-f (radio-оси + checkbox «показать остальные»), ul.skbv-fr (таблетки),
ul.skbv-list>li (строка: rk/tile/id/off/act + details), label.skbv-sh, p.skbv-note.
Фильтр — чистый CSS: input стоят ДО списка, селекторы идут через `~`.
⚠️ Порядок правил: сначала «показать скрытые», ПОТОМ «спрятать неподходящие».
Специфичность у них одинаковая (0,5,1) — решает порядок, и при обратном показ
остальных перебивает фильтр: gate_render R10 видит «фильтр не режет». */
.skbv-wrap{position:relative;margin:0 auto var(--skb-r3);max-width:100%!important}
.skbv-wrap>h2{margin-bottom:10px!important}
.skbv-sub{max-width:var(--skb-text);margin:0 0 var(--skb-r1);
font:400 14.5px/1.55 'SkbText',sans-serif;color:var(--skb-muted)}
.skbv-sub b{color:var(--skb-ink);font-weight:600}
/* поле не `display:none`: скрытому так полю часть браузеров не отдаёт :checked,
а gate_render R10 щёлкает его через `.checked = true` и ждёт реакции списка */
.skbv-f{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none;
clip-path:inset(50%)}
.skbv-fr{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 var(--skb-r1);padding:0}
.skbv-fr li{margin:0}
.skbv-fr label{display:inline-flex;align-items:center;min-height:40px;padding:0 15px;
border:1px solid var(--skb-rule);background:var(--skb-paper);color:var(--skb-ink);
font:600 13.5px/1.2 'SkbText',sans-serif;cursor:pointer;-webkit-user-select:none;user-select:none}
.skbv-fr label:hover{border-color:var(--skb-pine);background:var(--skb-insert)}
.skbv-f[id^="skbv-f0-"]:checked~.skbv-fr label[for^="skbv-f0-"],
.skbv-f[id^="skbv-f1-"]:checked~.skbv-fr label[for^="skbv-f1-"],
.skbv-f[id^="skbv-f2-"]:checked~.skbv-fr label[for^="skbv-f2-"],
.skbv-f[id^="skbv-f3-"]:checked~.skbv-fr label[for^="skbv-f3-"]{
background:var(--skb-pine);border-color:var(--skb-pine);color:#fff}
.skbv-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--skb-pine)}
.skbv-list>li{display:grid;grid-template-columns:22px 180px minmax(200px,1fr) 224px 158px;
grid-template-areas:"rk tile id off act" "det det det det det";
gap:8px 14px;align-items:center;margin:0;padding:12px 0;
border-bottom:1px solid var(--skb-rule)}
.skbv-list>li:hover{background:#fbfaf7}
.skbv-rk{grid-area:rk;font:600 19px/1 'SkbHead',Georgia,serif;color:var(--skb-muted);
text-align:center}
/* Плитка знака: белая подложка и пропорции ПО ЗНАКУ — это меряет gate_render R15.
Поле 170x102 при мастере 336xH даёт длинную сторону ≥100 px даже у квадратного
(336x336 → 102x102) и долю площади ≈60 % у медианного мастера (336x123). */
.skbv-tile{grid-area:tile;display:block;width:180px;height:112px;padding:4px;
border:1px solid var(--skb-rule);background:#fff}
/* ⚠️ селектор с body: общее правило `body.skb-page img{height:auto}` (0,1,2) бьёт
`.skbv-tile img` (0,1,1) — знак растёт по своим пропорциям и вылезает из плитки,
и это видит только браузер (gate_render R15 «вылез за плитку»: 47 плиток). */
body.skb-page .skbv-tile img{display:block;width:100%;height:100%;object-fit:contain}
.skbv-id{grid-area:id;min-width:0}
.skbv-nm{display:block;font:600 18.5px/1.28 'SkbHead',Georgia,serif;color:var(--skb-ink)}
.skbv-sc{display:block;margin-top:3px;font:400 12.5px/1.45 'SkbText',sans-serif;
color:var(--skb-muted)}
.skbv-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.skbv-chips span{padding:2px 7px;border:1px solid var(--skb-rule);background:var(--skb-insert);
font:600 11px/1.55 'SkbText',sans-serif;letter-spacing:.04em;text-transform:uppercase;
color:var(--skb-pine-d)}
.skbv-off{grid-area:off;min-width:0;text-align:center}
.skbv-ol{display:block;font:600 10.5px/1.4 'SkbText',sans-serif;letter-spacing:.07em;
text-transform:uppercase;color:var(--skb-muted)}
.skbv-oa{display:block;margin-top:2px;font:600 18px/1.25 'SkbHead',Georgia,serif;
color:var(--skb-ink)}
.skbv-os{display:block;margin-top:2px;font:600 13.5px/1.35 'SkbText',sans-serif;
color:var(--skb-pine-d)}
.skbv-ot{display:block;margin-top:4px;font:400 11.5px/1.4 'SkbText',sans-serif;
color:var(--skb-muted)}
.skbv-act{grid-area:act;text-align:center}
body.skb-page .skbv-cta{display:block;padding:12px 8px;background:var(--skb-cta);
color:#fff!important;border:0;border-radius:2px;font:600 14.5px/1.2 'SkbText',sans-serif;
text-align:center;text-decoration:none!important}
body.skb-page .skbv-cta:hover{background:var(--skb-cta-h);color:#fff!important}
.skbv-fine{display:block;margin-top:6px;font:400 11px/1.4 'SkbText',sans-serif;
color:var(--skb-muted)}
.skbv-d{grid-area:det;margin:0}
.skbv-d>summary{display:inline-flex;align-items:center;gap:7px;padding:4px 0;
font:600 13px/1.35 'SkbText',sans-serif;color:var(--skb-pine-d);cursor:pointer;
list-style:none}
.skbv-d>summary::-webkit-details-marker{display:none}
.skbv-d>summary::after{content:"";display:block;width:12px;height:12px;
background:var(--skb-pine-d);
-webkit-mask:var(--skb-i-caret) center/12px 12px no-repeat;mask:var(--skb-i-caret) center/12px 12px no-repeat}
.skbv-d[open]>summary::after{transform:rotate(180deg)}
.skbv-dl{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:6px}
.skbv-dl span{font:400 13px/1.5 'SkbText',sans-serif;color:var(--skb-muted)}
.skbv-dl b{color:var(--skb-ink);font-weight:600}
.skbv-rev{display:inline-block;margin-top:7px;font-size:13.5px}
/* 1) показать остальные.
⚠️ `.skbv-hid` (0,1,0) слабее `.skbv-list>li` (0,1,1) — без `li` в селекторе
скрытые строки видны все сразу, и gate_render считает «показать остальные»
мёртвым фильтром (before == after). */
.skbv-list>li.skbv-hid{display:none}
.skbv-f[id^="skbv-sh-"]:checked~.skbv-list>li.skbv-hid{display:grid}
.skbv-sh{display:flex;align-items:center;justify-content:center;min-height:46px;
margin-top:var(--skb-r1);padding:8px 16px;border:1px solid var(--skb-rule);
background:var(--skb-insert);color:var(--skb-pine-d);
font:600 14.5px/1.2 'SkbText',sans-serif;text-align:center;cursor:pointer}
.skbv-sh:hover{background:var(--skb-paper);border-color:var(--skb-pine)}
.skbv-sh>span:last-child{display:none}
.skbv-f[id^="skbv-sh-"]:checked~.skbv-sh>span:first-child{display:none}
.skbv-f[id^="skbv-sh-"]:checked~.skbv-sh>span:last-child{display:inline}
/* 2) спрятать неподходящие — строго ПОСЛЕ показа остальных */
.skbv-f[id^="skbv-f1-"]:checked~.skbv-list>li:not([data-f1]),
.skbv-f[id^="skbv-f2-"]:checked~.skbv-list>li:not([data-f2]),
.skbv-f[id^="skbv-f3-"]:checked~.skbv-list>li:not([data-f3]){display:none}
.skbv-note{margin:var(--skb-r1) 0 0;font:400 12.5px/1.5 'SkbText',sans-serif;
color:var(--skb-muted)}
@media(max-width:1000px){
/* Телефон: знак и название в строке 1, кнопка и предложение в строке 2, детали в 3.
Номер — плашкой в углу плитки: отдельная колонка на 390 px съедала бы четверть
ширины названия. Три полосы вместо четырёх: у четырёх медиана строки выходила
335 px, а gate_render R9 принимает 150–290 (эталон 200). Ярлык предложения и
подпись «18+» на телефоне сняты — то же написано в сноске под витриной. */
.skbv-list>li{grid-template-columns:132px minmax(0,1fr);
grid-template-areas:"tile id" "act off" "det det";
gap:10px;padding:12px 0;align-items:start}
.skbv-rk{grid-area:tile;justify-self:start;align-self:start;z-index:1;
display:flex;align-items:center;justify-content:center;width:24px;height:24px;
background:var(--skb-pine);color:#fff;font-size:13px}
/* поле 120x92: у квадратного мастера длинная сторона 92 px — пол R15 на телефоне 90 */
.skbv-tile{width:132px;height:104px;padding:5px}
.skbv-nm{font-size:16.5px}
.skbv-sc{font-size:12px}
.skbv-chips span:nth-child(n+3){display:none}
.skbv-off{text-align:left}
.skbv-ol{display:none}
.skbv-oa{margin-top:0;font-size:17px}
.skbv-act{align-self:start}
.skbv-fine{display:none}
.skbv-fr label{min-height:44px}
}
/* 11.2 БЛОК КЛАСТЕРА (ЭТАП 08) — вместо витрины на навигационных хабах */
.skb-hub{margin:0 auto var(--skb-r3);max-width:100%!important}
.skb-hub>h2{max-width:var(--skb-text);margin-left:auto;margin-right:auto}
.skb-hl{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--skb-gap);
list-style:none;margin:0;padding:0}
.skb-hl li{display:flex;margin:0}
.skb-hc{display:flex;flex-direction:column;width:100%;border:1px solid var(--skb-rule);
background:var(--skb-paper);color:var(--skb-ink);text-decoration:none!important}
.skb-hc:hover{border-color:var(--skb-pine)}
.skb-hc:hover .skb-hc-t{color:var(--skb-pine-d)}
.skb-hc-im{display:block;background:var(--skb-insert)}
.skb-hc-im img{display:block;width:100%;height:auto;aspect-ratio:312/188;object-fit:cover;
border-bottom:1px solid var(--skb-rule)}
.skb-hc-t{display:block;padding:14px 16px 0;font:600 17px/1.32 'SkbHead',Georgia,serif}
.skb-hc-d{display:block;padding:7px 16px 16px;font:400 14px/1.5 'SkbText',sans-serif;
color:var(--skb-muted)}
/* хаб руководств: подпись вынесена из ссылки, рамку карточки держит сам */
.skb-hl li.skb-hc-w{flex-direction:column;border:1px solid var(--skb-rule);
background:var(--skb-paper)}
.skb-hc-w:hover{border-color:var(--skb-pine)}
.skb-hc-w>.skb-hc{border:0}
@media(max-width:900px){.skb-hl{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.skb-hl{grid-template-columns:1fr}}
/* 11.3 врезка-подводка перед витриной */
.skb-lead{font:400 17.5px/1.6 'SkbText',sans-serif;color:var(--skb-muted);
margin:0 0 var(--skb-r2)}
/* ============================================================ 12. ПОДВАЛ */
.skb-ft{background:var(--skb-pine);color:#e9f0ec;margin-top:var(--skb-r3)}
.skb-ft-in{max-width:var(--skb-band);margin:0 auto;padding:var(--skb-r3) var(--skb-pad) var(--skb-r2)}
.skb-ft-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--skb-r2)}
.skb-ft h2{font:600 13px/1.4 'SkbText',sans-serif!important;letter-spacing:.07em;
/* #a9c6bb на хвое давало 4,33 — ниже нормы 4,5 (gate_render R3) */
text-transform:uppercase;color:#b8d2c8;margin:0 0 12px!important;padding:0!important;border:0!important}
.skb-ft p{font-size:14.5px;line-height:1.6;color:#cfdfd8;margin:0 0 12px}
.skb-ft ul{list-style:none;margin:0;padding:0}
.skb-ft li{margin-bottom:8px;font-size:14.5px}
:where(body.skb-page .skb-ft a){color:#fff;text-decoration:none}
:where(body.skb-page .skb-ft a:hover){color:#fff;text-decoration:underline}
.skb-ft-help{border:1px solid rgba(255,255,255,.22);padding:14px 16px}
.skb-ft-help b{display:block;font-size:14.5px;margin-bottom:6px;color:#fff}
.skb-ft-bot{border-top:1px solid rgba(255,255,255,.18);margin-top:var(--skb-r2);
padding-top:var(--skb-r1);display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;
font-size:13.5px;color:#bcd2c9}
.skb-ft-bot .skb-18{flex:0 0 auto;width:34px;height:34px;border:2px solid #fff;border-radius:50%;
display:flex;align-items:center;justify-content:center;font:600 13px/1 'SkbText',sans-serif;color:#fff}
.skb-ft-bot ul{display:flex;flex-wrap:wrap;gap:8px 18px;margin-left:auto}
/* ============================================================ 13. МОБИЛКА */
@media(max-width:900px){
.skb-hd-in{flex-wrap:wrap;gap:12px}
/* Бургер — полоса на всю ширину внутри