/* [safv:css] casinosafest.com — витрина «гроссбух»: линейки вместо плашек,
   ранг кикером в поле, факты выносками, фильтр табами, кнопка с офсетной тенью.
   Шрифт не задаётся — наследуется от каркаса сайта. */
.safv-wrap{--v-ink:#0c1116;--v-mute:#5b6672;--v-rule:#d3dae2;--v-cta:#b01226;
  --v-cta-d:#8d0e1e;--v-sand:#f7f4ee;--v-ok:#1c7c3f;
  display:block;width:100%;margin:34px 0;padding:0;color:var(--v-ink);line-height:1.45}
.safv-wrap *{box-sizing:border-box}
.safv-wrap ul,.safv-wrap ol,.safv-wrap dl{margin:0;padding:0;list-style:none}
.safv-wrap li{margin:0;padding:0;list-style:none}
.safv-wrap li::before,.safv-wrap li::marker{content:none}
.safv-wrap dt,.safv-wrap dd,.safv-wrap p{margin:0}
.safv-wrap details{margin:0;padding:0;border:0;background:none}
.safv-wrap summary{display:block;list-style:none;cursor:pointer}
.safv-wrap summary::-webkit-details-marker{display:none}
.safv-wrap img{max-width:100%;height:auto}
.safv-wrap a{text-decoration:none}

/* [safv:css] шапка витрины */
.safv-h{margin:0 0 6px;font-size:1.55rem;line-height:1.18;letter-spacing:-.012em;color:var(--v-ink)}
.safv-up{margin:0 0 16px;padding-bottom:10px;font-size:.78rem;letter-spacing:.02em;
  color:var(--v-mute);border-bottom:2px solid var(--v-ink)}
.safv-up time{color:var(--v-ink);font-weight:600}

/* [safv:css] скрытые переключатели: fixed, иначе клик по label мотает страницу вверх */
.safv-more,.safv-tb{position:fixed;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none}

/* [safv:css] фильтр табами */
.safv-tabs{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--v-rule)}
.safv-tabs label{padding:10px 15px;margin-bottom:-1px;font-size:.78rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:var(--v-mute);cursor:pointer;
  border-bottom:3px solid transparent}
.safv-tabs label:hover{color:var(--v-ink)}
.safv-ti0:checked~.safv-tabs label:nth-of-type(1),
.safv-ti1:checked~.safv-tabs label:nth-of-type(2),
.safv-ti2:checked~.safv-tabs label:nth-of-type(3),
.safv-ti3:checked~.safv-tabs label:nth-of-type(4){color:var(--v-ink);border-bottom-color:var(--v-cta)}

/* [safv:css] строка-гроссбух */
.safv-list{border-top:1px solid var(--v-rule)}
.safv-list>li{display:grid;grid-template-columns:58px minmax(170px,1fr) minmax(215px,1.45fr) minmax(165px,.85fr);
  column-gap:22px;row-gap:12px;align-items:start;padding:20px 0 18px;border-bottom:1px solid var(--v-rule)}
.safv-list>li.safv-hid{display:none}
.safv-more:checked~.safv-list>li.safv-hid{display:grid}

/* [safv:css] ранг: редакторский кикер в поле, а не кружок и не полоса */
.safv-rk{grid-row:1/3;line-height:1;text-align:center}
.safv-rk span{display:block;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--v-mute)}
.safv-rk b{display:block;margin-top:3px;font-size:2.35rem;font-weight:700;letter-spacing:-.04em}
.safv-list>li:nth-child(1) .safv-rk b,
.safv-list>li:nth-child(2) .safv-rk b,
.safv-list>li:nth-child(3) .safv-rk b{color:var(--v-cta)}

/* [safv:css] бренд: плитка логотипа ВСЕГДА белая, знак ~77 % поля */
.safv-id{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.safv-lg{display:flex;align-items:center;justify-content:center;width:80px;height:80px;
  padding:9px;background:#fff;border:1px solid var(--v-rule)}
.safv-lg img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.safv-nm{font-size:1.04rem;font-weight:700;line-height:1.25}
.safv-nm a{color:var(--v-ink);border-bottom:1px solid var(--v-rule)}
.safv-nm a:hover{color:var(--v-cta);border-bottom-color:var(--v-cta)}
.safv-cp{padding:3px 8px;font-size:.66rem;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--v-cta);border:1px solid currentColor}
.safv-sc{display:flex;align-items:baseline;gap:5px;font-size:.7rem;color:var(--v-mute)}
.safv-sc b{font-size:1.3rem;font-weight:700;color:var(--v-ink);letter-spacing:-.02em}

/* [safv:css] факты выносками */
.safv-fx>div{display:flex;align-items:baseline;gap:7px;padding:3px 0}
.safv-fx dt{order:1;flex:0 0 auto;font-size:.72rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--v-mute)}
.safv-fx>div::after{content:"";order:2;flex:1 1 auto;min-width:12px;
  border-bottom:1px dotted var(--v-rule);transform:translateY(-3px)}
