/* =======================================================================
   UA Casino Shortcode — Global Stylesheet
   ======================================================================= */

/* --------- Base / Reset --------- */
.uac-card{max-width:900px;margin:0 auto;font-family:'Rubik',system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif;color:#0f172a}
.uac-card *{box-sizing:border-box}

/* ===== Design Tokens ===== */
:root{
  --uac-bg:#fff;
  --uac-stroke:#e9edf6;
  --uac-muted:#64748b;
  --uac-text:#0f172a;

  --uac-brand:#ef4444;          /* primary (кнопки) */
  --uac-brand-600:#dc2626;

  --uac-accent:#2563eb;         /* синий акцент */
  --uac-surface:#f8fafc;
  --uac-chip-bg:#f8faff;
  --uac-chip-br:#e5edff;

  --uac-warm-100:#fff7d6;       /* тёплый фон бонус-плашек */
  --uac-warm-200:#ffefaf;

  --uac-shadow:0 10px 26px rgba(16,24,40,.06);
  --uac-radius:16px;

  --ok:#10b981;
  --ok2:#34d399;
  --mid:#f59e0b;
  --bad:#ef4444;
}

/* =======================================================================
   TOP BLOCK (Reference / Slotstyle)
   Markup root: .casino-block-slotstyle
   ======================================================================= */

.casino-block-slotstyle{
  max-width:1180px;
  margin:16px auto 28px;
  background:#fff;
  border:2px solid #111;               /* чёрная обводка как просили */
  border-radius:24px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.06) inset,
    0 6px 22px rgba(0,0,0,.06),
    0 2px 8px rgba(0,0,0,.04);
  overflow:hidden;
}

/* верхняя белая секция */
.casino-block-slotstyle .casino-top-white{
  padding:24px 28px 18px;
  border-bottom:1px solid #eceef2;
}

/* Header: слева рейтинг/отзывы, справа инфо (напр. KRAIL/лицензия) */
.casino-block-slotstyle .casino-header{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom:18px;
}
.casino-block-slotstyle .header-left{
  display:flex; align-items:center; gap:12px;
}
.casino-block-slotstyle .rating-number{
  font-weight:900; font-size:18px; line-height:1;
}
.casino-block-slotstyle .review-block{
  display:inline-flex; align-items:center; gap:8px;
  font-size:14px; color:#374151;
}
.casino-block-slotstyle .review-block img{
  width:18px; height:18px; object-fit:contain;
}

/* Декоративные звёзды (статично, не зависят от рейтинга) */
.casino-block-slotstyle .crc-stars{display:inline-flex; gap:6px; line-height:1}
.casino-block-slotstyle .crc-star{
  width:20px; height:20px; display:inline-block;
  background: no-repeat center/100% 100% url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
  <path d='M12 2.8l2.9 5.9 6.5.9-4.7 4.6 1.1 6.5-5.8-3.1-5.8 3.1 1.1-6.5L2.6 9.6l6.5-.9L12 2.8z' \
        fill='%23FBBF24' stroke='%231f2937' stroke-width='1.4' stroke-linejoin='round'/></svg>");
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.06));
}

/* Title + Logo */
.casino-block-slotstyle .casino-title-block{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:18px;
  align-items:center;
}
.casino-block-slotstyle .text-block h1{
  margin:0 0 6px 0;
  font-size:44px; line-height:1.15; font-weight:800; color:#0B0F1A;
}
.casino-block-slotstyle .bonus-line{
  font-weight:800; font-size:18px; color:#0B0F1A; line-height:1.25;
}