.safv-fx dd{order:3;flex:0 0 auto;font-size:.89rem;font-weight:600;text-align:right}

/* [safv:css] кассы */
.safv-py{grid-column:2/4;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.safv-py li{display:flex;align-items:center;height:28px;padding:0 7px;background:#fff;
  border:1px solid var(--v-rule)}
.safv-py img{height:16px;width:auto}
.safv-py span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.safv-pyn{font-size:.71rem;font-weight:600;color:var(--v-mute);border-style:dashed !important}

/* [safv:css] действие */
.safv-ac{display:flex;flex-direction:column;gap:9px}
.safv-go{display:block;padding:13px 12px;text-align:center;font-weight:700;font-size:.92rem;
  letter-spacing:.01em;color:#fff;background:var(--v-cta);border-radius:0;
  box-shadow:4px 4px 0 var(--v-ink);transition:transform .1s ease,box-shadow .1s ease,background .1s ease}
.safv-go:hover,.safv-go:focus{color:#fff;background:var(--v-cta-d);transform:translate(2px,2px);
  box-shadow:2px 2px 0 var(--v-ink)}
.safv-rv{text-align:center;font-size:.79rem;color:var(--v-mute);text-decoration:underline}
.safv-rv:hover{color:var(--v-ink)}

/* [safv:css] разворот «good to know» */
.safv-dt{grid-column:1/-1}
.safv-dt summary{display:inline-block;padding:5px 0;font-size:.74rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;color:var(--v-mute);border-bottom:1px solid var(--v-rule)}
.safv-dt summary:hover{color:var(--v-ink)}
.safv-dt summary::before{content:"+ "}
.safv-dt[open] summary::before{content:"\2013 "}
.safv-dtw{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;margin-top:10px;
  padding:14px 16px;background:var(--v-sand);border-left:3px solid var(--v-ink)}
.safv-pr li,.safv-cn li{position:relative;margin:5px 0;padding-left:21px;font-size:.85rem}
.safv-pr li::before{content:"";position:absolute;left:2px;top:.36em;width:9px;height:5px;
  border-left:2px solid var(--v-ok);border-bottom:2px solid var(--v-ok);transform:rotate(-45deg)}
.safv-cn li::before{content:"";position:absolute;left:2px;top:.62em;width:11px;height:2px;
  background:var(--v-mute)}

/* [safv:css] показать все */
.safv-mw{margin:18px 0 0;text-align:center}
.safv-btn{display:inline-block;padding:12px 28px;font-size:.82rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;cursor:pointer;color:var(--v-ink);
  border:2px solid var(--v-ink);box-shadow:4px 4px 0 var(--v-rule)}
.safv-btn:hover{color:#fff;background:var(--v-ink);box-shadow:4px 4px 0 var(--v-cta)}
.safv-more:checked~.safv-mw{display:none}
.safv-note{margin:16px 0 0;padding-top:11px;font-size:.75rem;line-height:1.5;
  color:var(--v-mute);border-top:1px solid var(--v-rule)}
.safv-note a{color:var(--v-ink);text-decoration:underline}

/* [safv:css] фильтры — правилами ПОСЛЕ «показать все», иначе хвост раскрывается
   при активном фильтре и число видимых строк не уменьшается */
.safv-tb--cr:checked~.safv-list>li:not([data-cr]),
.safv-tb--cd:checked~.safv-list>li:not([data-cd]),
.safv-tb--md:checked~.safv-list>li:not([data-md]),
.safv-tb--wg:checked~.safv-list>li:not([data-wg]),
.safv-tb--sp:checked~.safv-list>li:not([data-sp]),
.safv-tb--cr:checked~.safv-list>li.safv-hid,
.safv-tb--cd:checked~.safv-list>li.safv-hid,
.safv-tb--md:checked~.safv-list>li.safv-hid,
.safv-tb--wg:checked~.safv-list>li.safv-hid,
.safv-tb--sp:checked~.safv-list>li.safv-hid{display:none}
.safv-tb--cr:checked~.safv-mw,.safv-tb--cd:checked~.safv-mw,
.safv-tb--md:checked~.safv-mw,.safv-tb--wg:checked~.safv-mw,
.safv-tb--sp:checked~.safv-mw{display:none}

@media (max-width:900px){
  .safv-list>li{grid-template-columns:46px 1fr;column-gap:14px;row-gap:10px}
  .safv-rk{grid-row:auto;text-align:left}
  .safv-rk b{font-size:1.9rem}
  .safv-id{grid-column:2}
  .safv-fx,.safv-py,.safv-ac,.safv-dt{grid-column:1/-1}
  .safv-fx dd{font-size:.92rem}
  .safv-tabs label{padding:13px 14px}
  .safv-go{padding:15px 12px}
  .safv-dtw{grid-template-columns:1fr}
  .safv-h{font-size:1.32rem}
}
@media (max-width:420px){
  .safv-lg{width:66px;height:66px;padding:7px}
  .safv-fx>div{flex-wrap:wrap;row-gap:0}
  .safv-fx>div::after{min-width:8px}
}