/* Бонусная мини-строка: сумма + кнопка */
.casino-block-slotstyle .bonus-row{
  margin-top:10px; display:flex; align-items:center; gap:12px; flex-wrap:wrap;
}
.casino-block-slotstyle .bonus-amount{
  display:inline-block;
  padding:8px 12px; border-radius:999px;
  background:linear-gradient(180deg,var(--uac-warm-100),var(--uac-warm-200));
  border:1px solid #fde68a;
  font-weight:900; font-size:15px; color:#111827;
}
.casino-block-slotstyle .bonus-button{
  display:inline-flex; align-items:center; justify-content:center;
  padding:8px 14px; border-radius:999px; text-decoration:none;
  font-weight:900; font-size:13px; letter-spacing:.2px; color:#fff;
  background:#1EB0FF; border:1px solid #0EA5E9;
  box-shadow:0 2px 8px rgba(14,165,233,.18), inset 0 -2px 0 rgba(0,0,0,.12);
  transition: background .18s ease, border-color .18s ease, transform .06s ease;
}
.casino-block-slotstyle .bonus-button:hover{ background:#27BAFF; border-color:#17A7EB }
.casino-block-slotstyle .bonus-button:active{ transform:translateY(1px) }

.casino-block-slotstyle .logo-block img{
  width:200px; height:auto; display:block; border-radius:12px;
  background:#fff; border:1px solid #e5e7eb; padding:8px;
}

/* РЕЙТИНГИ — 10-сегментные шкалы с частичным заполнением */
.casino-block-slotstyle .ratings{ margin-top:14px; display:grid; grid-template-columns:repeat(5,1fr); gap:18px }
@media (max-width:1080px){ .casino-block-slotstyle .ratings{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:760px){  .casino-block-slotstyle .ratings{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:520px){  .casino-block-slotstyle .ratings{ grid-template-columns:1fr } }

.casino-block-slotstyle .rating-item{ display:flex; flex-direction:column; gap:8px }
.casino-block-slotstyle .rating-item .label{
  display:flex; align-items:center; justify-content:space-between;
  font-weight:700; color:#0f172a;
}
.casino-block-slotstyle .rating-item .label span:last-child{ font-weight:900 }

/* контейнер из 10 сегментов */
.casino-block-slotstyle .segments{
  display:grid; grid-template-columns:repeat(10,1fr); gap:6px;
}

/* базовый сегмент */
.casino-block-slotstyle .segment{
  height:14px;                   /* увеличенная высота */
  border-radius:6px;
  background:#e5e7eb;
  position:relative; overflow:hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}

/* цветовая логика по «зоне»: ok/mid/bad
   (автоматически навешивается на .rating-item[data-band="…"]) */
.casino-block-slotstyle .rating-item[data-band="ok"]  .segment.full{ background: var(--ok) }
.casino-block-slotstyle .rating-item[data-band="mid"] .segment.full{ background: var(--mid) }
.casino-block-slotstyle .rating-item[data-band="bad"] .segment.full{ background: var(--bad) }

/* частичное заполнение сегмента (доля последнего) */
.casino-block-slotstyle .segment.partial > span{
  position:absolute; left:0; top:0; bottom:0; width:50%;
  background: var(--ok);
}
.casino-block-slotstyle .rating-item[data-band="mid"] .segment.partial > span{ background: var(--mid) }
.casino-block-slotstyle .rating-item[data-band="bad"] .segment.partial > span{ background: var(--bad) }

/* микро-риски по 0.1 внутри каждого сегмента
   (визуальные деления – 9 тонких полос поверх) */
.casino-block-slotstyle .segment::after{
  content:""; position:absolute; inset:0;
  background:
    repeating-linear-gradient(
      to right,
      rgba(0,0,0,.07) 0,
      rgba(0,0,0,.07) 1px,
      transparent 1px,
      transparent calc(10% - 0.6px)
    );
  opacity:.35; pointer-events:none;
}

/* Footer tabs */
.casino-block-slotstyle .casino-footer{
  background:#14161b; color:#fff;
  padding:16px 18px; display:flex; gap:12px; flex-wrap:wrap;
  border-radius:0 0 22px 22px;
}
.casino-block-slotstyle .footer-btn{
  background:#252a33; color:#fff; text-decoration:none;
  padding:10px 16px; border-radius:12px; font-weight:800;
  transition: background .18s ease, transform .06s ease;
}
.casino-block-slotstyle .footer-btn:hover{ background:#303643 }
.casino-block-slotstyle .footer-btn:active{ transform:translateY(1px) }

/* =======================================================================
   INFO GRID (Лицензии/лимиты и т.п.)
   ======================================================================= */

.uac-info-grid{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:900px;
  margin:16px auto;
}
@media (max-width: 768px){
  .uac-info-grid{ grid-template-columns:1fr; }
}

.info-item{
  display:grid;
  grid-template-columns:36px 1fr auto;
  align-items:center;
  gap:12px;
  padding:12px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  min-width:0;
}
.ufix{
  display:grid; place-items:center;
  width:36px; height:36px; border-radius:50%;
  background:#f1f5f9; border:1px solid #e2e8f0; flex:0 0 36px;
}
.info-item .k{ color:#334155; font-weight:600; line-height:1.35; min-width:0 }
.info-item .v.pill{
  justify-self:end; padding:6px 10px; border-radius:9999px;
  border:1px solid #e5e7eb; background:#f8fafc; font-weight:100; white-space:nowrap;
}

@media (max-width: 768px){
  .info-item{ grid-template-columns:36px 1fr; align-items:start; }
  .info-item .v{ grid-column:1 / -1; justify-self:stretch; margin-top:8px }
  .info-item .v.pill{ width:100%; text-align:center; white-space:normal }
}
@media (max-width: 380px){
  .info-item{ gap:10px; padding:10px }
  .ufix{ width:32px; height:32px }
  .info-item .v.pill{ padding:6px 8px }
}
/* ===========================
   Slotstyle: тонкости типографики и иконки
   =========================== */

/* 1) Больше отступов у заголовка */
.casino-block-slotstyle .text-block h1{
  margin:16px 0 16px;           /* было меньше — теперь воздуха больше */
}

/* 2) Все текстовые подписи — НЕ жирные (кроме бонуса и заголовка) */

/* мета в шапке */
.casino-block-slotstyle .meta-rating .mr-num{ font-weight:400; }
.casino-block-slotstyle .reviews-badge b{ font-weight:400; }           /* <b> → обычный */
.casino-block-slotstyle .license-pill .tx{ font-weight:400; }
.casino-block-slotstyle .safety-index-badge .tx{ font-weight:400; }
.casino-block-slotstyle .safety-index-badge .grade{ font-weight:400; }

/* подписи/значения в блоках рейтингов */
.casino-block-slotstyle .rating-item .label{ font-weight:400; }
.casino-block-slotstyle .rating-item .label span:last-child{ font-weight:400; }

/* табы в футере — обычные */
.casino-block-slotstyle .casino-footer .footer-btn{ font-weight:500; }

/* 3) Сохраняем жирность только у «бонусных» сущностей */
.casino-block-slotstyle .bonus-line .text{ font-weight:800; }
.casino-block-slotstyle .bonus-amount{ font-weight:900; }
.casino-block-slotstyle .bonus-button{ font-weight:900; }

/* 4) FIX: иконка подарка не обрезается на мобильных */
.casino-block-slotstyle .bonus-line .gift-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px; height:24px;         /* стабильная рамка */
  margin-right:8px;
  border-radius:6px;
  overflow:visible;                 /* убираем клиппинг */
  line-height:1;                    /* исключаем вертикальный срез */
  flex:0 0 24px;
}

/* если иконка рендерится как img/svg внутри .gift-ico */
.casino-block-slotstyle .bonus-line .gift-ico img,
.casino-block-slotstyle .bonus-line .gift-ico svg{
  width:20px; height:20px;
  max-width:100%; max-height:100%;
  object-fit:contain;               /* вписываем без обрезки */
  display:block;
}

/* компактнее на очень узких экранах */
@media (max-width: 480px){
  .casino-block-slotstyle .bonus-line .gift-ico{
    width:22px; height:22px;        /* немного меньше, но без клипа */
    margin-right:6px;
  }
}
/* FIX: рейтинг — убрать жирность у подписей и чисел */
.casino-block-slotstyle .ratings .rating-item .label{
  font-weight: 400 !important;
}
.casino-block-slotstyle .ratings .rating-item .label span,
.casino-block-slotstyle .ratings .rating-item .label b,
.casino-block-slotstyle .ratings .rating-item .label strong{
  font-weight: 400 !important;
}

/* на всякий случай — число справа тоже обычное */
.casino-block-slotstyle .ratings .rating-item .label span:last-child{
  font-weight: 400 !important;
}

/* =======================================================================
   PAYMENT / WITHDRAWAL METHODS
   ======================================================================= */

.uac-methods .mhead{
  font-weight:800; font-size:20px; line-height:1.2;
  padding:10px 0; margin:18px 0 12px; color:#111827;
  border-bottom:2px solid #e9edf6;
  display:flex; align-items:center; gap:8px;
}
.uac-methods .mhead::after{
  content:""; height:2px; flex:1;
  background:linear-gradient(90deg,#e9edf6,#f5f7fb); margin-left:10px;
}

.uac-methods .mgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (min-width:1024px){ .uac-methods .mgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px} }

.uac-methods .mcard{
  position:relative; border-radius:16px; background:#fff;
  padding:18px 16px 14px;
  box-shadow:0 6px 18px rgba(13,27,62,.06);
  overflow:hidden; isolation:isolate;
  border:1px solid rgba(28,37,64,.06);
  transition:transform .2s ease, box-shadow .2s ease;
}
.uac-methods .mcard:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(13,27,62,.10) }

.uac-methods .mcard::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
  background:conic-gradient(from var(--a,0deg), #6ea8ff, #9ad6ff, #b9f3ff, #9ad6ff, #6ea8ff);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:.35; animation:uac-border-spin 5s linear infinite; pointer-events:none;
}
@keyframes uac-border-spin{ to{ --a:360deg; } }

.uac-methods .mlogo{
  display:grid; place-items:center;
  height:110px; margin:0 0 10px;
  background:#f6f9ff; border:1px dashed #e5ecff; border-radius:12px;
}
.uac-methods .mlogo img{max-height:64px; max-width:80%; object-fit:contain; filter:grayscale(0.15)}

.uac-methods .mbadge{
  display:block; width:100%; background:#ecf2ff; color:#1b2a4a;
  font-weight:700; text-align:center; padding:8px 10px; border-radius:10px; margin:8px 0 10px;
}

/* Стекаем Limit/Time в два ряда на всех экранах */
.uac-methods .mmeta{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
  margin-top:6px;
}
.uac-methods .mmeta > div{
  display:flex; align-items:center; gap:8px;
  background:#f3f6ff; border:1px solid #e5ecff; border-radius:12px;
  padding:8px 10px; font-size:13px; line-height:1; color:#485777;
  min-width:0 !important; width:100%; justify-content:space-between;
}
.uac-methods .mmeta > div span{opacity:.75; margin-right:4px}
.uac-methods .mmeta > div b{
  font-weight:800; color:#0f1b3a;
  background:#fff; border-radius:10px; padding:4px 8px; line-height:1;
  box-shadow:0 1px 0 rgba(0,0,0,.04) inset;
}
@media (max-width:380px){
  .uac-methods .mmeta > div{font-size:12px; padding:6px 8px}
  .uac-methods .mbadge{padding:6px 8px}
}
@media (min-width:1440px){ .uac-methods .mgrid{ gap:24px } }

/* =======================================================================
   GAMES ROWLIST + PROVIDERS
   ======================================================================= */

.uac-rowlist .rowlist-head{display:flex;align-items:center;justify-content:space-between;margin:8px 0}
.uac-rowlist .title{font-weight:800}
.rowlist-track{display:flex;gap:8px;flex-wrap:wrap;max-height:140px;overflow:hidden}
.rowlist-track.collapsed{max-height:140px}
.uac-toggle{border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:6px 10px;font-weight:700}
.game-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid #e5e7eb;border-radius:999px;padding:6px 10px}
.game-pill.ok{background:#ecfdf5;border-color:#d1fae5}
.game-pill.off{opacity:.6}

.uac-providers .phead{font-weight:800;margin:14px 0 10px}
.uac-providers .pcarousel{position:relative}
.uac-providers .ptrack{display:flex;gap:12px;overflow:auto;padding-bottom:6px}
.uac-providers .pslide{min-width:220px; background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:10px}
.uac-providers .plogo{display:grid; place-items:center; height:120px; background:#f8fafc; border:1px dashed #e5e7eb; border-radius:10px}
.uac-providers .plogo img{max-height:72px; max-width:85%; object-fit:contain}
.uac-providers .pcaption{text-align:center; font-weight:700; margin-top:8px}
.pnav{display:none}

/* =======================================================================
   SAFETY INDEX (ref)
   ======================================================================= */

/* Band modifiers for safety content */
.uac-safety-ref.ok{
  --accent:#22c55e;
  --accent-2:#16a34a;
  --accent-txt:#065f46;
  --accent-shadow: rgba(34,197,94,.20);
}
.uac-safety-ref.mid{
  --accent:#f59e0b;
  --accent-2:#fbbf24;
  --accent-txt:#7c4a03;
  --accent-shadow: rgba(245,158,11,.20);
}
.uac-safety-ref.bad{
  --accent:#ef4444;
  --accent-2:#fb7185;
  --accent-txt:#7f1d1d;
  --accent-shadow: rgba(239,68,68,.20);
}

.uac-safety-ref{
  --card-bg: #fff;
  --stroke: #e9edf6;
  --shadow: 0 10px 30px rgba(17,24,39,.06);
  --title: #0f172a;
  --muted: #6b7280;
  --accent: #10b981;
  --accent-2:#34d399;
  --accent-txt:#065f46;
  --accent-shadow: var(--accent-shadow, rgba(16,185,129,.18));
  display:grid;
  grid-template-columns: 280px 1fr;
  gap:28px;
  align-items:stretch;
  padding:24px;
  border:1px solid var(--stroke);
  border-radius:20px;
  background:
    radial-gradient(1200px 600px at 100% -20%, rgba(16,185,129,.06), transparent),
    var(--card-bg);
  box-shadow: var(--shadow);
  max-width:900px;
  margin:22px auto;
}

.uac-safety-ref .left{
  position:relative;
  display:grid;
  place-items:center;
  padding:18px 16px;
  border-radius:16px;
  background:linear-gradient(180deg,#f8fffb, #ffffff);
  border:1px solid var(--stroke);
}
.uac-safety-ref .left .medal{
  width:68px; height:68px; border-radius:50%; display:grid; place-items:center;
  background: conic-gradient(from 180deg, var(--accent), var(--accent-2));
  box-shadow: inset 0 0 0 8px #fff, 0 8px 18px rgba(16,185,129,.25);
  color:#fff; font-size:32px; line-height:1;
}
.uac-safety-ref .left .medal > span{ transform:translateY(2px) }
.uac-safety-ref .left .cap{ margin-top:12px; letter-spacing:.02em; color:var(--muted); font-weight: 900; font-size: 18px; text-align:center }
.uac-safety-ref .left .grade{ color: var(--accent); margin-top:6px; font-size: 56px; font-weight:900; color:var(--title) }

.uac-safety-ref .right{ padding:6px 6px 6px 2px }
.uac-safety-ref .right .numlist{ list-style:none; margin:0; padding:0; counter-reset:snum; display:grid; gap:16px }
.uac-safety-ref .right .numlist li{
  position:relative; padding-left:44px; border-bottom:1px dashed var(--stroke); padding-bottom:14px;
}
.uac-safety-ref .right .numlist li:last-child{ border-bottom:0; padding-bottom:0 }
.uac-safety-ref .right .numlist li::before{
  counter-increment:snum; content: counter(snum);
  position:absolute; left:0; top:-2px;
  width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center;
  background: radial-gradient(60% 60% at 30% 30%, #fff, #f0fff8) padding-box,
              conic-gradient(from 90deg, var(--accent), var(--accent-2)) border-box;
  border: 2px solid transparent;
  color:var(--accent-txt,#065f46); font-weight:800; font-size:14px;
  box-shadow:0 4px 10px var(--accent-shadow, rgba(16,185,129,.18));
}
.uac-safety-ref .right .txt{ color:#0f172a; font-size:16px; font-weight:400 }

@media (max-width: 900px){
  .uac-safety-ref{ grid-template-columns:1fr; gap:18px; padding:18px }
  .uac-safety-ref .left .grade{ color: var(--accent); font-size:32px }
  .uac-safety-ref .right .txt{ font-size:15px }
}

/* =======================================================================
   PROS & CONS (pc2-block)
   ======================================================================= */

.pc2-block{
  --bg:#fff;
  --stroke:#e9edf6;
  --muted:#6b7280;
  --title:#0f172a;
  --ok:#10b981;
  --ok2:#34d399;
  --bad:#ef4444;
  --bad2:#fb7185;
  --shadow:0 10px 26px rgba(15, 23, 42, .06);
  --radius:18px;

  max-width:900px;
  margin:24px auto;
}
.pc2-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px }
@media (max-width:760px){ .pc2-grid{ grid-template-columns:1fr } }
.pc2-col{
  background:var(--bg);
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:18px 18px 16px;
}
.pc2-head{ display:flex; align-items:center; gap:12px; margin-bottom:12px }
.pc2-pill{
  display:grid; place-items:center;
  width:44px; height:44px; border-radius:14px;
  color:#fff; font-weight:800; font-size:18px; line-height:1;
  box-shadow:0 8px 20px rgba(0,0,0,.08), inset 0 -2px 0 rgba(255,255,255,.25);
}
.pc2-pill--pros{ background:linear-gradient(135deg, var(--ok), var(--ok2)) }
.pc2-pill--cons{ background:linear-gradient(135deg, var(--bad), var(--bad2)) }
.pc2-title{ position:relative; margin:0; padding-bottom:4px; font-weight:900; font-size:22px; color:var(--title) }
.pc2-title::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:3px; border-radius:3px;
  background:linear-gradient(90deg, rgba(0,0,0,0) 0, rgba(2,6,23,.1) 30%, rgba(2,6,23,.1) 70%, rgba(0,0,0,0) 100%);
}
.pc2-list{ list-style:none; margin:0; padding:0; display:grid; gap:12px }
.pc2-item{
  display:grid; grid-template-columns:30px 1fr; gap:12px; align-items:flex-start;
  background:linear-gradient(180deg, rgba(249,250,251,0), rgba(249,250,251,.55));
  border:1px solid #edf2f7; border-radius:14px;
  padding:12px 12px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.pc2-item:hover{ transform:translateY(-1px); box-shadow:0 12px 28px rgba(15,23,42,.06); border-color:#e6eef9 }
.pc2-text{ color:var(--title); font-size:16.5px; line-height:1.55 }
.pc2-mark{
  display:grid; place-items:center; width:28px; height:28px; border-radius:10px;
  border:1px solid var(--stroke); box-shadow:0 2px 7px rgba(0,0,0,.06); overflow:hidden;
}
.pc2-mark svg{ width:18px; height:18px; display:block }
.pc2-mark--pros{ background:linear-gradient(135deg, var(--ok), var(--ok2)) }
.pc2-mark--cons{ background:linear-gradient(135deg, var(--bad), var(--bad2)) }
.pc2-mark svg *{ stroke:#fff }
@media (max-width:560px){
  .pc2-col{ padding:16px 14px }
  .pc2-pill{ width:40px; height:40px; font-size:16px }
  .pc2-title{ font-size:20px }
  .pc2-text{ font-size:15.5px }
}

/* =======================================================================
   (Legacy-compatible) BOOKMAKER REVIEW BLOCK (чёрная обводка)
   Если где-то используется .bookmaker-review — стили ниже.
   ======================================================================= */

.bookmaker-review{
  background:#fff;
  border:2px solid #111;               /* черная обводка */
  border-radius:24px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.06) inset,
    0 6px 22px rgba(0,0,0,.06),
    0 2px 8px rgba(0,0,0,.04);
  margin:16px auto 28px;
  max-width:1180px;
}
.bookmaker-review__wrapper{padding:0}
.bookmaker-review__top{
  display:grid;
  grid-template-columns:auto 1fr auto;
  grid-template-rows:auto auto auto;
  gap:18px 24px;
  padding:24px 28px 18px;
  border-bottom:1px solid #eceef2;
  position:relative;
}
.bookmaker-review-rank{
  width:64px;height:64px;background:#FFD94A;color:#111;font-weight:800;
  border-radius:14px;font-size:28px;grid-row:1/2;grid-column:1/2;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:inset 0 0 0 3px #1111;
}

/* рейтинг (если где-то показаны звёзды этой секции) */
.bookmaker-review .bookmaker-review__rating{grid-row:1/2;grid-column:2/3;display:flex;align-items:center;gap:12px}
.bookmaker-review .bookmaker-review__rate{font-weight:800}
.bookmaker-review .bookmaker-review__reviews{color:#2b2b2b}
.bookmaker-review .bookmaker-review__license{grid-row:1/2;grid-column:3/4}
.bookmaker-review__title{grid-row:2/3;grid-column:1/4}
.bookmaker-review__title h1{margin:0;font-size:44px;line-height:1.15;font-weight:800}

/* бонус-пилюля */
.bonus-item{grid-row:3/4;grid-column:1/3;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:8px}
.bonus-item__info{display:flex;align-items:center;gap:16px}
.bookmaker-review .bonus-item{
  max-width:640px;
  padding:14px 16px;
  border-radius:9999px;
  background:linear-gradient(180deg,#FFE79A 0%, #FFEFBD 100%);
  border:2px solid #E9C26B;
  box-shadow:inset 0 0 0 1px #F7E4B2, 0 2px 0 rgba(0,0,0,.05);
}
.bookmaker-review .bonus-item__info{gap:12px}
.bookmaker-review .bonus-item-icon{
  flex:0 0 36px;width:36px;height:36px;border-radius:10px;
  background:#EAF7FF;box-shadow:inset 0 -2px 0 rgba(0,0,0,.06);
  display:inline-flex;align-items:center;justify-content:center;position:relative;
}
.bookmaker-review .bonus-item-icon::before{
  content:""; width:22px;height:22px;display:block;
  background:no-repeat center/22px 22px url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
<rect x='3' y='10' width='18' height='11' rx='3' stroke='%2318BAFF' stroke-width='2'/>\
<rect x='3' y='6' width='18' height='6' rx='3' stroke='%2318BAFF' stroke-width='2'/>\
<path d='M12 6v15' stroke='%2318BAFF' stroke-width='2'/>\
<path d='M7.5 6c0-1.7 1.6-3 3.5-3 1.5 0 2.6 1 3.1 2 .5-1 1.6-2 3.1-2 1.9 0 3.5 1.3 3.5 3' stroke='%2318BAFF' stroke-width='2' fill='none'/>\
</svg>");
}
.bookmaker-review .bonus-item-text{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.bookmaker-review .bonus-item-text p{margin:0;line-height:1.25;color:#0B0F1A}
.bookmaker-review .bonus-item-text p:first-child{font-weight:800;font-size:18px}
.bookmaker-review .bonus-item-text p + p{font-weight:700;font-size:16px}
.bookmaker-review .bonus-item-text > span{font-weight:800;font-size:18px;color:#0B0F1A}
.bookmaker-review .bonus-item__button .button{
  background:#1EB0FF;border:2px solid #0EA5E9;color:#fff;border-radius:9999px;padding:6px 14px;font-weight:800;line-height:1;white-space:nowrap;text-decoration:none;box-shadow:inset 0 -2px 0 rgba(0,0,0,.12);
}
.bookmaker-review .bonus-item__button .button:hover{background:#27BAFF;border-color:#17A7EB}
.bookmaker-review__logo{grid-row:3/4;grid-column:3/4;justify-self:end;align-self:center}
.bookmaker-review__logo img{display:block;max-width:200px;height:auto}

.bookmaker-review__center{padding:12px 28px}
.bookmaker-review__summary{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.summary__item{background:transparent}
.summary__item-title{display:flex;justify-content:space-between;font-weight:700}
.summary__item-title span{font-weight:800}
.summary__item-points{display:flex;gap:6px}
.summary__item-points span{flex:1;height:8px;border-radius:8px;background:#eaeef5;position:relative;overflow:hidden}
.summary__item-points span::after{content:"";position:absolute;inset:0;background:#0ba56d;transform:scaleX(0);transform-origin:left}
.summary__item-points[data-rating^="5"] span::after,
.summary__item-points[data-rating^="4.9"] span:nth-child(-n+5)::after,
.summary__item-points[data-rating^="4.8"] span:nth-child(-n+5)::after,
.summary__item-points[data-rating^="4.7"] span:nth-child(-n+5)::after,
.summary__item-points[data-rating^="4.6"] span:nth-child(-n+5)::after{transform:scaleX(1)}

/* ===== Bottom tabs: Обзор / Вход — orange theme (forced) ===== */
.bookmaker-review__bottom .tabs__wrapper{ display:flex; gap:12px; align-items:center }

/* базовий стан */
.bookmaker-review__bottom .tabs__item.button{
  -webkit-appearance:none; appearance:none;
  display:inline-flex; align-items:center; justify-content:center; gap:.45em;
  padding:10px 18px; border-radius:12px; text-decoration:none; font-weight:800;
  color:#111 !important;
  background:linear-gradient(180deg,#ffd24a,#ffb02e) !important;
  border:1px solid rgba(0,0,0,.06) !important;
  box-shadow:
    0 6px 16px rgba(255,176,46,.28),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease, background .12s ease;
}

/* hover */
.bookmaker-review__bottom .tabs__item.button:hover{
  background:linear-gradient(180deg,#ffcc3a,#ff9f22) !important;
  transform:translateY(-1px);
  box-shadow:
    0 10px 22px rgba(255,176,46,.32),
    inset 0 1px 0 rgba(255,255,255,.4) !important;
}

/* active + активна вкладка */
.bookmaker-review__bottom .tabs__item.button:active,
.bookmaker-review__bottom .tabs__item.button.active{
  background:linear-gradient(180deg,#ffb02e,#e18818) !important;
  color:#111 !important;
  transform:translateY(0);
  box-shadow:inset 0 2px 6px rgba(0,0,0,.12) !important;
}

/* focus-visible (клавіатура) */
.bookmaker-review__bottom .tabs__item.button:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 3px rgba(255,214,74,.5),
    0 6px 16px rgba(255,176,46,.28),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
}

/* іконки всередині */
.bookmaker-review__bottom .tabs__item.button svg{
  width:1.1em; height:1.1em; fill:currentColor; stroke:currentColor;
}

/* утилиты */
.fl-c{display:flex;align-items:center}
.fl-c-c{display:flex;align-items:center;justify-content:center}

/* адаптив для .bookmaker-review */
@media (max-width:1080px){
  .bookmaker-review__title h1{font-size:36px}
  .bookmaker-review__summary{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  .bookmaker-review__top{grid-template-columns:1fr;grid-template-rows:auto;gap:14px}
  .bookmaker-review__logo{grid-column:1/2;justify-self:start}
  .bonus-item{grid-column:1/2;flex-direction:column;align-items:flex-start}
  .bookmaker-review__summary{grid-template-columns:1fr 1fr}
}
/* ============================================================
   Mobile adaptations — Top Block (casino-block-slotstyle)
   ============================================================ */

/* ≤ 980px: компактнее отступы и заголовок */
@media (max-width: 980px){
  .casino-block-slotstyle .casino-top-white{ padding:20px 20px 16px }
  .casino-block-slotstyle .text-block h1{ font-size:36px }
  .casino-block-slotstyle .logo-block img{ width:180px }
}

/* ≤ 760px: раскладываем в колонку, logo вниз, кнопки шире */
@media (max-width: 760px){
  .casino-block-slotstyle{ border-radius:20px }
  .casino-block-slotstyle .casino-header{
    flex-wrap:wrap;
    gap:10px;
  }
  /* перенос правого блока (краил/лицензия) на вторую строку */
  .casino-block-slotstyle .header-right{
    width:100%;
    order:2;
    color:#475569;
    font-size:14px;
  }
  .casino-block-slotstyle .header-left{
    order:1;
    width:100%;
    justify-content:flex-start;
  }
  .casino-block-slotstyle .rating-number{ font-size:16px }
  .casino-block-slotstyle .review-block{ font-size:13px }

  .casino-block-slotstyle .casino-title-block{
    grid-template-columns: 1fr;
    row-gap:14px;
  }
  .casino-block-slotstyle .text-block h1{ font-size:30px }
  .casino-block-slotstyle .bonus-line{ font-size:16px }
  .casino-block-slotstyle .bonus-row{ gap:10px }
  .casino-block-slotstyle .bonus-amount{ font-size:14px; padding:7px 12px }
  .casino-block-slotstyle .bonus-button{ padding:8px 14px; font-size:13px }

  /* логотип под заголовком, поменьше */
  .casino-block-slotstyle .logo-block{ justify-self:start }
  .casino-block-slotstyle .logo-block img{ width:150px; padding:6px }

  /* сетка оценок компактнее */
  .casino-block-slotstyle .ratings{ grid-template-columns:repeat(2,1fr); gap:12px }
  .casino-block-slotstyle .rating-item .label{ font-size:14px }
  .casino-block-slotstyle .segments{ gap:5px }
  .casino-block-slotstyle .segment{ height:13px; border-radius:6px }
}

/* ≤ 560px: ещё компактнее шрифты/отступы, кнопки — на всю ширину */
@media (max-width: 560px){
  .casino-block-slotstyle .casino-top-white{ padding:16px 14px 14px }
  .casino-block-slotstyle .text-block h1{ font-size:26px }
  .casino-block-slotstyle .bonus-line{ font-size:15px }
  .casino-block-slotstyle .bonus-row{ gap:8px }
  .casino-block-slotstyle .bonus-button{ width:100%; justify-content:center }

  .casino-block-slotstyle .logo-block img{ width:130px }

  .casino-block-slotstyle .ratings{ grid-template-columns:1fr; gap:10px }
  .casino-block-slotstyle .rating-item{ gap:6px }
  .casino-block-slotstyle .segments{ gap:4px }
  .casino-block-slotstyle .segment{ height:12px }

  /* футер: кнопки стопкой и на всю ширину */
  .casino-block-slotstyle .casino-footer{
    padding:14px; gap:10px; border-radius:0 0 18px 18px;
  }
  .casino-block-slotstyle .footer-btn{
    flex:1 1 100%;
    text-align:center;
    padding:12px 14px;
  }
}

/* ≤ 400px: микро-подстройки */
@media (max-width: 400px){
  .casino-block-slotstyle .text-block h1{ font-size:24px }
  .casino-block-slotstyle .bonus-line{ font-size:14px }
  .casino-block-slotstyle .logo-block img{ width:120px }
  .casino-block-slotstyle .review-block img{ width:16px; height:16px }
  .casino-block-slotstyle .segments{ gap:3px }
  .casino-block-slotstyle .segment{ height:11px }
}
/* Отключаем старый набор звёзд внутри slotstyle-карточки */
.casino-block-slotstyle .star__wrapper,
.casino-block-slotstyle .bookmaker-review__rating .star__wrapper {
  display: none !important;
}
/* === Slotstyle: 5 метрик в ряд === */
.casino-block-slotstyle .ratings{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr)); /* было 3 — ставим 5 */
  gap:18px 28px;
  align-items:start;
}

/* на всякий случай убираем возможные стили, скрывающие элементы 4–5 */
.casino-block-slotstyle .ratings .rating-item{ display:block; }
.casino-block-slotstyle .ratings .rating-item:nth-child(n+4){
  display:block !important;
}

/* адаптив: планшет — по 3, мобила — по 2/1 */
@media (max-width: 1080px){
  .casino-block-slotstyle .ratings{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}
@media (max-width: 760px){
  .casino-block-slotstyle .ratings{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 420px){
  .casino-block-slotstyle .ratings{ grid-template-columns:1fr; }
}
.casino-block-slotstyle .ratings{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px 28px;
}
/* =========================
   TOP block: ratings (clean)
   ========================= */

/* сетка метрик: 5 → 3 → 2 → 1 */
.casino-block-slotstyle .ratings{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr));
  gap:16px 22px;
}
@media (max-width:1080px){
  .casino-block-slotstyle .ratings{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:760px){
  .casino-block-slotstyle .ratings{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .casino-block-slotstyle .ratings{ grid-template-columns:1fr; gap:14px; }
}

/* карточка метрики */
.casino-block-slotstyle .rating-item{
  --seg-h: 14px;          /* высота сегмента */
  --seg-gap: 8px;         /* отступ между сегментами */
  --seg-bg: #e9eef5;      /* фон пустых сегментов */
  --seg-br: #dde5ee;      /* тонкая обводка пустых */
  display:grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "label value"
    "bar   bar";
  row-gap:8px;
  align-items:center;
}
.casino-block-slotstyle .rating-item .label{
  grid-area:label;
  font-weight:800; color:#0b1320;
}
.casino-block-slotstyle .rating-item .label span:last-child{
  grid-area:value; font-weight:900;
}

/* цвет заполнения по диапазонам */
.casino-block-slotstyle .rating-item[data-band="ok"]  { --seg-fill:#10b981; } /* >=4 */
.casino-block-slotstyle .rating-item[data-band="mid"] { --seg-fill:#f59e0b; } /* 3–3.9 */
.casino-block-slotstyle .rating-item[data-band="bad"] { --seg-fill:#ef4444; } /* <3  */

/* контейнер из 10 секций (1.0 балл каждая) */
.casino-block-slotstyle .segments{
  grid-area:bar;
  display:grid;
  grid-template-columns:repeat(10, 1fr);
  gap:var(--seg-gap);
}

/* сегмент: «пустой» вид */
.casino-block-slotstyle .segment{
  position:relative;
  height:var(--seg-h);
  border-radius:9999px;
  background:var(--seg-bg);
  border:1px solid var(--seg-br);
  overflow:hidden;
}

/* полностью закрашенный сегмент */
.casino-block-slotstyle .segment.full::after{
  content:"";
  position:absolute; inset:-1px;        /* перекрываем тонкую обводку */
  background:var(--seg-fill);
  border-radius:inherit;
}

/* частично закрашенный (для дробной части балла) */
.casino-block-slotstyle .segment.partial > span{
  position:absolute; left:-1px; top:-1px; bottom:-1px;
  width:0;                                  /* задаётся инлайном style="width:X%" */
  background:var(--seg-fill);
  border-top-left-radius:9999px;
  border-bottom-left-radius:9999px;
}

/* немного крупнее на совсем узких экранах */
@media (max-width:560px){
  .casino-block-slotstyle .rating-item{ --seg-h: 16px; }
}
@media (max-width:380px){
  .casino-block-slotstyle .rating-item{ --seg-h: 18px; }
}
/* ============ TOP header row: rating + reviews + license ============ */
.casino-block-slotstyle .casino-header{ padding-bottom:8px; }
.casino-block-slotstyle .header-meta{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.casino-block-slotstyle .rating-number{ font-weight:900; color:#0b1320; margin-left:2px; }

/* бейдж «отзывы» */
.casino-block-slotstyle .reviews-badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:9999px;
  background:#f0f9ff; border:1px solid rgba(14,165,233,.35);
  color:#064e63; text-decoration:none; line-height:1; font-weight:800; font-size:14px;
}
.casino-block-slotstyle .reviews-badge:hover{ background:#e0f2fe; border-color:#0ea5e9; }
.casino-block-slotstyle .reviews-badge .i-chat{
  width:18px;height:18px; display:block;
  background:no-repeat center/18px 18px url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M4 5h16v10a2 2 0 0 1-2 2H9l-5 4V7a2 2 0 0 1 2-2Z' stroke='%230ea5e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/* лицензия — компактная пилюля */
.casino-block-slotstyle .license-pill{
  display:inline-flex; align-items:center; padding:6px 10px;
  border-radius:9999px; background:#f8fafc; border:1px solid #e5e7eb;
  color:#334155; font-weight:800; font-size:14px;
}

/* ===== Bonus line — с иконкой и мягкой анимацией ===== */
.casino-block-slotstyle .bonus-line.fancy{
  position:relative; display:inline-flex; align-items:center; gap:10px;
  padding:8px 12px 10px; border-radius:12px;
  background:#f0f9ff; border:1px solid #dbeafe;
  box-shadow:0 2px 12px rgba(2,132,199,.08); margin-top:6px;
}
.casino-block-slotstyle .bonus-line.fancy .text{
  font-weight:900; color:#0b1320;
  background-image: linear-gradient(120deg, rgba(59,130,246,.25), rgba(59,130,246,0));
  background-repeat:no-repeat; background-size:100% .45em; background-position:0 88%;
}
.casino-block-slotstyle .bonus-line .gift-ico{
  width:22px;height:22px; display:block;
  background:no-repeat center/22px 22px url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><rect x='3' y='9' width='18' height='12' rx='3' stroke='%230ea5e9' stroke-width='2'/><rect x='3' y='5' width='18' height='6' rx='3' stroke='%230ea5e9' stroke-width='2'/><path d='M12 5v16' stroke='%230ea5e9' stroke-width='2'/><path d='M7.5 5c0-1.6 1.6-3 3.5-3 1.4 0 2.6.9 3.1 2 .5-1.1 1.7-2 3.1-2 1.9 0 3.5 1.4 3.5 3' stroke='%230ea5e9' stroke-width='2' fill='none'/></svg>");
  animation:bonus-bounce 1.8s ease-in-out infinite; transform-origin:50% 80%;
}
@keyframes bonus-bounce{ 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-2px) scale(1.04)} }
.casino-block-slotstyle .bonus-line .bling{
  width:14px;height:14px; display:block;
  background:radial-gradient(circle at 50% 50%, rgba(59,130,246,.45), rgba(59,130,246,0) 60%);
  border-radius:50%; animation:bling 2.2s ease-in-out infinite;
}
@keyframes bling{ 0%,100%{opacity:0; transform:scale(.6)} 50%{opacity:1; transform:scale(1)} }

/* мобильные подстройки */
@media (max-width:640px){
  .casino-block-slotstyle .header-meta{ gap:10px; }
  .casino-block-slotstyle .reviews-badge,
  .casino-block-slotstyle .license-pill{ padding:6px 9px; font-size:13px; }
  .casino-block-slotstyle .bonus-line.fancy{ padding:8px 10px; }
}
/* ------- License pill + Safety Index badge ------- */
.casino-block-slotstyle .license-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:9999px;
  background:#f8fafc; border:1px solid #e5e7eb;
  color:#334155; font-weight:800; font-size:14px;
}
.casino-block-slotstyle .license-pill .i-license{
  width:18px; height:18px; display:block;
  background:no-repeat center/18px 18px url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
<path d='M6 3h12l2 4v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7l2-4Z' stroke='%23334155' stroke-width='2'/>\
<path d='M8 11h8M8 15h6' stroke='%23334155' stroke-width='2' stroke-linecap='round'/>\
</svg>");
}

/* safety badge */
.casino-block-slotstyle .safety-index-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:12px;
  border:1px solid #e5e7eb; background:#ffffff;
  font-size:14px; font-weight:800; line-height:1; color:#0b1320;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.casino-block-slotstyle .safety-index-badge .i-shield{
  width:18px;height:18px; display:block;
  background:no-repeat center/18px 18px url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
<path d='M12 3l7 3v5c0 5-3.3 8.4-7 10-3.7-1.6-7-5-7-10V6l7-3Z' stroke='%230b1320' stroke-width='2'/>\
<path d='M9.5 12l2 2 4-4' stroke='%230b1320' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
</svg>");
}
.casino-block-slotstyle .safety-index-badge .tx{ opacity:.8; }
.casino-block-slotstyle .safety-index-badge .grade{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; padding:2px 8px; margin-left:4px;
  border-radius:999px; font-weight:900; font-size:13px;
  background:#f1f5f9; color:#0b1320;
}

/* цветовые состояния по качеству */
.casino-block-slotstyle .safety-index-badge.ok  { border-color:#86efac; background:#f0fdf4; }
.casino-block-slotstyle .safety-index-badge.ok  .grade{ background:#22c55e; color:#fff; }
.casino-block-slotstyle .safety-index-badge.mid { border-color:#fed7aa; background:#fff7ed; }
.casino-block-slotstyle .safety-index-badge.mid .grade{ background:#f59e0b; color:#111; }
.casino-block-slotstyle .safety-index-badge.bad { border-color:#fecaca; background:#fff1f2; }
.casino-block-slotstyle .safety-index-badge.bad .grade{ background:#ef4444; color:#fff; }

/* небольшая плотность на мобилке */
@media (max-width:640px){
  .casino-block-slotstyle .license-pill,
  .casino-block-slotstyle .safety-index-badge{ padding:6px 9px; font-size:13px }
  .casino-block-slotstyle .safety-index-badge .grade{ min-width:28px; font-size:12px }
}
/* Ряд з рейтингом: дозволяємо перенос та керуємо порядком */
.casino-block-slotstyle .casino-header .header-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 12px;
}

/* посилання-значок відгуків */
.casino-block-slotstyle .reviews-badge{ text-decoration:none; }

/* safety badge як посилання */
.casino-block-slotstyle .safety-index-badge.is-link{ text-decoration:none; }
.casino-block-slotstyle .safety-index-badge.is-link:hover{
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}

/* ---------- Мобільний вигляд ---------- */
@media (max-width:640px){
  /* Усе (⭐, число, відгуки, ліцензія) — в один ряд ... */
  .casino-block-slotstyle .casino-header .header-meta{
    gap:10px 10px;
  }

  /* ... а індекс безпеки — другим рядком на всю ширину */
  .casino-block-slotstyle .casino-header .header-meta > .safety-index-badge{
    order:10;                 /* відправляємо в кінець ряду */
    flex:0 0 100%;            /* на всю ширину */
    justify-content:center;   /* по центру */
    margin-top:4px;
  }

  /* трішки компактніше */
  .casino-block-slotstyle .safety-index-badge{
    padding:6px 9px;
    font-size:13px;
  }
  .casino-block-slotstyle .safety-index-badge .grade{
    min-width:28px; font-size:12px;
  }
}
/* ======== One true stars: meta-rating (scoped) ======== */
.casino-block-slotstyle .header-left .crc-stars,
.casino-block-slotstyle .header-left .rating-number,
.casino-block-slotstyle .star__wrapper { display:none !important; }  /* отрубаем старые звезды/число */

/* пилюля рейтинга */
.casino-block-slotstyle .meta-rating{
  display:flex; align-items:center; gap:10px;
  padding:6px 10px; border-radius:14px;
  background:#fff; border:1.5px solid #e5e7eb;
  box-shadow:0 2px 10px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.6);
  white-space:nowrap;
}
.casino-block-slotstyle .meta-rating .mr-num{ font-weight:800; color:#0b1220; line-height:1; }
.casino-block-slotstyle .meta-rating .mr-num span{ opacity:.65; font-weight:700; margin-left:2px; font-size:.9em; }

/* 5 фигур со строгой обводкой и «заливкой по проценту» */
.casino-block-slotstyle .meta-rating .mr-stars{ display:flex; align-items:center; gap:6px; }
.casino-block-slotstyle .meta-rating .mr-stars i{
  width:20px; height:20px; position:relative; display:block; flex:0 0 20px;
  /* Обводка */
  background:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M12 2.6l2.9 5.9 6.6.9-4.8 4.4 1.2 6.6-5.9-3.1-5.9 3.1 1.2-6.6L2.5 9.4l6.6-.9L12 2.6z' fill='none' stroke='%2320273A' stroke-width='1.6' stroke-linejoin='round'/></svg>") center/100% 100% no-repeat;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.05));
}
/* Заливка — золотой клип по переменной --pct */
.casino-block-slotstyle .meta-rating .mr-stars i::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,#FFD869 0%, #FFC107 100%);
  -webkit-mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M12 2.6l2.9 5.9 6.6.9-4.8 4.4 1.2 6.6-5.9-3.1-5.9 3.1 1.2-6.6L2.5 9.4l6.6-.9L12 2.6z'/></svg>") center/100% 100% no-repeat;
          mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M12 2.6l2.9 5.9 6.6.9-4.8 4.4 1.2 6.6-5.9-3.1-5.9 3.1 1.2-6.6L2.5 9.4l6.6-.9L12 2.6z'/></svg>") center/100% 100% no-repeat;
  width:100%; transform-origin:left;
  clip-path:inset(0 calc(100% - var(--pct,0%)) 0 0);
}

/* бейдж «Отзывы» — тот, что рядом */
.casino-block-slotstyle .reviews-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:12px; background:#fff;
  border:1.5px solid #e5e7eb; color:#0b1220; text-decoration:none;
  box-shadow:0 2px 10px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.6);
}
.casino-block-slotstyle .reviews-badge b{ font-weight:800; }
.casino-block-slotstyle .i-bubble{
  width:18px; height:18px; display:inline-block; background-repeat:no-repeat; background-size:18px 18px;
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2320273A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'>\
<path d='M21 15a4 4 0 0 1-4 4H8l-5 3 1-4a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h13a4 4 0 0 1 4 4z'/></svg>");
}

/* Мобилка — чуть компактнее */
@media (max-width:640px){
  .casino-block-slotstyle .meta-rating{ padding:6px 8px }
  .casino-block-slotstyle .meta-rating .mr-stars i{ width:18px; height:18px; flex-basis:18px }
  .casino-block-slotstyle .reviews-badge{ padding:6px 8px; font-size:13px }
}
/* ======= HOTFIX: header row layout не тянется и не ломает сетку ======= */

/* сама шапка — одна строка с переносом при недостатке места */
.casino-block-slotstyle .casino-header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px 14px !important;
  flex-wrap:wrap !important;
  padding-bottom:8px;          /* оставить деликатную «линию воздуха» */
  box-sizing:border-box;
}

/* левая группа — не тянется, элементы только нужной ширины */
.casino-block-slotstyle .casino-header .header-left{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:10px 12px !important;
  flex:0 0 auto !important;
}

/* справа (КРАИЛ / лицензия) — тоже только по содержимому */
.casino-block-slotstyle .casino-header .header-right{
  flex:0 0 auto !important;
}

/* три «пилюли» всегда инлайн, а НЕ на всю ширину */
.casino-block-slotstyle .meta-rating,
.casino-block-slotstyle .reviews-badge,
.casino-block-slotstyle .license-pill,
.casino-block-slotstyle .license-badge{
  display:inline-flex !important;
  width:auto !important;
  max-width:100% !important;
  margin:0 !important;
  white-space:nowrap;
}

/* старые звезды/цифра — гарантированно прячем (чтобы не было дублей) */
.casino-block-slotstyle .header-left .crc-stars,
.casino-block-slotstyle .header-left .rating-number,
.casino-block-slotstyle .star__wrapper{
  display:none !important;
}

/* сами «звезды» в meta-rating — фиксированный размер, не прыгают */
.casino-block-slotstyle .meta-rating .mr-stars i{
  width:20px; height:20px; flex:0 0 20px;
}

/* мобильный: всё (звезды/отзывы/КРАИЛ) в один ряд; safety ниже на всю ширину */
@media (max-width:640px){
  .casino-block-slotstyle .casino-header{ justify-content:flex-start !important; }
  .casino-block-slotstyle .meta-rating{ padding:6px 8px }
  .casino-block-slotstyle .meta-rating .mr-stars i{ width:18px; height:18px; flex-basis:18px }
}

/* на некоторых темах border/outline влияют на расчёт — нормализуем */
.casino-block-slotstyle *,
.casino-block-slotstyle *::before,
.casino-block-slotstyle *::after{
  box-sizing:border-box;
}
/* ===== Meta Rating: единые звезды в top-блоке (без дублей) ===== */

/* Гарантированно убираем старые звезды/число только внутри slotstyle */
.casino-block-slotstyle .header-left .crc-stars,
.casino-block-slotstyle .header-left .rating-number,
.casino-block-slotstyle .star__wrapper { display:none !important; }

/* Пилюля рейтинга */
.casino-block-slotstyle .meta-rating{
  display:flex; align-items:center; gap:10px; white-space:nowrap;
  padding:6px 10px; border-radius:14px;
  background:#fff; border:1.5px solid #e5e7eb;
  box-shadow:0 2px 10px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.6);
}
.casino-block-slotstyle .meta-rating .mr-num{ font-weight:800; color:#0b1220; line-height:1 }
.casino-block-slotstyle .meta-rating .mr-num span{ opacity:.65; font-weight:700; margin-left:2px; font-size:.9em }

/* 5 фигур со строгой обводкой и заливкой по --pct */
.casino-block-slotstyle .meta-rating .mr-stars{ display:flex; align-items:center; gap:6px }
.casino-block-slotstyle .meta-rating .mr-stars i{
  width:20px;height:20px;flex:0 0 20px;position:relative;display:block;
  background:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M12 2.6l2.9 5.9 6.6.9-4.8 4.4 1.2 6.6-5.9-3.1-5.9 3.1 1.2-6.6L2.5 9.4l6.6-.9L12 2.6z' fill='none' stroke='%2320273A' stroke-width='1.6' stroke-linejoin='round'/></svg>") center/100% 100% no-repeat;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.05));
}
.casino-block-slotstyle .meta-rating .mr-stars i::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,#FFD869 0%, #FFC107 100%);
  -webkit-mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M12 2.6l2.9 5.9 6.6.9-4.8 4.4 1.2 6.6-5.9-3.1-5.9 3.1 1.2-6.6L2.5 9.4l6.6-.9L12 2.6z'/></svg>") center/100% 100% no-repeat;
          mask:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M12 2.6l2.9 5.9 6.6.9-4.8 4.4 1.2 6.6-5.9-3.1-5.9 3.1 1.2-6.6L2.5 9.4l6.6-.9L12 2.6z'/></svg>") center/100% 100% no-repeat;
  width:100%; transform-origin:left; clip-path:inset(0 calc(100% - var(--pct,0%)) 0 0);
}

/* Бейдж «Отзывы» (рядом с рейтингом) */
.casino-block-slotstyle .reviews-badge{
  display:inline-flex; align-items:center; gap:8px; width:auto; max-width:100%;
  padding:6px 10px; border-radius:12px; background:#fff; border:1.5px solid #e5e7eb;
  color:#0b1220; text-decoration:none; box-shadow:0 2px 10px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.6);
}
.casino-block-slotstyle .reviews-badge b{ font-weight:800 }
.casino-block-slotstyle .i-bubble{
  width:18px;height:18px;display:inline-block;background-repeat:no-repeat;background-size:18px 18px;
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2320273A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'>\
<path d='M21 15a4 4 0 0 1-4 4H8l-5 3 1-4a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h13a4 4 0 0 1 4 4z'/></svg>");
}

/* Пилюля «Лицензия» */
.casino-block-slotstyle .license-pill{
  display:inline-flex; align-items:center; gap:8px; width:auto; max-width:100%;
  padding:6px 10px; border-radius:12px; background:#fff; border:1.5px solid #e5e7eb; color:#0b1220;
  box-shadow:0 2px 10px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.6);
}
.casino-block-slotstyle .license-pill .i-license{
  width:18px;height:18px;display:block;background:no-repeat center/18px 18px url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
<path d='M6 3h12l2 4v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7l2-4Z' stroke='%23334155' stroke-width='2'/>\
<path d='M8 11h8M8 15h6' stroke='%23334155' stroke-width='2' stroke-linecap='round'/></svg>");
}

/* Мобилка — чуть компактнее */
@media (max-width:640px){
  .casino-block-slotstyle .meta-rating{ padding:6px 8px }
  .casino-block-slotstyle .meta-rating .mr-stars i{ width:18px; height:18px; flex-basis:18px }
  .casino-block-slotstyle .reviews-badge,
  .casino-block-slotstyle .license-pill{ padding:6px 9px; font-size:13px }
}
/* ====== Mobile: 3 капсули в 1 ряд (рейтинг, відгуки, ліцензія) ====== */
@media (max-width: 640px){

  /* сам контейнер верхньої мети — сітка з 3 колонок */
  .casino-block-slotstyle .casino-header .header-meta{
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    align-items: stretch;
    gap: 8px;
    width: 100%;
  }

  /* уніфікуємо капсули: однакові висота/відступи/типографіка */
  .casino-block-slotstyle .meta-rating,
  .casino-block-slotstyle .reviews-badge,
  .casino-block-slotstyle .license-pill{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 38px;
    padding: 6px 8px;
    gap: 8px;
    border-radius: 12px;
    line-height: 1;          /* щоб нічого не зрізало по вертикалі */
    white-space: nowrap;     /* короткі тексти тримаються в один ряд */
    box-sizing: border-box;
  }

  /* цифра рейтингу — трохи компактніше */
  .casino-block-slotstyle .meta-rating .mr-num{ font-size: 13px }
  .casino-block-slotstyle .meta-rating .mr-num span{ font-size: .9em }

  /* зірки: фіксовані розміри, щоб не «плавали» */
  .casino-block-slotstyle .meta-rating .mr-stars{ gap: 5px }
  .casino-block-slotstyle .meta-rating .mr-stars i{
    width: 16px; height: 16px; flex: 0 0 16px;
  }

  /* іконки всередині капсул — рівно по центру і не обрізаються */
  .casino-block-slotstyle .reviews-badge .i-bubble,
  .casino-block-slotstyle .license-pill .i-license{
    width: 16px; height: 16px; flex: 0 0 16px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;   /* явно задаємо розмір, щоб не «різало» */
  }

  /* заміна SVG для чистого рендера ліній (вписується в капсулу) */
  .casino-block-slotstyle .reviews-badge .i-bubble{
    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2320273A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15a4 4 0 0 1-4 4H8l-5 3 1-4a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h13a4 4 0 0 1 4 4z'/></svg>");
  }
  .casino-block-slotstyle .license-pill .i-license{
    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/><path d='M14 2v6h6'/></svg>");
  }

  /* індекс безпеки — повною шириною другим рядком */
  .casino-block-slotstyle .safety-index-badge{
    grid-column: 1 / -1;           /* на всю ширину */
    justify-content: center;
    width: 100%;
    min-height: 38px;
    padding: 6px 10px;
  }
  .casino-block-slotstyle .safety-index-badge .grade{
    min-width: 28px; font-size: 12px;
  }
}

/* дрібніший брейкпоінт — ще компактні зірки/іконки */
@media (max-width: 380px){
  .casino-block-slotstyle .meta-rating .mr-stars i{ width: 15px; height: 15px; flex-basis: 15px }
  .casino-block-slotstyle .reviews-badge .i-bubble,
  .casino-block-slotstyle .license-pill .i-license{ width: 15px; height: 15px; background-size: 15px 15px }
}
/* ====== базовая укладка логотип + бейдж рядом (настольные) ====== */
.casino-block-slotstyle .logo-safety{
  display:flex; align-items:center; gap:14px;
  justify-self:end;
}
.casino-block-slotstyle .logo-block img{
  display:block; max-width:200px; height:auto; border-radius:12px;
}

/* капсулы «Отзывы» / «Лицензия»: иконки строго по центру, не обрезаются */
.casino-block-slotstyle .reviews-badge .i-chat,
.casino-block-slotstyle .license-pill .i-license{
  width:20px; height:20px; flex:0 0 20px;
  background-position:center; background-size:100% 100%;
}

/* Бейдж индекса — как капсула на десктопе */
.casino-block-slotstyle .safety-index-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:12px; border:1px solid #e5e7eb; background:#fff;
  color:#0b1320; font-weight:800; line-height:1; box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.casino-block-slotstyle .safety-index-badge .i-shield{
  width:18px; height:18px; background-position:center; background-size:100% 100%;
}
.casino-block-slotstyle .safety-index-badge .grade{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; padding:2px 8px; border-radius:999px; font-weight:900; font-size:13px;
  background:#f1f5f9; color:#0b1320;
}
.casino-block-slotstyle .safety-index-badge.ok  { border-color:#86efac; background:#f0fdf4; }
.casino-block-slotstyle .safety-index-badge.ok  .grade{ background:#22c55e; color:#fff; }
.casino-block-slotstyle .safety-index-badge.mid { border-color:#fed7aa; background:#fff7ed; }
.casino-block-slotstyle .safety-index-badge.mid .grade{ background:#f59e0b; color:#111; }
.casino-block-slotstyle .safety-index-badge.bad { border-color:#fecaca; background:#fff1f2; }
.casino-block-slotstyle .safety-index-badge.bad .grade{ background:#ef4444; color:#fff; }

/* ====== Мобилка: 1-й ряд meta, 2-й ряд: слева лого, справа квадратный индекс ====== */
@media (max-width:640px){
  /* три капсулы в первой строке */
  .casino-block-slotstyle .casino-header{ margin:0; padding:0; }
  .casino-block-slotstyle .casino-header .header-meta{
    display:flex; flex-wrap:nowrap; gap:8px;
    align-items:center; justify-content:flex-start;
  }
  .casino-block-slotstyle .meta-rating{ padding:6px 8px }
  .casino-block-slotstyle .meta-rating .mr-stars i{ width:18px; height:18px; flex-basis:18px }
  .casino-block-slotstyle .reviews-badge, .casino-block-slotstyle .license-pill{
    padding:6px 8px; font-size:13px; min-height:36px;
  }

  /* ряд-2: лого + квадратная плитка индекса */
  .casino-block-slotstyle .casino-title-block{
    display:grid; grid-template-columns: 1fr auto; grid-row-gap:10px; grid-column-gap:12px;
    grid-template-areas:
      "text  text"
      "logo  safety";
  }
  .casino-block-slotstyle .casino-title-block .text-block{ grid-area:text; }
  .casino-block-slotstyle .logo-safety{ grid-area:safety; justify-self:end; }
  .casino-block-slotstyle .logo-block{ grid-area:logo; }
  .casino-block-slotstyle .logo-block img{ max-width:140px; padding:6px; }

  /* квадрат */
  .casino-block-slotstyle .safety-index-badge.safety-tile{
    width:56px; height:56px; padding:0; border-radius:12px;
    display:grid; place-items:center; position:relative;
  }
  .casino-block-slotstyle .safety-index-badge.safety-tile .tx{ display:none; }
  .casino-block-slotstyle .safety-index-badge.safety-tile .i-shield{ width:24px; height:24px; }
  .casino-block-slotstyle .safety-index-badge.safety-tile .grade{
    position:absolute; right:6px; bottom:6px; min-width:28px; height:20px; padding:0 6px;
    display:inline-flex; align-items:center; justify-content:center;
    border-radius:999px; font-size:12px; line-height:1; font-weight:900;
    background:#0b1320; color:#fff;
  }
  .casino-block-slotstyle .safety-index-badge.safety-tile.ok  .grade{ background:#22c55e; color:#fff; }
  .casino-block-slotstyle .safety-index-badge.safety-tile.mid .grade{ background:#f59e0b; color:#111; }
  .casino-block-slotstyle .safety-index-badge.safety-tile.bad .grade{ background:#ef4444; color:#fff; }
}

/* страховка: иконки в капсулах не обрезать */
.casino-block-slotstyle .reviews-badge .i-chat,
.casino-block-slotstyle .license-pill .i-license,
.casino-block-slotstyle .safety-index-badge .i-shield{
  background-repeat:no-repeat;
}
/* Цвет по диапазону (у тебя уже есть — оставляю на всякий случай) */
.casino-block-slotstyle .rating-item[data-band="ok"]  { --seg-fill:#10b981; } /* >=4 */
.casino-block-slotstyle .rating-item[data-band="mid"] { --seg-fill:#f59e0b; } /* 3–3.9 */
.casino-block-slotstyle .rating-item[data-band="bad"] { --seg-fill:#ef4444; } /* <3  */

/* =========================
   MOBILE TWEAKS (logo off, spacing up)
   ========================= */
@media (max-width:640px){

  /* 1) Прячем ЛОГО на мобильных */
  .casino-block-slotstyle .logo-block{
    display:none !important;
  }

  /* 2) Чуть больше воздуха между верхним рядом (рейтинги/бейджи)
        и текстовым блоком (заголовок/бонус) */
  .casino-block-slotstyle .casino-header{
    margin-bottom:14px; /* было 0–8 — делаем заметнее */
  }

  /* 3) Если у тебя есть квадратный бейдж индекса (safety-tile),
        добавим ему небольшой отступ сверху, чтобы не «лип» к заголовку */
  .casino-block-slotstyle .safety-index-badge.safety-tile{
    margin-top:6px;
  }

  /* 4) Когда лого скрыт, текстовый блок чуть «дышит» сильнее */
  .casino-block-slotstyle .casino-title-block{
    row-gap:18px;
  }
}

/* На всякий случай — иконки в капсулах не обрезаем и центрируем */
.casino-block-slotstyle .reviews-badge .i-bubble,
.casino-block-slotstyle .license-pill .i-license,
.casino-block-slotstyle .safety-index-badge .i-shield{
  width:20px; height:20px; flex:0 0 20px;
  background-position:center; background-repeat:no-repeat; background-size:100% 100%;
}
/* ===== Mobile layout: row1 (rating+reviews), row2 (license+safety) ===== */
@media (max-width:640px){
  .casino-block-slotstyle .casino-header .header-meta{
    display:grid !important;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "rating reviews"
      "license safety";
    gap:8px;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }

  .casino-block-slotstyle .meta-rating{ grid-area:rating; }
  .casino-block-slotstyle .reviews-badge{ grid-area:reviews; }
  .casino-block-slotstyle .license-pill{ grid-area:license; }
  .casino-block-slotstyle .safety-index-badge{
    grid-area:safety;
    display:flex !important;          /* гарантированно видим */
    justify-content:center;
    width:100%;
  }

  /* компактные размеры, чтобы всё влезло и текст не наезжал */
  .casino-block-slotstyle .meta-rating,
  .casino-block-slotstyle .reviews-badge,
  .casino-block-slotstyle .license-pill,
  .casino-block-slotstyle .safety-index-badge{
    min-width:0;                      /* разрешаем сжиматься */
    padding:6px 10px;
    border-radius:12px;
    line-height:1;
    white-space:nowrap;
    justify-content:center;
    box-sizing:border-box;
  }

  .casino-block-slotstyle .meta-rating .mr-stars{ gap:4px; }
  .casino-block-slotstyle .meta-rating .mr-stars i{ width:16px; height:16px; flex-basis:16px; }
  .casino-block-slotstyle .meta-rating .mr-num{ font-size:13px; }
  .casino-block-slotstyle .meta-rating .mr-num span{ display:none; } /* скрываем “/5” */

  .casino-block-slotstyle .reviews-badge .i-bubble,
  .casino-block-slotstyle .license-pill .i-license{
    width:16px; height:16px; flex:0 0 16px;
    background-position:center; background-size:100% 100%;
  }

  .casino-block-slotstyle .reviews-badge b,
  .casino-block-slotstyle .license-pill .tx,
  .casino-block-slotstyle .safety-index-badge .tx{
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;
  }

  /* Удаляем возможные старые правила, которые прятали бейдж */
  .casino-block-slotstyle .safety-index-badge.only-desktop,
  .casino-block-slotstyle .safety-index-badge.only-mobile{ display:flex !important; }
}
/* ====== Перекраска иконок и капсул ====== */

/* Отзывы — синий стиль */
.casino-block-slotstyle .reviews-badge{
  background:#f0f9ff;              /* светло-синий фон */
  border-color:#bae6fd;             /* сине-голубая граница */
  color:#055985;                    /* тёмно-синий текст */
}
.casino-block-slotstyle .reviews-badge:hover{
  background:#e0f2fe;
  border-color:#93c5fd;
}
.casino-block-slotstyle .reviews-badge .i-bubble{
  width:20px;height:20px;flex:0 0 20px;
  background-repeat:no-repeat;background-position:center;background-size:100% 100%;
  /* синий SVG-чат */
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
<path d='M4 5h16v10a2 2 0 0 1-2 2H9l-5 4V7a2 2 0 0 1 2-2Z' stroke='%230ea5e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
</svg>");
}

/* Лицензия — зелёный стиль */
.casino-block-slotstyle .license-pill{
  background:#f0fdf4;              /* светло-зелёный фон */
  border-color:#bbf7d0;             /* мятная граница */
  color:var(--accent-txt,#065f46);                    /* тёмно-зелёный текст */
}
.casino-block-slotstyle .license-pill:hover{
  background:#dcfce7;
  border-color:#86efac;
}
.casino-block-slotstyle .license-pill .i-license{
  width:20px;height:20px;flex:0 0 20px;
  background-repeat:no-repeat;background-position:center;background-size:100% 100%;
  /* зелёный SVG-документ */
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'>\
<path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
<path d='M14 2v6h6' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
<path d='M8 12h8M8 16h6' stroke='%2316a34a' stroke-width='2' stroke-linecap='round'/>\
</svg>");
}

/* Чёткое центрирование иконок в капсулах на всех экранах */
.casino-block-slotstyle .reviews-badge,
.casino-block-slotstyle .license-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px;border-radius:12px;line-height:1;white-space:nowrap;
}

/* На мобилке — чуть компактнее, чтобы всё влезало в ряд */
@media (max-width:640px){
  .casino-block-slotstyle .reviews-badge,
  .casino-block-slotstyle .license-pill{
    padding:6px 8px;font-size:13px;
  }
  .casino-block-slotstyle .reviews-badge .i-bubble,
  .casino-block-slotstyle .license-pill .i-license{
    width:18px;height:18px;flex-basis:18px;
  }
}
/* ===== Minimal, muted progress bars (0–5) — slotstyle ===== */

/* цветовые переменные по диапазонам (спокойные тона) */
.casino-block-slotstyle .rating-item[data-band="ok"]  { --bar-fill: #4CAF82; } /* muted green */
.casino-block-slotstyle .rating-item[data-band="mid"] { --bar-fill: #D8A657; } /* muted amber */
.casino-block-slotstyle .rating-item[data-band="bad"] { --bar-fill: #D46A6A; } /* muted red */

/* база полосы */
.casino-block-slotstyle .rating-item .uac-bar{
  grid-area: bar;
  position: relative;
  height: 12px;                      /* можно 10–14px */
  border-radius: 9999px;
  background: #F3F5F8;               /* спокойный трек */
  border: 1px solid #E6E9EE;         /* тонкая рамка трека */
  box-shadow:
    0 1px 0 rgba(0,0,0,.02) inset,
    0 -1px 0 rgba(255,255,255,.45) inset; /* лёгкая «гладкость» */
  overflow: hidden;
}

/* заливка — плоская, приглушённая */
.casino-block-slotstyle .rating-item .uac-bar__fill{
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;                          /* задаём из PHP */
  background: var(--bar-fill, #4CAF82);
  border-radius: inherit;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
  transition: width .35s ease;       /* плавное заполнение */
}

/* лёгкая анимация при включённом motion (бережно) */
@media (prefers-reduced-motion: reduce){
  .casino-block-slotstyle .rating-item .uac-bar__fill{ transition: none; }
}

/* размеры на узких экранах */
@media (max-width:560px){
  .casino-block-slotstyle .rating-item .uac-bar{ height: 13px; }
}
@media (max-width:380px){
  .casino-block-slotstyle .rating-item .uac-bar{ height: 14px; }
}

/* на всякий случай выключаем старую «капсульную» разметку локально */
.casino-block-slotstyle .segments,
.casino-block-slotstyle .segment{ display:none !important; }

/* ===== Minimal modern bar (0–5) ===== */
.casino-block-slotstyle .rating-item .uac-bar--modern{
  grid-area: bar;
  position: relative;
  height: 10px;                 /* можно 12–14px, если нужно плотнее */
  border-radius: 9999px;
  background: #eef2f7;          /* нейтральный трек */
  outline: 1px solid #e5e7eb;   /* тонкий кант */
  overflow: hidden;
}

/* заполнение (мягкий градиент, неяркий) */
.casino-block-slotstyle .rating-item .uac-bar__fill{
  position: absolute; inset: 0 auto 0 0;
  width: 0;                      /* задаём inline из PHP */
  background: linear-gradient(90deg,
              color-mix(in oklab, var(--bar-color, #94a3b8) 88%, white 12%),
              color-mix(in oklab, var(--bar-color, #94a3b8) 72%, black 28%));
}

/* круглая метка со значением */
.casino-block-slotstyle .rating-item .uac-bar__dot{
  position: absolute; top: 50%;
  transform: translate(-50%, -50%);
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--bar-color, #94a3b8);
  box-shadow: 0 2px 10px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.4);
  display: grid; place-items: center;
}
.casino-block-slotstyle .rating-item .uac-bar__dot b{
  font: 800 12px/1 "Rubik", system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  color:#fff;
}

/* Цвета по диапазонам (берём из data-band на .rating-item) */
.casino-block-slotstyle .rating-item[data-band="ok"]  { --bar-color:#22c55e; } /* >=4 */
.casino-block-slotstyle .rating-item[data-band="mid"] { --bar-color:#f59e0b; } /* 3–3.9 */
.casino-block-slotstyle .rating-item[data-band="bad"] { --bar-color:#ef4444; } /* <3  */

/* адаптив: чуть компактнее на мобилках */
@media (max-width:560px){
  .casino-block-slotstyle .rating-item .uac-bar--modern{ height: 12px; }
  .casino-block-slotstyle .rating-item .uac-bar__dot{ width: 24px; height: 24px; }
  .casino-block-slotstyle .rating-item .uac-bar__dot b{ font-size: 11px; }
}
@media (max-width:380px){
  .casino-block-slotstyle .rating-item .uac-bar--modern{ height: 12px; }
  .casino-block-slotstyle .rating-item .uac-bar__dot{ width: 22px; height: 22px; }
  .casino-block-slotstyle .rating-item .uac-bar__dot b{ font-size: 10px; }
}

/* на всякий случай выключаем старые капсулы, если где-то остались */
.casino-block-slotstyle .rating-item .segments,
.casino-block-slotstyle .rating-item .segment{ display:none !important; }

/* ===== Providers (900px / 4.5 десктоп, 1.5 мобайл, скрол снизу) ===== */
.uac-providers{ max-width:900px; margin:0 auto; }

/* Заголовок — как в Game Types */
.uac-providers .uac-section-head{
  font-weight:800; font-size:20px; line-height:1.2;
  padding:10px 0; margin:18px 0 12px; color:#111827;
  border-bottom:2px solid #e9edf6;
  display:flex; align-items:center; gap:8px;
}
.uac-providers .uac-section-head::after{
  content:""; height:2px; flex:1;
  background:linear-gradient(90deg,#e9edf6,#f5f7fb); margin-left:10px;
}
/* если где-то остался старый .phead — прячем */
.uac-providers .phead{ display:none !important; }

/* Карусель */
.uac-providers .pcarousel{
  --gap:18px;                     /* расстояние между карточками */
  --visible:4.5;                  /* сколько карточек видно на десктопе */
  position:relative;
  padding:0;                      /* ⬅ первый слайд стартует от левого края */
  overflow:visible;               /* стрелки могут “вылетать” наружу */
}
@media (max-width:640px){
  .uac-providers .pcarousel{ --visible:1.5; }
}

/* Вьюпорт + аккуратный нижний скроллбар */
.uac-providers .pviewport{
  overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;                     /* Firefox */
  scrollbar-color:#cfd7e3 transparent;
  padding-bottom:8px;                       /* чтобы скролл не лип к карточкам */
  scroll-padding-left:12px;                 /* комфортное прилипание у краёв */
  scroll-padding-right:12px;
}
.uac-providers .pviewport::-webkit-scrollbar{ height:8px }
.uac-providers .pviewport::-webkit-scrollbar-track{ background:transparent }
.uac-providers .pviewport::-webkit-scrollbar-thumb{
  background:#cfd7e3; border-radius:999px;
}
.uac-providers .pviewport::-webkit-scrollbar-thumb:hover{ background:#bcc6d6 }

/* Трек + “половинка” в конце, чтобы последняя карточка не обрезалась */
.uac-providers .ptrack{
  display:flex; gap:var(--gap);
  scroll-snap-type:x mandatory;
}
.uac-providers .ptrack::after{
  content:"";
  flex:0 0 calc((100% - (var(--gap) * (var(--visible) - 1))) / var(--visible) * .5);
}

/* Слайды фиксированной ширины из формулы выше */
.uac-providers .pslide{
  flex:0 0 calc((100% - (var(--gap) * (var(--visible) - 1))) / var(--visible));
  scroll-snap-align:start;
}

/* Карточка провайдера */
.uac-providers .plogo{
  border-radius:18px; background:#f7fafd; border:1px solid #e6edf4;
  display:grid; place-items:center; height:160px;
  margin:10px 10px 6px; overflow:hidden;
  box-shadow:0 6px 18px rgba(17,24,39,.06);
}
.uac-providers .plogo img{ max-width:70%; max-height:60%; height:auto; display:block; }
.uac-providers .pcaption{
  text-align:center; font-weight:800; color:#0b1320; margin:6px 0 14px;
}

/* Стрелки — “висят” за краем контейнера и не смещают контент */
.uac-providers .pnav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:34px; height:34px; border-radius:50%;
  border:1px solid #e5e7eb; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.06);
  display:grid; place-items:center; cursor:pointer; user-select:none; z-index:2;
}
.uac-providers .pnav.prev{ left:-12px }      /* ⬅ вынесли за левый край */
.uac-providers .pnav.next{ right:-12px }     /* ⮕ вынесли за правый край */
.uac-providers .pnav:disabled{ opacity:.4; pointer-events:none }
.uac-providers .pnav::after{ content:""; position:absolute; inset:-6px; border-radius:50%; } /* ↑ увеличиваем область клика */

/* Если карточек мало — стрелки/скролл не показываем */
.uac-providers .pcarousel.no-scroll .pnav{ display:none }
.uac-providers .pcarousel.no-scroll .pviewport{ overflow-x:clip; padding-bottom:0 }

.uac-games .gslide.ok .gcard:hover{
  transform:translateY(-2px);
  background: linear-gradient(180deg, var(--uac-red-strong) 0%, #b92828 100%);
  box-shadow:0 14px 28px rgba(201, 47, 47, .28);
}
.uac-games .gslide.off .gcard{
  background:#3b3f45; color:#e5e7eb;
  box-shadow:0 6px 16px rgba(0,0,0,.12);
}

/* ===== Game Types (clean minimal) ===== */
:root{
  --uac-border:#e5e7eb;
  --uac-ring:#c7d2fe;
  --uac-card-shadow: 0 6px 18px rgba(17,24,39,.06);
  --uac-card-shadow-hover: 0 12px 26px rgba(17,24,39,.10);
  --uac-subtle: #f7f8fb;           /* легкий фон усередині картки */
  --uac-outline: #dfe5f2;          /* м’яка обводка */
  --uac-accent1: #e9edf6;          /* градієнтні акценти для бордера */
  --uac-accent2: #f5f7fb;
}

/* header (залишаємо як було) + центруємо секцію на 900px */
.uac-games{ max-width:900px; margin:0 auto; }
.uac-games .uac-section-head{
  font-weight:800; font-size:20px; line-height:1.2;
  padding:10px 0; margin:18px 0 12px; color:#111827;
  border-bottom:2px solid #e9edf6;
  display:flex; align-items:center; gap:8px;
}
.uac-games .uac-section-head::after{
  content:""; height:2px; flex:1;
  background:linear-gradient(90deg,var(--uac-accent1),var(--uac-accent2)); margin-left:10px;
}

/* carousel */
.uac-games .gcarousel{ position:relative }
.uac-games .gviewport{ overflow:auto; padding:0 44px 10px; scroll-snap-type:x mandatory }
.uac-games .gtrack{ display:flex; gap:20px }
.uac-games .gslide{ scroll-snap-align:start; flex:0 0 auto }

/* навігація */
.uac-games .gnav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:34px; height:34px; border-radius:50%;
  border:1px solid #e5e7eb; background:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.06);
  display:grid; place-items:center; cursor:pointer; z-index:2;
}
.uac-games .gnav.prev{ left:6px } .uac-games .gnav.next{ right:6px }
.uac-games .gnav:disabled{ opacity:.4; pointer-events:none }

/* card (без color: — SVG/PNG лишають свої кольори) */
.uac-games .gcard{
  position:relative;
  width:210px; height:132px; border-radius:16px;
  background:#fff; border:1px solid var(--uac-border);
  box-shadow:var(--uac-card-shadow);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  isolation:isolate;
}
/* тонкий “градієнтний” контур зверху картки */
.uac-games .gcard::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, var(--uac-accent2), var(--uac-accent1));
  mix-blend-mode:normal; opacity:.65;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  padding:1px; background-clip:content-box, border-box;
}
.uac-games .gslide.ok .gcard:hover{
  transform: translateY(-2px);
  background: linear-gradient(0deg, #fafafa 0%, #ffffff 100%);
  box-shadow:var(--uac-card-shadow-hover);
}
.uac-games .gcard:focus,
.uac-games .gcard:focus-within{
  outline:none;
  box-shadow:0 0 0 4px var(--uac-ring), var(--uac-card-shadow-hover);
}
.uac-games .gslide.off .gcard{ opacity:.55 }

/* icon area — м’яка “плашка” під піктограмою, без зміни її кольору */
.uac-games .gicon{
  width:72px; height:72px; border-radius:14px;
  display:grid; place-items:center;
  background: radial-gradient(120% 120% at 50% 0%, #ffffff 0%, var(--uac-subtle) 100%);
  border:1px solid var(--uac-outline);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
/* SVG/IMG— тільки розмір, без фільтрів/заливок */
.uac-games .svgwrap svg{ width:40px; height:40px }
.uac-games .gicon img{ width:40px; height:40px; object-fit:contain; filter:none }

/* title */
.uac-games .gtitle{
  font-size:13px; font-weight:800; letter-spacing:.35px;
  text-transform:uppercase; color:#0f172a; text-align:center;
  padding:2px 8px; border-radius:8px;
  background:linear-gradient(180deg,#fff, #f8f9fc);
  border:1px solid var(--uac-outline);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
/* carousel */
.uac-games .gcarousel{ position:relative }
.uac-games .gviewport{
  overflow-x:auto; overflow-y:hidden;        /* <- явний горизонтальний скрол */
  padding:0 44px 10px; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling: touch;
}
.uac-games .gtrack{ display:flex; gap:20px }
.uac-games .gslide{ scroll-snap-align:start; flex:0 0 auto }

/* коли скролу нема — ховаємо стрілки і прибираємо бокові паддінги */
.uac-games .gcarousel.no-scroll .gnav{ display:none }
.uac-games .gcarousel.no-scroll .gviewport{ padding:0 0 10px }
.uac-section-head{
  font-weight:800; font-size:20px; line-height:1.2;
  padding:10px 0; margin:18px 0 12px; color:#111827;
  border-bottom:2px solid #e9edf6;
  display:flex; align-items:center; gap:8px;
}
.uac-section-head::after{
  content:""; height:2px; flex:1;
  background:linear-gradient(90deg,#e9edf6,#f5f7fb); margin-left:10px;
}

/* ===== Screens block — layout (900px wide, 2-in-row) ===== */
.uac-screens{max-width:900px;width:100%;margin:16px auto 28px;padding:0 8px}
.uac-screens__inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:24px;
}
.uac-screens__col{display:flex;align-items:center;justify-content:center}

/* stack on narrow screens */
@media (max-width: 740px){
  .uac-screens__inner{grid-template-columns:1fr}
  .uac-phone{margin-top:12px}
}

/* ===== Make screenshots fill frames ===== */
.uac-laptop__bezel,
.uac-phone__bezel{position:relative; overflow:hidden}

/* choose aspect ratios that match your screenshots */
.uac-laptop__bezel{aspect-ratio:16/9}
.uac-phone__bezel{aspect-ratio:9/19.5}  /* iPhone portrait */

.uac-laptop__bezel img,
.uac-phone__bezel img{
  width:100%; height:100%;
  object-fit:cover;         /* fill without white bars */
  object-position:center;   /* tweak if needed: center top / bottom */
  display:block;
}

/* =========================
   Stable iPhone carousel (3-up desktop / 2-up tablet / 1-up mobile)
   ========================= */

/* Контейнер секції — фіксована ширина 900px + захист від «стрибань» */
.uac-mobiles{
  max-width:900px; width:100%;
  margin:16px auto 28px; padding:0 8px;
  box-sizing:border-box;
  contain:layout inline-size style;
}
.uac-mobiles__inner{
  display:flex; justify-content:center; align-items:stretch;
}

/* Карусель */
.mcarousel{ position:relative; width:100%; }
.mviewport{ overflow:hidden; width:100%; }

/* Трек: флекси з gap — це основа стабільності сітки */
.mtrack{
  display:flex;
  gap:16px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:4px 12px;     /* буфер, щоб стрілки не перекривали крайні слайди */
  box-sizing:border-box;
}
.mtrack::-webkit-scrollbar{ display:none; }

/* Слайд — базово 1 на екрані */
.mslide{
  flex:0 0 100%;
  min-width:0;                 /* запобігає «роздуванню» */
  scroll-snap-align:start;
  display:flex; justify-content:center; align-items:center;
}

/* Рамка телефону всередині кожного слайда */
.uac-phone{
  width:100%;
  max-width:320px;             /* дефолт для дрібних екранів */
  position:relative;
  padding:14px;
  background:#0b0f19;
  border-radius:28px;
  box-shadow:0 8px 20px rgba(2,6,23,.25);
  box-sizing:border-box;
}
.uac-phone__notch{
  position:absolute; top:8px; left:50%; transform:translateX(-50%);
  width:44%; height:16px; background:#0b0f19;
  border-bottom-left-radius:10px; border-bottom-right-radius:10px;
}
.uac-phone__bezel{
  border-radius:22px; background:#000; overflow:hidden;
  aspect-ratio:9/19.5;         /* керує «висотою екрану» (портрет) */
}
.uac-phone__bezel img{
  width:100%; height:100%; object-fit:cover; object-position:center; display:block;
}

/* Стрілки — помітні, але не заважають клікам по контенту */
.mnav{
  position:absolute; top:50%; transform:translateY(-50%);
  border:0; background:rgba(15,23,42,.9);
  width:44px; height:48px; line-height:48px;
  color:#fff; font-weight:800; font-size:26px;
  border-radius:12px; cursor:pointer; z-index:3;
  box-shadow:0 6px 16px rgba(2,6,23,.35);
  backdrop-filter:saturate(1.2) blur(2px);
  user-select:none;
}
.mnav.prev{ left:0; }
.mnav.next{ right:0; }
.mnav:disabled{ opacity:.4; cursor:default; }
.mnav:hover:not(:disabled){ transform:translateY(-50%) scale(1.04); }
.mnav:active:not(:disabled){ transform:translateY(-50%) scale(.98); }
.mnav:focus-visible{ outline:2px solid #93c5fd; outline-offset:2px; }

/* Точки */
.mdots{ display:flex; gap:8px; justify-content:center; margin:10px 0 0; }
.mdot{
  width:8px; height:8px; border-radius:999px; background:#94a3b8; opacity:.5;
}
.mdot.is-active{ opacity:1; background:#e2e8f0; }

/* ====== Респонсивні правила ====== */

/* Десктоп ≥ 1024px: 3 видимих слайди + компактніша висота телефону */
@media (min-width:1024px){
  .mslide{ flex-basis:calc((100% - 32px)/3); } /* 3 колонки, 2 проміжки по 16px */
  .uac-phone{ max-width:260px; padding:12px; border-radius:24px; }
  .uac-phone__bezel{ border-radius:20px; aspect-ratio:9/19; } /* трішки нижче */
}

/* Планшет 641–1023px: 2 видимі */
@media (min-width:641px) and (max-width:1023px){
  .mslide{ flex-basis:calc((100% - 16px)/2); }
  .uac-phone{ max-width:280px; padding:12px; border-radius:24px; }
  .uac-phone__bezel{ border-radius:20px; aspect-ratio:9/19; }
}

/* Мобільні ≤ 640px: 1 видимий, зменшена висота/рамка */
@media (max-width:640px){
  .uac-mobiles{ margin:8px auto 16px; padding:0 6px; }
  .uac-phone{
    max-width:240px;
    padding:10px;
    border-radius:20px;
  }
  .uac-phone__notch{ top:6px; height:12px; }
  .uac-phone__bezel{ border-radius:16px; aspect-ratio:9/18; } /* нижче, ніж на десктопі */
  .mnav{ width:38px; height:42px; line-height:42px; font-size:22px; border-radius:10px; }
}

/* Зменшення анімації для користувачів, що не люблять рух */
@media (prefers-reduced-motion:reduce){
  .mtrack{ scroll-behavior:auto; }
}

/* Accent-driven visuals for banded safety block */
.uac-safety-ref.ok{
  --tint: rgba(34,197,94,.08);
  --stroke: rgba(34,197,94,.25);
}
.uac-safety-ref.mid{
  --tint: rgba(245,158,11,.10);
  --stroke: rgba(245,158,11,.28);
}
.uac-safety-ref.bad{
  --tint: rgba(239,68,68,.10);
  --stroke: rgba(239,68,68,.28);
}
/* use the tint for card bg/border */
.uac-safety-ref{
  background:
    radial-gradient(120% 120% at -10% -10%, var(--tint, rgba(16,185,129,.08)) 0%, transparent 60%),
    linear-gradient(180deg,#fff, #fff);
  border-color: var(--stroke, #e9edf6);
}
/* Responsive sizing for big grade */
@media (max-width: 760px){
  .uac-safety-ref .left .grade{ font-size: 44px; }
  .uac-safety-ref .left .cap{ font-size: 16px; }
}
@media (max-width: 480px){
  .uac-safety-ref{ grid-template-columns:1fr; }
  .uac-safety-ref .left{ align-items:center; text-align:center }
  .uac-safety-ref .left .grade{ font-size: 36px; }
}

/* Fresh icons for badges */
.casino-block-slotstyle .reviews-badge .i-bubble{
  width:20px;height:20px;display:inline-block;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%232563eb' d='M4 4h16a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-8l-4 3v-3H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/></svg>") center/100% 100% no-repeat;
}
.casino-block-slotstyle .license-pill .i-license{
  width:20px;height:20px;display:inline-block;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%2310b981' d='M12 2l7 3v6c0 6-4.5 10.5-7 12C9.5 21.5 5 17 5 11V5l7-3z'/><path stroke='%23fff' stroke-width='2' d='M8 12l3 3 5-5'/></svg>") center/100% 100% no-repeat;
}
.casino-block-slotstyle .safety-index-badge .i-shield{
  width:18px;height:18px;display:inline-block;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23059' d='M12 2l7 3v6c0 6-4.5 10.5-7 12C9.5 21.5 5 17 5 11V5l7-3z'/><path stroke='%23fff' stroke-width='2' d='M8 12l3 3 5-5'/></svg>") center/100% 100% no-repeat;
}

/* Two-tone stars */
.casino-block-slotstyle .meta-rating .mr-stars i::after{
  background:linear-gradient(180deg,#ffe08a 0%, #ffb300 100%);
}

/* Ensure legacy carousel nav buttons are hidden */
.uac-card .mnav{display:none !important}

/* Force-hide legacy carousel controls */
.mnav,.mdots{display:none!important}


/* Inherit theme font everywhere inside plugin widgets */
[class^="uac-"], [class*=" uac-"] { font-family: inherit !important; }

/* Minimal icon style */
.uac-ico { width: 18px; height: 18px; display:inline-block; vertical-align: -2px; margin-right: 6px; fill: currentColor; stroke: none; }
.uac-iconwrap { display:inline-flex; align-items:center; margin-right: 6px; }
.uac-safety-ref .medal .uac-ico { width:20px; height:20px; margin-right:8px; }


/* Bigger, readable title in card */
.uac-card-title{ font: inherit; font-weight: 700; font-size: 1.6rem; line-height: 1.25; margin: 6px 0 12px; }

/* Make pills inherit font explicitly */
.pill, .pill * { font-family: inherit !important; }


/* Safety label kicker inherits theme font and is readable */
.uac-s2-kicker{ font: inherit; font-weight: 600; font-size: 0.95rem; margin: 0 0 6px; }


/* Readable icon sizes (images or inline SVG) */
.uac-ico{width:20px;height:20px;display:inline-block;vertical-align:-3px;object-fit:contain;fill:currentColor;stroke:none}
.pill .uac-ico{width:18px;height:18px;margin-right:6px;vertical-align:-2px}
.uac-safety-ref .medal .uac-ico,
.uac-s2-hero .uac-s2-icon .uac-ico{width:22px;height:22px;margin-right:8px}

/* Consistent icon sizes */
.bonus-thumb img{width:140px;height:140px;object-fit:contain;display:block}
.pill .uac-ico{width:18px;height:18px;margin-right:6px;vertical-align:-2px;object-fit:contain}
.uac-s2-hero .uac-s2-icon img.uac-ico{width:22px;height:22px;object-fit:contain}

/* Guard against subpixel artifact on empty stars */
.casino-block-slotstyle .meta-rating .mr-stars i[style*="--pct:0%"]::after{ display:none !important; }

.casino-block-slotstyle .header-meta .i-ico img.uac-ico{ width:18px; height:18px; object-fit:contain; display:block }


/* Safety icon container & image (uploaded icon support) */
.uac-s2-icon{
  position: relative;
  width: 56px; height: 56px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 9999px;
}
.uac-s2-icon img.uac-ico{ width:24px; height:24px; display:block; object-fit:contain }

.uac-s2-icon .i-ico{display:inline-block;width:24px;height:24px}
/* Убираем глобальные отступы у иконки в круглой кнопке */
.uac-s2-icon .uac-ico { margin:0 !important; }

/* Прячем пустые/битые картинки внутри .uac-s2-icon */
.uac-s2-icon img:not([src]),
.uac-s2-icon img[src=""],
.uac-s2-icon img[src^="data:"][src="data:"] { display:none !important; }

/* Если есть нормальная картинка — скрываем fallback-спан */
.uac-s2-icon img[src]:not([src=""]) ~ .i-ico { display:none !important; }

.uac-ico-1 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px; /* Размер круга */
  height: 40px; /* Размер круга */
  border-radius: 50%; /* Округление для круга */
  background-color: #00c851; /* Цвет фона круга (можно менять) */
  font-size: 22px; /* Размер эмодзи */
  color: white; /* Цвет эмодзи */
  line-height: 1; /* Для точного выравнивания */
  text-align: center; /* Горизонтальное выравнивание */
  padding: 5px; /* Отступ внутри круга */
}

.medal {
  display: inline-block;
  text-align: center; /* Выравнивание содержимого по центру */
}