/**
 * ═══════════════════════════════════════════════════════════════════════
 *  SlotVerdict · Hero V5 · CSS · Binance Dark
 * ═══════════════════════════════════════════════════════════════════════
 *  Strictly follows project rules:
 *    - Only 18 approved palette tokens
 *    - Unbounded (display) + Onest (body) + JetBrains Mono (mono)
 *    - No unicode symbols (icons via SVG)
 *    - No CSS minification
 *    - No gradients on block backgrounds
 * ═══════════════════════════════════════════════════════════════════════
 */

/* ═══ DESIGN TOKENS (18 approved palette values) ════════════════════ */
.sv5-wrap {
  --sv5-bg-0: #0B0E11;
  --sv5-bg-1: #181A20;
  --sv5-bg-2: #1E2329;
  --sv5-bg-3: #2B2F36;
  --sv5-bg-4: #474D57;

  --sv5-yellow: #FCD535;
  --sv5-amber: #F0B90B;
  --sv5-amber-bg: rgba(240, 185, 11, 0.1);
  --sv5-amber-soft: rgba(240, 185, 11, 0.25);

  --sv5-t1: #EAECEF;
  --sv5-t2: #B7BDC6;
  --sv5-t3: #848E9C;
  --sv5-t4: #5E6673;

  --sv5-green: #0ECB81;
  --sv5-green-bg: rgba(14, 203, 129, 0.12);
  --sv5-green-soft: rgba(14, 203, 129, 0.25);

  --sv5-red: #F6465D;
  --sv5-red-bg: rgba(246, 70, 93, 0.12);
  --sv5-red-soft: rgba(246, 70, 93, 0.25);

  --sv5-purple: #6C5CE7;
  --sv5-blue: #3861FB;
  --sv5-pink: #EC4899;

  --sv5-line: rgba(255, 255, 255, 0.06);
  --sv5-line-2: rgba(255, 255, 255, 0.1);

  --sv5-r: 8px;
  --sv5-rm: 12px;
  --sv5-rl: 16px;

  /* Typography */
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.5;
  color: var(--sv5-t1);
}

/* ═══ 1. TOP BAR ════════════════════════════════════════════════════ */
.sv5-tp {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  font-size: 12px;
  padding: 0 4px;
  flex-wrap: wrap;
  gap: 8px;
}
.sv5-cr {
  color: var(--sv5-t3);
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-cr a {
  color: var(--sv5-t3);
  text-decoration: none;
  padding: 3px 6px;
  border-radius: 4px;
  transition: all 0.15s;
}
.sv5-cr a:hover {
  color: var(--sv5-t1);
  background: var(--sv5-bg-3);
}
.sv5-cr .sv5-s {
  color: var(--sv5-t4);
}
.sv5-cr .sv5-cur {
  color: var(--sv5-t1);
  font-weight: 500;
  padding: 3px 6px;
}
.sv5-up {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--sv5-t2);
  font-size: 12px;
  padding: 5px 10px;
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-r);
}
.sv5-dot {
  width: 6px;
  height: 6px;
  background: var(--sv5-green);
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}
.sv5-dot::after {
  content: '';
  position: absolute;
  inset: -3px;
  border: 2px solid var(--sv5-green);
  border-radius: 50%;
  opacity: 0.3;
  animation: sv5-pulse 2s infinite;
}
@keyframes sv5-pulse {
  0%, 100% { transform: scale(1);   opacity: 0.4; }
  50%      { transform: scale(1.3); opacity: 0; }
}

/* ═══ MAIN CARD ═════════════════════════════════════════════════════ */
.sv5-card {
  background: var(--sv5-bg-1);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rl);
  padding: 24px 28px;
}

/* ═══ 2. HEADER + LOGO ═════════════════════════════════════════════ */
.sv5-hd {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.sv5-lg {
  width: 124px;
  height: 72px;
  flex-shrink: 0;
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line-2);
  border-radius: 14px;
  padding: 6px;
  position: relative;
}
.sv5-lg-inner {
  width: 100%;
  height: 100%;
  border-radius: 9px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sv5-bg-3);
}
.sv5-lg-inner .sv-logo,
.sv5-lg-inner .sv-logo-xl {
  width: 100%;
  height: 100%;
  background: transparent;
  border-radius: 0;
}
.sv5-lg-inner img,
.sv5-lg-inner svg {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
  padding: 4px;
  box-sizing: border-box;
}
.sv5-lg-v {
  position: absolute;
  bottom: -5px;
  right: -5px;
  width: 22px;
  height: 22px;
  background: var(--sv5-green);
  color: var(--sv5-bg-1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid var(--sv5-bg-1);
  z-index: 2;
}
.sv5-lg-v svg {
  width: 12px;
  height: 12px;
  color: var(--sv5-bg-1);
}
.sv5-hi {
  flex: 1;
  min-width: 0;
}
.sv5-nr {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
  flex-wrap: wrap;
}
.sv5-nt {
  font-size: 24px;
  font-weight: 800;
  margin: 0;
  color: var(--sv5-t1);
  letter-spacing: -0.025em;
  line-height: 1.2;
}
.sv5-tk {
  font-family: var(--font);
  font-size: 11px;
  padding: 3px 8px;
  background: var(--sv5-bg-3);
  color: var(--sv5-t2);
  border: 1px solid var(--sv5-line);
  border-radius: 5px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.sv5-rk {
  font-size: 11px;
  padding: 3px 8px;
  background: var(--sv5-amber-bg);
  color: var(--sv5-amber);
  border: 1px solid var(--sv5-amber-soft);
  border-radius: 5px;
  font-weight: 500;
}
.sv5-rk b {
  font-weight: 700;
}
.sv5-vr {
  font-size: 11px;
  padding: 3px 8px;
  background: var(--sv5-green-bg);
  color: var(--sv5-green);
  border: 1px solid var(--sv5-green-soft);
  border-radius: 5px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.sv5-vr svg {
  width: 12px;
  height: 12px;
  color: var(--sv5-green);
}
.sv5-al {
  font-size: 13px;
  color: var(--sv5-t2);
}
.sv5-al b {
  color: var(--sv5-t1);
  font-weight: 500;
}
.sv5-al .sv5-d {
  color: var(--sv5-t4);
  margin: 0 6px;
}

/* Action buttons */
.sv5-ac {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.sv5-ab {
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line-2);
  padding: 7px 12px;
  border-radius: var(--sv5-r);
  color: var(--sv5-t2);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.15s;
  font-family: var(--font);
  line-height: 1;
}
.sv5-ab:hover {
  background: var(--sv5-bg-3);
  color: var(--sv5-t1);
  border-color: var(--sv5-bg-4);
}
.sv5-ab svg {
  width: 14px;
  height: 14px;
  color: var(--sv5-t3);
}
.sv5-ab:hover svg {
  color: var(--sv5-t1);
}
.sv5-bs-active {
  background: var(--sv5-amber-bg) !important;
  color: var(--sv5-amber) !important;
  border-color: var(--sv5-amber-soft) !important;
}

/* ═══ 3. AWARDS STRIP ═══════════════════════════════════════════════ */
.sv5-aw {
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  padding: 10px 14px;
  margin-bottom: 20px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.sv5-awk {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  margin-right: 4px;
}
.sv5-ai {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px 5px 6px;
  background: var(--sv5-bg-3);
  border: 1px solid var(--sv5-line);
  border-radius: 999px;
  font-size: 12px;
}
.sv5-ic {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-ic svg {
  width: 12px;
  height: 12px;
}
.sv5-ic-g {
  background: var(--sv5-amber-bg);
  color: var(--sv5-amber);
}
.sv5-ic-b {
  background: rgba(56, 97, 251, 0.15);
  color: var(--sv5-blue);
}
.sv5-ic-v {
  background: var(--sv5-green-bg);
  color: var(--sv5-green);
}
.sv5-ai b {
  color: var(--sv5-t1);
  font-weight: 500;
}
.sv5-ai span {
  color: var(--sv5-t3);
  font-size: 11px;
}

/* ═══ 4. HERO GRID (rating + chart) ═════════════════════════════════ */
.sv5-hg {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 32px;
  margin-bottom: 24px;
}
@media (max-width: 768px) {
  .sv5-hg {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .sv5-lg {
    width: 100px;
    height: 60px;
    border-radius: 12px;
    padding: 5px;
  }
}

/* ═══ Mobile hero layout v1.6.206 ═══
   Grid layout that places: logo + name (row 1), badges (row 2 next to logo),
   synonyms (row 3 full-width below logo), action buttons (row 4 horizontal scroll). */
@media (max-width: 720px) {
  .sv5-hd {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto auto auto;
    column-gap: 14px;
    row-gap: 6px;
    align-items: start;
    flex-wrap: nowrap; /* override default flex */
  }
  .sv5-lg {
    grid-column: 1;
    grid-row: 1 / span 2; /* logo spans the title and badges rows */
    align-self: start;
  }
  /* `display: contents` lets .sv5-hi children become direct grid children */
  .sv5-hd > .sv5-hi {
    display: contents;
  }
  .sv5-hd > .sv5-hi > .sv5-nr {
    grid-column: 2;
    grid-row: 1; /* row 1 — title + badges */
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin-bottom: 0;
  }
  /* Title takes the full width of column 2 → forces badges onto row 2 visually */
  .sv5-hd > .sv5-hi > .sv5-nr > .sv5-nt {
    flex: 0 0 100%;
    font-size: 22px;
    line-height: 1.15;
    margin: 0;
    word-break: break-word;
  }
  /* Badges stay nicely aligned in the wrap */
  .sv5-hd > .sv5-hi > .sv5-nr > .sv5-rk,
  .sv5-hd > .sv5-hi > .sv5-nr > .sv5-vr,
  .sv5-hd > .sv5-hi > .sv5-nr > .sv5-tk {
    font-size: 10.5px;
    padding: 3px 8px;
    flex-shrink: 0;
  }
  /* Synonyms row — full width below logo */
  .sv5-hd > .sv5-hi > .sv5-al {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.55;
    color: var(--sv5-t2);
    word-break: break-word;
  }
  /* Action buttons row — horizontal scroll if too many */
  .sv5-hd > .sv5-ac {
    grid-column: 1 / -1;
    grid-row: 4;
    margin-top: 6px;
    display: flex;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
    padding-bottom: 6px;
    /* Negative margin so scroll edges align with card padding */
    margin-left: -4px;
    margin-right: -4px;
    padding-left: 4px;
    padding-right: 4px;
  }
  .sv5-hd > .sv5-ac::-webkit-scrollbar {
    height: 3px;
  }
  .sv5-hd > .sv5-ac::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 2px;
  }
  .sv5-hd > .sv5-ac::-webkit-scrollbar-track {
    background: transparent;
  }
  .sv5-hd > .sv5-ac > .sv5-ab,
  .sv5-hd > .sv5-ac > .sv5-ab-wrap,
  .sv5-hd > .sv5-ac > .sv-rev-trigger {
    flex-shrink: 0; /* buttons don't shrink — they cause horizontal scroll */
    white-space: nowrap;
  }
}
.sv5-rc {
  display: flex;
  flex-direction: column;
}
.sv5-lb {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  margin-bottom: 8px;
}
.sv5-rvr {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.sv5-rb {
  font-size: 56px;
  font-weight: 900;
  color: var(--sv5-t1);
  line-height: 1;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
}
.sv5-rm {
  font-size: 18px;
  color: var(--sv5-t4);
  font-weight: 400;
}
.sv5-trd {
  font-size: 13px;
  font-weight: 600;
  padding: 4px 9px;
  border-radius: var(--sv5-r);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-variant-numeric: tabular-nums;
}
.sv5-trd svg {
  width: 12px;
  height: 12px;
}
.sv5-trd-up {
  background: var(--sv5-green-bg);
  color: var(--sv5-green);
}
.sv5-trd-dn {
  background: var(--sv5-red-bg);
  color: var(--sv5-red);
}
.sv5-rkl {
  font-size: 13px;
  color: var(--sv5-t2);
  margin-bottom: 14px;
  line-height: 1.5;
}
.sv5-rkl b {
  color: var(--sv5-t1);
  font-weight: 600;
}
.sv5-tg {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-tg .t {
  font-size: 12px;
  padding: 4px 10px;
  border-radius: var(--sv5-r);
  font-weight: 500;
  border: 1px solid;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.sv5-tg .t.g {
  background: var(--sv5-green-bg);
  color: var(--sv5-green);
  border-color: var(--sv5-green-soft);
}
.sv5-tg .t.y {
  background: var(--sv5-amber-bg);
  color: var(--sv5-amber);
  border-color: var(--sv5-amber-soft);
}
.sv5-tg .t.n {
  background: var(--sv5-bg-2);
  color: var(--sv5-t2);
  border-color: var(--sv5-line-2);
}

/* ═══ CHART HEAD + LINE CHART ═══════════════════════════════════════ */
.sv5-ch {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sv5-chh {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.sv5-chl {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
}
.sv5-ci {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
}
.sv5-cd {
  width: 14px;
  height: 2px;
  border-radius: 1px;
  flex-shrink: 0;
}
.sv5-cn {
  color: var(--sv5-t2);
}
.sv5-cv {
  color: var(--sv5-t1);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.sv5-cdl {
  font-size: 11px;
  font-weight: 500;
  padding: 1px 6px;
  border-radius: 4px;
}
.sv5-cdl.up {
  background: var(--sv5-green-bg);
  color: var(--sv5-green);
}
.sv5-cdl.dn {
  background: var(--sv5-red-bg);
  color: var(--sv5-red);
}
.sv5-cdl.n {
  background: var(--sv5-bg-3);
  color: var(--sv5-t3);
}
.sv5-pls {
  display: flex;
  gap: 0;
  background: var(--sv5-bg-2);
  padding: 3px;
  border-radius: var(--sv5-r);
  border: 1px solid var(--sv5-line);
}
.sv5-p {
  font-size: 11px;
  padding: 5px 11px;
  border-radius: 5px;
  color: var(--sv5-t3);
  cursor: pointer;
  font-weight: 500;
  transition: all 0.15s;
  user-select: none;
}
.sv5-p:hover {
  color: var(--sv5-t1);
}
.sv5-p.sv5-on {
  background: var(--sv5-bg-3);
  color: var(--sv5-t1);
}

/* Main line chart canvas */
.sv5-chart-wrap {
  width: 100% !important;
  height: 320px !important;
  position: relative;
  min-width: 200px;
  margin-top: 8px;
}
.sv5-chart-wrap canvas,
.sv5-canvas {
  width: 100% !important;
  height: 100% !important;
  display: block;
}

/* Chart type switcher (Line / Bar / Area) */
.sv5-ctype {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 999px;
  margin-left: 8px;
}
.sv5-ctype-b {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px 5px 9px;
  background: transparent;
  border: none;
  color: #848E9C;
  font-family: var(--font);
  font-size: 11px;
  font-weight: 600;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.15s;
  letter-spacing: 0.02em;
}
.sv5-ctype-b:hover { color: #EAECEF; background: rgba(255,255,255,.04); }
.sv5-ctype-b.sv5-on {
  color: #0B0E11;
  background: #F0B90B;
}
.sv5-ctype-b.sv5-on:hover { background: #FCD535; }
.sv5-ctype-b svg { flex-shrink: 0; }

@media (max-width: 720px) {
  .sv5-ctype { margin-left: 0; margin-top: 6px; }
  .sv5-ctype-b span { display: none; }
  .sv5-ctype-b { padding: 6px 8px; }
}

/* ═══ 5. CTA ROW ════════════════════════════════════════════════════ */
.sv5-cta {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.sv5-bp {
  background: var(--sv5-amber);
  color: var(--sv5-bg-0);
  padding: 10px 20px;
  border-radius: var(--sv5-r);
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background 0.15s;
  text-decoration: none;
  font-family: var(--font);
  line-height: 1;
}
.sv5-bp:hover {
  background: var(--sv5-yellow);
  color: var(--sv5-bg-0);
}
.sv5-bp svg {
  width: 15px;
  height: 15px;
}
.sv5-bs {
  background: var(--sv5-bg-2);
  color: var(--sv5-t1);
  padding: 10px 16px;
  border-radius: var(--sv5-r);
  font-size: 13px;
  border: 1px solid var(--sv5-line-2);
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  transition: all 0.15s;
  text-decoration: none;
  font-family: var(--font);
  line-height: 1;
}
.sv5-bs:hover {
  background: var(--sv5-bg-3);
  color: var(--sv5-t1);
  border-color: var(--sv5-bg-4);
}
.sv5-bs svg {
  width: 14px;
  height: 14px;
  color: var(--sv5-t3);
}
.sv5-bs:hover svg {
  color: var(--sv5-t1);
}
.sv5-lvb {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  color: var(--sv5-t2);
  padding: 4px 10px;
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-r);
}

/* ═══ 6. STATS BAR ══════════════════════════════════════════════════ */
.sv5-st {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  overflow: hidden;
  margin-bottom: 24px;
}
@media (max-width: 900px) {
  .sv5-st { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
  .sv5-st { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.sv5-sc {
  padding: 14px 16px;
  border-right: 1px solid var(--sv5-line);
}
.sv5-sc:last-child {
  border-right: none;
}
.sv5-sk {
  font-size: 11px;
  color: var(--sv5-t3);
  margin-bottom: 6px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sv5-sv {
  font-size: 20px;
  font-weight: 700;
  color: var(--sv5-t1);
  line-height: 1.1;
  letter-spacing: -0.025em;
  font-variant-numeric: tabular-nums;
}
.sv5-sv.sv5-g {
  color: var(--sv5-green);
}
.sv5-sv.sv5-m {
  color: var(--sv5-t4);
  font-weight: 500;
}
.sv5-sv small {
  font-size: 12px;
  color: var(--sv5-t4);
  font-weight: 400;
  margin-left: 2px;
}
.sv5-ss {
  font-size: 11px;
  color: var(--sv5-t3);
  margin-top: 3px;
}
.sv5-ss.sv5-g {
  color: var(--sv5-green);
}
.sv5-ss.sv5-m {
  color: var(--sv5-t4);
}

/* ═══ 7. RATING SEGMENTS (3 cols) ═══════════════════════════════════ */
.sv5-rs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}
@media (max-width: 768px) {
  .sv5-rs { grid-template-columns: 1fr; }
}
.sv5-sg {
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  padding: 16px;
}
.sv5-sg-m {
  background: var(--sv5-bg-1);
  border-style: dashed;
}
.sv5-sgh {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  gap: 6px;
}
.sv5-sgt {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sv5-sgc {
  font-size: 11px;
  color: var(--sv5-t4);
}
.sv5-sgr {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.sv5-sgb {
  font-size: 32px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.035em;
  font-variant-numeric: tabular-nums;
}
.sv5-sgb.sv5-g { color: var(--sv5-green); }
.sv5-sgb.sv5-y { color: var(--sv5-amber); }
.sv5-sgb.sv5-m { color: var(--sv5-t4); }
.sv5-sgp {
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 4px;
  font-weight: 500;
  border: 1px solid;
}
.sv5-sgp-g {
  background: var(--sv5-green-bg);
  color: var(--sv5-green);
  border-color: var(--sv5-green-soft);
}
.sv5-sgp-y {
  background: var(--sv5-amber-bg);
  color: var(--sv5-amber);
  border-color: var(--sv5-amber-soft);
}
.sv5-sgp-m {
  background: var(--sv5-bg-3);
  color: var(--sv5-t3);
  border-color: var(--sv5-line);
}
.sv5-sgl {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.sv5-sgli {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 13px;
}
.sv5-sgli .k {
  color: var(--sv5-t2);
  flex-shrink: 0;
  min-width: 92px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.sv5-sgli-ico {
  flex-shrink: 0;
}
.sv5-sgli .b {
  flex: 1;
  height: 4px;
  background: var(--sv5-bg-3);
  border-radius: 2px;
  overflow: hidden;
}
.sv5-sgli .b:empty {
  background: var(--sv5-bg-3);
}
.sv5-sgli .bf {
  height: 100%;
  border-radius: 2px;
  transition: width 0.3s ease;
}
.sv5-sgli .v {
  color: var(--sv5-t1);
  font-weight: 600;
  min-width: 26px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-size: 13px;
}
.sv5-sgli .v.sv5-m-v {
  color: var(--sv5-t4);
}

/* ═══ 8. WIDGETS ROW (RADAR + DONUT + GAUGE) ════════════════════════ */
.sv5-widgets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}
@media (max-width: 900px) {
  .sv5-widgets { grid-template-columns: 1fr; }
}
.sv5-wg {
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  padding: 14px;
  display: flex;
  flex-direction: column;
}
.sv5-wg-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  gap: 6px;
}
.sv5-wg-t {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sv5-wg-s {
  font-size: 11px;
  color: var(--sv5-t4);
  font-weight: 500;
}
.sv5-wg-body {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 140px;
}
.sv5-canvas-wrap {
  position: relative;
  width: 100%;
  height: 160px;
}
.sv5-canvas-wrap canvas {
  width: 100% !important;
  height: 100% !important;
}

/* Donut */
.sv5-donut-wrap {
  position: relative;
  width: 140px;
  height: 140px;
}
.sv5-donut-wrap canvas {
  width: 140px !important;
  height: 140px !important;
}
.sv5-donut-center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  pointer-events: none;
}
.sv5-donut-big {
  font-size: 26px;
  font-weight: 800;
  color: var(--sv5-green);
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.sv5-donut-small {
  font-size: 10px;
  color: var(--sv5-t3);
  margin-top: 3px;
  font-weight: 500;
}

/* Gauge */
.sv5-gauge-wrap {
  position: relative;
  width: 160px;
  height: 110px;
}
.sv5-gauge-wrap canvas {
  width: 160px !important;
  height: 110px !important;
}
.sv5-gauge-center {
  position: absolute;
  top: 58%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
}
.sv5-gauge-big {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--sv5-amber);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.sv5-gauge-big small {
  font-size: 13px;
  color: var(--sv5-t4);
  font-weight: 400;
  margin-left: 1px;
}
.sv5-gauge-small {
  font-size: 10px;
  color: var(--sv5-t3);
  font-weight: 500;
  margin-top: 3px;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ═══ 9. PROS / CONS ════════════════════════════════════════════════ */
.sv5-pc {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 24px;
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  overflow: hidden;
}
@media (max-width: 600px) {
  .sv5-pc { grid-template-columns: 1fr; }
  .sv5-pcc:first-child {
    border-right: none !important;
    border-bottom: 1px solid var(--sv5-line);
  }
}
.sv5-pcc {
  padding: 16px 20px;
}
.sv5-pcc:first-child {
  border-right: 1px solid var(--sv5-line);
}
.sv5-pch {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.sv5-pch::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.sv5-pch-p::before { background: var(--sv5-green); }
.sv5-pch-c::before { background: var(--sv5-red); }
.sv5-pci {
  font-size: 13px;
  color: var(--sv5-t1);
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-bottom: 7px;
  line-height: 1.5;
}
.sv5-pci:last-child { margin-bottom: 0; }
.sv5-pci svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 2px;
  padding: 2px;
  border-radius: 4px;
  box-sizing: content-box;
}
.sv5-pci-p svg {
  color: var(--sv5-green);
  background: var(--sv5-green-bg);
}
.sv5-pci-c svg {
  color: var(--sv5-red);
  background: var(--sv5-red-bg);
}

/* ═══ 10. TRUST STRIP ═══════════════════════════════════════════════ */
.sv5-ts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 24px;
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  overflow: hidden;
}
@media (max-width: 600px) {
  .sv5-ts { grid-template-columns: 1fr; }
  .sv5-tsc:first-child {
    border-right: none !important;
    border-bottom: 1px solid var(--sv5-line);
  }
}
.sv5-tsc {
  padding: 16px 20px;
}
.sv5-tsc:first-child {
  border-right: 1px solid var(--sv5-line);
}
.sv5-tsh {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.sv5-tsh svg {
  color: var(--sv5-t3);
  flex-shrink: 0;
}
.sv5-pays {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-pay {
  height: 28px;
  padding: 0 10px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  color: var(--sv5-t1);
  background: var(--sv5-bg-3);
  border: 1px solid var(--sv5-line-2);
  letter-spacing: 0.01em;
  line-height: 1;
}
.sv5-pay-visa,
.sv5-pay-visa-mastercard,
.sv5-pay-mc,
.sv5-pay-mastercard {
  border-color: var(--sv5-amber-soft);
  color: var(--sv5-amber);
}
.sv5-pay-monobank,
.sv5-pay-mono,
.sv5-pay-apple-pay {
  background: var(--sv5-bg-3);
  color: var(--sv5-t1);
}
.sv5-pay-privatbank,
.sv5-pay-privat24,
.sv5-pay-privat {
  border-color: var(--sv5-green-soft);
  color: var(--sv5-green);
}
.sv5-pay-google-pay,
.sv5-pay-g-pay {
  background: var(--sv5-bg-3);
  color: var(--sv5-t1);
}
.sv5-pay-more {
  background: var(--sv5-bg-1);
  color: var(--sv5-t3);
}
.sv5-prv {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-pr {
  font-size: 11px;
  padding: 5px 11px;
  background: var(--sv5-bg-3);
  color: var(--sv5-t1);
  border: 1px solid var(--sv5-line);
  border-radius: 5px;
  font-weight: 500;
}
.sv5-pr-on {
  background: var(--sv5-amber-bg);
  color: var(--sv5-amber);
  border-color: var(--sv5-amber-soft);
}

/* ═══ 11. SIMILAR CASINOS ═══════════════════════════════════════════ */
.sv5-sm {
  display: grid;
  grid-template-columns: 110px repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 24px;
  align-items: stretch;
}
@media (max-width: 1024px) {
  .sv5-sm { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sv5-sml { grid-column: 1 / -1; padding: 4px 0 !important; }
}
@media (max-width: 640px) {
  .sv5-sm {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
}
.sv5-sml {
  font-size: 11px;
  color: var(--sv5-t3);
  font-weight: 500;
  padding: 12px;
  display: flex;
  align-items: center;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sv5-smc {
  background: var(--sv5-bg-2);
  border: 1px solid var(--sv5-line);
  border-radius: var(--sv5-rm);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  cursor: pointer;
  transition: all 0.15s;
  text-decoration: none;
  color: inherit;
}
.sv5-smc:hover {
  border-color: var(--sv5-line-2);
  background: var(--sv5-bg-3);
  color: inherit;
}
.sv5-smt {
  display: flex;
  align-items: center;
  gap: 8px;
}
.sv5-slg {
  width: 32px;
  height: 32px;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--sv5-t1);
  background: var(--sv5-bg-3);
  border: 1px solid var(--sv5-line-2);
  letter-spacing: -0.02em;
  flex-shrink: 0;
  overflow: hidden;
}
.sv5-slg-img {
  padding: 3px;
}
.sv5-slg-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.sv5-smt-meta {
  min-width: 0;
  flex: 1;
}
.sv5-smn {
  font-size: 13px;
  font-weight: 600;
  color: var(--sv5-t1);
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.sv5-smr {
  font-size: 11px;
  color: var(--sv5-t4);
  font-weight: 400;
  margin-top: 1px;
}
.sv5-sms {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.sv5-smv {
  font-size: 20px;
  font-weight: 700;
  color: var(--sv5-t1);
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}
.sv5-smd {
  font-size: 11px;
  font-weight: 500;
  color: var(--sv5-green);
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.sv5-smd svg {
  width: 10px;
  height: 10px;
}
.sv5-smd-dn {
  color: var(--sv5-red);
}

/* ═══ 12. TABS (sticky) ═════════════════════════════════════════════ */
.sv5-tb {
  display: flex;
  gap: 0;
  border-top: 1px solid var(--sv5-line);
  margin: 0 -28px -24px;
  padding: 0 28px;
  overflow-x: auto;
  scrollbar-width: none;
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--sv5-bg-1);
  border-bottom-left-radius: var(--sv5-rl);
  border-bottom-right-radius: var(--sv5-rl);
}
.sv5-tb::-webkit-scrollbar {
  display: none;
}
.sv5-tbi {
  font-size: 14px;
  padding: 12px 16px;
  color: var(--sv5-t3);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  font-weight: 500;
  white-space: nowrap;
  transition: all 0.15s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
}
.sv5-tbi:hover {
  color: var(--sv5-t1);
}
.sv5-tbi-on {
  color: var(--sv5-t1);
  border-bottom-color: var(--sv5-amber);
}
.sv5-tbc {
  font-size: 11px;
  background: var(--sv5-bg-3);
  padding: 1px 7px;
  border-radius: 999px;
  color: var(--sv5-t3);
  font-weight: 500;
}
.sv5-tbi-on .sv5-tbc {
  background: var(--sv5-amber-bg);
  color: var(--sv5-amber);
}

/* ═══ RESPONSIVE FIXES ══════════════════════════════════════════════ */
@media (max-width: 640px) {
  .sv5-card { padding: 18px 16px; }
  .sv5-hd { gap: 12px; }
  .sv5-nt { font-size: 20px; }
  .sv5-rb { font-size: 44px; }
  .sv5-sgb { font-size: 26px; }
  .sv5-ac {
    width: 100%;
    justify-content: flex-start;
    margin-top: 4px;
  }
  .sv5-ab {
    padding: 6px 10px;
    font-size: 12px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
 *  REACTION BLOCK + STATS SECTION · Binance Dark
 *  Uses wrap-scoped tokens from .sv5-wrap above
 * ═══════════════════════════════════════════════════════════════════════ */

/* ═══ REACTION BLOCK ════════════════════════════════════════════════ */
.sv5-rb {
  background: linear-gradient(180deg, #1a1d24 0%, #181A20 100%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 20px 24px;
  margin: 20px 0;
  font-family: var(--font);
  color: #EAECEF;
  position: relative;
  overflow: hidden;
}
.sv5-rb::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,185,11,.25), transparent);
}
.sv5-rb-hd {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
  gap: 14px;
  flex-wrap: wrap;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.sv5-rb-ti {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: #EAECEF;
  letter-spacing: -0.01em;
  line-height: 1.3;
  white-space: normal;
}
.sv5-rb-ti svg {
  color: #F6465D;
  flex-shrink: 0;
}
.sv5-rb-to {
  font-size: 12px;
  color: #848E9C;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.04);
  border-radius: 99px;
  white-space: nowrap;
  letter-spacing: 0;
  line-height: 1.3;
  -webkit-font-smoothing: antialiased;
  text-shadow: none;
}
.sv5-rb-to-n {
  color: #EAECEF;
  font-weight: 700;
}
.sv5-rb-to-l {
  color: #848E9C;
  font-weight: 500;
}
.sv5-rb-pills {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}
@media (max-width: 640px) {
  .sv5-rb-pills {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.sv5-rb-btn {
  background: var(--sv5-bg-2, #1E2329);
  border: 1px solid var(--sv5-line-2, rgba(255, 255, 255, 0.1));
  border-radius: var(--sv5-rm, 12px);
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: all 0.15s;
  font-family: var(--font);
  color: var(--sv5-t1, #EAECEF);
  text-align: left;
  width: 100%;
}
.sv5-rb-btn:hover {
  background: var(--sv5-bg-3, #2B2F36);
  border-color: var(--sv5-bg-4, #474D57);
}
.sv5-rb-btn.sv5-on {
  border-color: var(--sv5-amber, #F0B90B);
  background: var(--sv5-amber-bg, rgba(240, 185, 11, 0.1));
}
.sv5-rb-btn-ico {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-rb-btn-ico-g {
  background: rgba(14, 203, 129, 0.12);
  color: var(--sv5-green, #0ECB81);
}
.sv5-rb-btn-ico-n {
  background: rgba(132, 142, 156, 0.15);
  color: var(--sv5-t3, #848E9C);
}
.sv5-rb-btn-ico-r {
  background: rgba(246, 70, 93, 0.12);
  color: var(--sv5-red, #F6465D);
}
.sv5-rb-btn-ico-p {
  background: rgba(108, 92, 231, 0.15);
  color: var(--sv5-purple, #6C5CE7);
}
.sv5-rb-btn-mid {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sv5-rb-btn-lbl {
  font-size: 13px;
  font-weight: 500;
  color: var(--sv5-t1, #EAECEF);
}
.sv5-rb-btn-count {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.sv5-rb-btn-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--sv5-t1, #EAECEF);
  font-variant-numeric: tabular-nums;
}
.sv5-rb-btn-pct {
  font-size: 11px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.sv5-rb-ft {
  font-size: 12px;
  color: #848E9C;
  margin-top: 16px;
  padding: 10px 16px;
  text-align: center;
  line-height: 1.5;
  font-weight: 500;
  letter-spacing: 0;
  word-spacing: normal;
  white-space: normal;
  background: rgba(255,255,255,.02);
  border-radius: 8px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: none;
  text-shadow: none;
}
.sv5-rb-ft strong {
  color: #F0B90B;
  font-weight: 700;
}

/* ═══ STATS SECTION ═════════════════════════════════════════════════ */
.sv5-st-sec {
  background: var(--sv5-bg-1, #181A20);
  border: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  border-radius: var(--sv5-rl, 16px);
  padding: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  font-family: var(--font);
  color: var(--sv5-t1, #EAECEF);
}
.sv5-st-ti {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--sv5-t1, #EAECEF);
  margin-bottom: 16px;
}
.sv5-st-ti svg {
  color: var(--sv5-amber, #F0B90B);
}
.sv5-st-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 900px) {
  .sv5-st-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.sv5-st-card {
  background: var(--sv5-bg-2, #1E2329);
  border: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  border-radius: var(--sv5-rm, 12px);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sv5-st-wide {
  grid-column: span 2;
}
.sv5-st-wide-hd {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.sv5-st-wide-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sv5-st-ico {
  width: 32px;
  height: 32px;
  border-radius: var(--sv5-r, 8px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-st-ico-a {
  background: var(--sv5-amber-bg, rgba(240, 185, 11, 0.1));
  color: var(--sv5-amber, #F0B90B);
}
.sv5-st-ico-g {
  background: rgba(14, 203, 129, 0.12);
  color: var(--sv5-green, #0ECB81);
}
.sv5-st-ico-b {
  background: rgba(56, 97, 251, 0.12);
  color: var(--sv5-blue, #3861FB);
}
.sv5-st-ico-p {
  background: rgba(108, 92, 231, 0.12);
  color: var(--sv5-purple, #6C5CE7);
}
.sv5-st-val {
  font-size: 22px;
  font-weight: 700;
  color: var(--sv5-t1, #EAECEF);
  line-height: 1;
  letter-spacing: -0.025em;
  font-variant-numeric: tabular-nums;
}
.sv5-st-val-sm {
  font-size: 18px;
}
.sv5-st-lbl {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
}
.sv5-st-sub {
  font-size: 11px;
  color: var(--sv5-t4, #5E6673);
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sv5-st-bars {
  display: flex;
  gap: 0;
  height: 4px;
  margin-top: 8px;
  border-radius: 2px;
  overflow: hidden;
  background: var(--sv5-bg-3, #2B2F36);
}
.sv5-st-bar-seg {
  height: 100%;
}
.sv5-st-legend {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 4px;
}
.sv5-st-l-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sv5-st-l-name {
  font-size: 10px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
}
.sv5-st-l-val {
  font-size: 12px;
  color: var(--sv5-t1, #EAECEF);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  STICKY NAV + SECTION BLOCKS · Binance Dark
 * ═══════════════════════════════════════════════════════════════════════ */

/* Force all tab-content sections to always be visible (kill legacy JS hiding) */
.sv5-section,
section.sv5-section,
.content-main .tab-content,
.content-main .tab-content.tab-hidden,
[data-tab-content] {
  display: block !important;
}

/* Sticky navigation bar — replaces JS tab switcher */
.sv5-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  gap: 0;
  background: var(--sv5-bg-1, #181A20);
  border: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  border-radius: var(--sv5-rl, 16px);
  padding: 4px 8px;
  margin-bottom: 20px;
  overflow-x: auto;
  scrollbar-width: none;
  font-family: var(--font);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.sv5-nav::-webkit-scrollbar {
  display: none;
}
.sv5-nav-i {
  font-size: 13px;
  padding: 10px 14px;
  color: var(--sv5-t3, #848E9C);
  cursor: pointer;
  border-radius: var(--sv5-r, 8px);
  font-weight: 500;
  white-space: nowrap;
  transition: all 0.15s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
}
.sv5-nav-i:hover {
  color: var(--sv5-t1, #EAECEF);
  background: var(--sv5-bg-2, #1E2329);
}
.sv5-nav-on {
  color: var(--sv5-amber, #F0B90B);
  background: var(--sv5-amber-bg, rgba(240, 185, 11, 0.1));
}
.sv5-nav-on:hover {
  color: var(--sv5-amber, #F0B90B);
  background: var(--sv5-amber-bg, rgba(240, 185, 11, 0.1));
}
.sv5-nav-c {
  font-size: 11px;
  background: var(--sv5-bg-3, #2B2F36);
  padding: 1px 7px;
  border-radius: 999px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.sv5-nav-on .sv5-nav-c {
  background: rgba(240, 185, 11, 0.2);
  color: var(--sv5-amber, #F0B90B);
}

/* Each section block */
.sv5-section {
  background: var(--sv5-bg-1, #181A20);
  border: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  border-radius: var(--sv5-rl, 16px);
  padding: 20px;
  margin-bottom: 20px;
  font-family: var(--font);
  color: var(--sv5-t1, #EAECEF);
  scroll-margin-top: 80px;
}

/* Section header */
.sv5-section-hd {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  flex-wrap: wrap;
}
.sv5-section-ti {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 700;
  color: var(--sv5-t1, #EAECEF);
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.2;
}
.sv5-section-ti svg {
  color: var(--sv5-amber, #F0B90B);
  flex-shrink: 0;
}
.sv5-section-s {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* Legacy content styles inside sections — inherit dark theme basics */
.sv5-section .block-section,
.sv5-section .reviews-section,
.sv5-section .pros-cons-section {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0 0 20px;
}

@media (max-width: 640px) {
  .sv5-section {
    padding: 16px;
    border-radius: var(--sv5-rm, 12px);
  }
  .sv5-section-ti {
    font-size: 16px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
 *  GLOBAL DARK OVERRIDE FOR SINGLE-CASINO PAGE
 * ═══════════════════════════════════════════════════════════════════════
 *  Remaps all legacy CSS custom properties (--bg, --white, --ink-*, --line,
 *  --teal, --amber, --green, --red, --blue and their -l variants) to
 *  Binance dark palette. Every legacy block inside single-casino automatically
 *  becomes dark without editing individual components.
 * ═══════════════════════════════════════════════════════════════════════ */

body.single-casino {
  /* Backgrounds */
  --bg: #0B0E11;
  --white: #181A20;

  /* Text ramp */
  --ink-1: #EAECEF;
  --ink-2: #B7BDC6;
  --ink-3: #848E9C;
  --ink-4: #5E6673;

  /* Lines & borders */
  --line: rgba(255, 255, 255, 0.06);

  /* Semantic colors — remap to palette */
  --teal:   #0ECB81;
  --teal-l: rgba(14, 203, 129, 0.12);
  --amber:  #F0B90B;
  --amber-l: rgba(240, 185, 11, 0.1);
  --green:  #0ECB81;
  --green-l: rgba(14, 203, 129, 0.12);
  --red:    #F6465D;
  --red-l:  rgba(246, 70, 93, 0.12);
  --blue:   #3861FB;
  --blue-l: rgba(56, 97, 251, 0.12);

  background: #0B0E11;
  color: #EAECEF;
  font-family: var(--font);
}

/* Force dark on elements that use hardcoded #fff */
body.single-casino .reaction-btn,
body.single-casino .review-card,
body.single-casino .summary-card,
body.single-casino .widget,
body.single-casino .block-section,
body.single-casino .stat-card,
body.single-casino .stats-section,
body.single-casino .pros-cons-section,
body.single-casino .reviews-section,
body.single-casino .seo-acc,
body.single-casino .faq-item,
body.single-casino .chart-container,
body.single-casino .tabs,
body.single-casino .content-main > div,
body.single-casino .sidebar-widgets .widget {
  background: #181A20;
  border-color: rgba(255, 255, 255, 0.06);
  color: #EAECEF;
}

/* Nested surfaces — slightly lighter */
body.single-casino .pc-col,
body.single-casino .summary-card .summary-bar,
body.single-casino .stat-bar,
body.single-casino .reaction-btn-icon,
body.single-casino .review-category-bar,
body.single-casino .pc-item-bar,
body.single-casino .reviews-quick-filters .qf-btn,
body.single-casino .reviews-search,
body.single-casino .reviews-sort-select,
body.single-casino input,
body.single-casino select,
body.single-casino textarea {
  background: #1E2329;
  border-color: rgba(255, 255, 255, 0.1);
  color: #EAECEF;
}

/* Active filter pills */
body.single-casino .qf-btn.active,
body.single-casino .tab.active,
body.single-casino .block-tab.active {
  background: rgba(240, 185, 11, 0.1);
  border-color: rgba(240, 185, 11, 0.3);
  color: #F0B90B;
}

/* Icons and section headers — amber */
body.single-casino .stats-title svg,
body.single-casino .pc-title svg,
body.single-casino .block-title svg,
body.single-casino .widget-hd svg,
body.single-casino .reaction-title svg {
  color: #F0B90B;
}

/* Trust items in sidebar — remove emoji icons visually */
body.single-casino .trust-icon {
  background: #2B2F36;
  border-radius: 8px;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  filter: grayscale(1) brightness(1.5);
}

/* Legacy score boxes, badges */
body.single-casino .review-score,
body.single-casino .score-box {
  background: rgba(14, 203, 129, 0.12);
  color: #0ECB81;
  border: 1px solid rgba(14, 203, 129, 0.25);
}

/* Dates, meta text */
body.single-casino .review-date,
body.single-casino .review-meta,
body.single-casino .author-stats,
body.single-casino .summary-label,
body.single-casino .stat-label,
body.single-casino .stat-sub,
body.single-casino .widget-hd {
  color: #848E9C;
}

/* Author name */
body.single-casino .review-author,
body.single-casino .review-name,
body.single-casino .author-name {
  color: #EAECEF;
}

/* Verified badge */
body.single-casino .verified-badge,
body.single-casino .review-verified {
  background: rgba(14, 203, 129, 0.12);
  color: #0ECB81;
  border: 1px solid rgba(14, 203, 129, 0.25);
}

/* Pros/Cons tag chips */
body.single-casino .pc-tag,
body.single-casino .review-pros-list .pc-tag-green,
body.single-casino .review-cons-list .pc-tag-red {
  background: #2B2F36;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #B7BDC6;
}

/* Scrollbar — keep it dark */
body.single-casino ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
body.single-casino ::-webkit-scrollbar-track {
  background: #0B0E11;
}
body.single-casino ::-webkit-scrollbar-thumb {
  background: #2B2F36;
  border-radius: 4px;
}
body.single-casino ::-webkit-scrollbar-thumb:hover {
  background: #474D57;
}

/* Remove any leftover white backgrounds from specific legacy selectors */
body.single-casino .seo-content,
body.single-casino .review-reply,
body.single-casino .casino-reply {
  background: #1E2329;
  border-left: 2px solid #F0B90B;
  color: #B7BDC6;
}

/* Details/summary (FAQ) */
body.single-casino details,
body.single-casino .faq-item {
  background: #1E2329;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 12px;
  margin-bottom: 8px;
}
body.single-casino summary,
body.single-casino .faq-q {
  color: #EAECEF;
  padding: 14px 18px;
  cursor: pointer;
  font-weight: 500;
}
body.single-casino .faq-a {
  color: #B7BDC6;
  padding: 0 18px 16px;
}

/* Links — amber by default inside content */
body.single-casino .content-main a:not(.btn):not(.sv5-nav-i):not(.sv5-tbi):not(.sv5-section-ti):not(.sv5-ab):not(.sv5-bp):not(.sv5-bs) {
  color: #F0B90B;
}
body.single-casino .content-main a:hover {
  color: #FCD535;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  TRUST THERMOMETER BLOCK · Binance Dark
 *  Left: vertical scale + glass tube with mercury bulb
 *  Right: big score + label + description + checklist
 * ═══════════════════════════════════════════════════════════════════════ */
.sv5-trust {
  font-family: var(--font);
}
.sv5-trust-body {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 32px;
  align-items: flex-start;
}
@media (max-width: 640px) {
  .sv5-trust-body {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* ═══ LEFT: scale + tube ═══════════════════════════════════════════ */
.sv5-trust-tube-col {
  display: grid;
  grid-template-columns: 1fr 40px;
  gap: 16px;
  align-items: stretch;
  min-height: 320px;
  padding: 20px 0 40px;
}
.sv5-trust-scale {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 6px 0;
}
.sv5-trust-scale-i {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.sv5-trust-scale-n {
  font-size: 15px;
  font-weight: 700;
  color: var(--sv5-t1, #EAECEF);
  font-variant-numeric: tabular-nums;
  min-width: 28px;
}
.sv5-trust-scale-l {
  font-size: 13px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
}

.sv5-trust-tube {
  position: relative;
  width: 40px;
  border-radius: 20px;
  background: var(--sv5-bg-3, #2B2F36);
  border: 1px solid var(--sv5-line-2, rgba(255, 255, 255, 0.1));
  overflow: visible;
}
.sv5-trust-tube-cap {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 26px;
  height: 14px;
  background: var(--sv5-bg-4, #474D57);
  border-radius: 13px 13px 4px 4px;
  z-index: 1;
}
.sv5-trust-tube-fill {
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 4px;
  border-radius: 16px;
  background: linear-gradient(180deg, #0ECB81 0%, #0BA868 100%);
  transition: height 0.8s ease-out;
  min-height: 20px;
}
.sv5-trust-bulb {
  position: absolute;
  bottom: -28px;
  left: 50%;
  transform: translateX(-50%);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--sv5-green, #0ECB81);
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  border: 4px solid var(--sv5-bg-1, #181A20);
  z-index: 2;
}

/* Tube gradient and bulb color scale based on score — use data-attr if needed */
.sv5-trust[data-score-level="low"] .sv5-trust-tube-fill,
.sv5-trust[data-score-level="low"] .sv5-trust-bulb {
  background: var(--sv5-red, #F6465D);
}
.sv5-trust[data-score-level="mid"] .sv5-trust-tube-fill,
.sv5-trust[data-score-level="mid"] .sv5-trust-bulb {
  background: var(--sv5-amber, #F0B90B);
}

/* ═══ RIGHT: score + description + checklist ═══════════════════════ */
.sv5-trust-info {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sv5-trust-score-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  line-height: 1;
}
.sv5-trust-score {
  font-size: 72px;
  font-weight: 900;
  color: var(--sv5-green, #0ECB81);
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.sv5-trust-max {
  font-size: 22px;
  color: var(--sv5-t4, #5E6673);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}
.sv5-trust-label {
  font-size: 18px;
  font-weight: 700;
  color: var(--sv5-green, #0ECB81);
  letter-spacing: -0.015em;
  line-height: 1.2;
}
.sv5-trust-desc {
  font-size: 14px;
  color: var(--sv5-t2, #B7BDC6);
  line-height: 1.55;
  margin: 0;
  max-width: 620px;
}

.sv5-trust-checklist {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sv5-trust-item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--sv5-t1, #EAECEF);
  line-height: 1.4;
}
.sv5-trust-ico {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-trust-pass .sv5-trust-ico {
  background: rgba(14, 203, 129, 0.15);
  color: var(--sv5-green, #0ECB81);
}
.sv5-trust-warn .sv5-trust-ico {
  background: rgba(246, 70, 93, 0.15);
  color: var(--sv5-red, #F6465D);
}
.sv5-trust-fail .sv5-trust-ico {
  background: rgba(246, 70, 93, 0.15);
  color: var(--sv5-red, #F6465D);
}
.sv5-trust-text {
  color: var(--sv5-t1, #EAECEF);
  font-weight: 500;
}
.sv5-trust-warn .sv5-trust-text,
.sv5-trust-fail .sv5-trust-text {
  color: var(--sv5-t2, #B7BDC6);
}

/* Responsive tube */
@media (max-width: 640px) {
  .sv5-trust-tube-col {
    grid-template-columns: 1fr 32px;
    min-height: 280px;
    padding: 16px 0 32px;
  }
  .sv5-trust-tube {
    width: 32px;
  }
  .sv5-trust-bulb {
    width: 52px;
    height: 52px;
    font-size: 16px;
    bottom: -22px;
  }
  .sv5-trust-score {
    font-size: 56px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
 *  6 NEW INTERACTIVE BLOCKS · Binance Dark
 *  Poll · ForWhom · Achievements · Journey · Position · VsAverage
 * ═══════════════════════════════════════════════════════════════════════ */

/* ═══ 1. POLL ══════════════════════════════════════════════════════ */
.sv5-poll-q {
  font-size: 16px;
  font-weight: 700;
  color: var(--sv5-t1, #EAECEF);
  margin-bottom: 14px;
}
.sv5-poll-opts {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}
.sv5-poll-opt {
  position: relative;
  border: 1px solid var(--sv5-line-2, rgba(255, 255, 255, 0.1));
  border-radius: var(--sv5-rm, 12px);
  padding: 14px 18px;
  background: var(--sv5-bg-2, #1E2329);
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.2s;
}
.sv5-poll-opt:hover {
  border-color: var(--sv5-bg-4, #474D57);
}
.sv5-poll-opt.sv5-poll-chosen {
  border-color: var(--sv5-amber, #F0B90B);
  background: var(--sv5-amber-bg, rgba(240, 185, 11, 0.1));
}
.sv5-poll-fill {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  z-index: 0;
  opacity: 0.15;
  border-radius: var(--sv5-rm, 12px);
  transition: width 0.8s ease-out;
}
.sv5-poll-opt-g .sv5-poll-fill { background: var(--sv5-green, #0ECB81); }
.sv5-poll-opt-a .sv5-poll-fill { background: var(--sv5-amber, #F0B90B); }
.sv5-poll-opt-p .sv5-poll-fill { background: var(--sv5-purple, #6C5CE7); }
.sv5-poll-opt-b .sv5-poll-fill { background: var(--sv5-blue, #3861FB); }
.sv5-poll-opt-row {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 14px;
}
.sv5-poll-opt-ico {
  width: 32px; height: 32px;
  border-radius: var(--sv5-r, 8px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-poll-opt-g .sv5-poll-opt-ico { background: rgba(14, 203, 129, 0.15); color: var(--sv5-green, #0ECB81); }
.sv5-poll-opt-a .sv5-poll-opt-ico { background: rgba(240, 185, 11, 0.15); color: var(--sv5-amber, #F0B90B); }
.sv5-poll-opt-p .sv5-poll-opt-ico { background: rgba(108, 92, 231, 0.2);  color: var(--sv5-purple, #6C5CE7); }
.sv5-poll-opt-b .sv5-poll-opt-ico { background: rgba(56, 97, 251, 0.15);  color: var(--sv5-blue, #3861FB); }
.sv5-poll-opt-lbl {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--sv5-t1, #EAECEF);
}
.sv5-poll-opt-pct {
  font-size: 16px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.015em;
}
.sv5-poll-opt-g .sv5-poll-opt-pct { color: var(--sv5-green, #0ECB81); }
.sv5-poll-opt-a .sv5-poll-opt-pct { color: var(--sv5-amber, #F0B90B); }
.sv5-poll-opt-p .sv5-poll-opt-pct { color: var(--sv5-purple, #6C5CE7); }
.sv5-poll-opt-b .sv5-poll-opt-pct { color: var(--sv5-blue, #3861FB); }
.sv5-poll-opt-n {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  font-variant-numeric: tabular-nums;
  min-width: 30px;
  text-align: right;
}
.sv5-poll-ft {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  display: flex;
  gap: 8px;
  align-items: center;
}
.sv5-poll-live {
  color: var(--sv5-green, #0ECB81);
  font-weight: 500;
}

/* ═══ 2. FOR WHOM (D6 — tiles + stacked-bar + detail area) ═══ */
.sv5-fw-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 18px;
}
.sv5-fw-tile {
  background: linear-gradient(180deg, rgba(var(--fw-rgb,132,142,156), .15), rgba(var(--fw-rgb,132,142,156), .02));
  border-top: 3px solid var(--fw-c, #848E9C);
  padding: 20px 16px;
  text-align: center;
  cursor: pointer;
  transition: background .15s ease;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.sv5-fw-tile:hover {
  background: linear-gradient(180deg, rgba(var(--fw-rgb,132,142,156), .22), rgba(var(--fw-rgb,132,142,156), .04));
}
.sv5-fw-tile-active {
  background: linear-gradient(180deg, rgba(var(--fw-rgb,132,142,156), .28), rgba(var(--fw-rgb,132,142,156), .06));
}
.sv5-fw-tile-active::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 50%;
  transform: translateX(-50%);
  width: 0; height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--fw-c);
}
.sv5-fw-tile-ico {
  width: 48px; height: 48px;
  border-radius: 12px;
  background: rgba(var(--fw-rgb,132,142,156), .25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fw-c);
}
.sv5-fw-tile-ico .sv5-fw-ico-new {
  background: transparent;
  color: inherit;
  font-weight: 900;
  font-size: 12px;
  padding: 0;
  letter-spacing: 0.05em;
  box-shadow: none;
}
.sv5-fw-tile-name {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.sv5-fw-tile-tier {
  font-size: 10px;
  font-weight: 800;
  color: var(--fw-c);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* Stacked-bar */
.sv5-fw-stackbar-wrap {
  padding: 0 12px;
  margin-bottom: 18px;
}
.sv5-fw-stackbar {
  display: flex;
  gap: 0;
  height: 12px;
  border-radius: 6px;
  overflow: hidden;
}
.sv5-fw-stackbar-seg {
  cursor: pointer;
  transition: opacity .15s ease;
}
.sv5-fw-stackbar-seg:hover { opacity: .85; }
.sv5-fw-stackbar-labels {
  display: flex;
  margin-top: 8px;
}
.sv5-fw-stackbar-lbl {
  text-align: center;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
}
.sv5-fw-stackbar-num {
  font-size: 18px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.sv5-fw-stackbar-of {
  font-size: 10px;
  font-weight: 700;
  color: #848E9C;
  margin-left: 3px;
  font-family: var(--font, 'Onest'), sans-serif;
}

/* Detail area */
.sv5-fw-detail {
  background: #0B0E11;
  border: 1px solid rgba(255,255,255,.04);
  border-radius: 10px;
  padding: 16px 18px;
}
.sv5-fw-detail-hd {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.sv5-fw-detail-q {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 14px;
  color: #EAECEF;
  font-weight: 700;
}
.sv5-fw-detail-q strong {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-weight: 800;
}
.sv5-fw-detail-pill {
  font-size: 10px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
.sv5-fw-detail-text {
  font-size: 12px;
  color: #B7BDC6;
  line-height: 1.55;
}

/* Responsive */
@media (max-width: 900px) {
  .sv5-fw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Legacy classes kept for backwards-compat (mobile uses .sv5-fw-mobile) */
.sv5-fw-card,
.sv5-fw-ico,
.sv5-fw-name,
.sv5-fw-desc,
.sv5-fw-rating,
.sv5-fw-stars,
.sv5-fw-match { display: none; }

/* ═══ 3. ACHIEVEMENTS — K3 Scoreboard (v1.6.82) ═══ */
.sv5-ach-board {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 22px 24px;
}

/* Header: title + summary + donut */
.sv5-ach-board-hd {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-bottom: 16px;
  margin-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.sv5-ach-board-ti { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sv5-ach-board-h {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -.01em;
}
.sv5-ach-board-h svg { color: #F0B90B; }
.sv5-ach-board-sub {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #848E9C;
}
.sv5-ach-board-sub strong { font-weight: 800; font-variant-numeric: tabular-nums; }
.sv5-ach-board-sub strong.c-g { color: #0ECB81; }
.sv5-ach-board-sub strong.c-t3 { color: #848E9C; }

.sv5-ach-board-meter {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.sv5-ach-board-pct { text-align: right; }
.sv5-ach-board-pct-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 26px;
  font-weight: 900;
  color: #F0B90B;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.sv5-ach-board-pct-l {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  color: #848E9C;
  font-weight: 700;
  margin-top: 2px;
  letter-spacing: .06em;
}
.sv5-ach-board-donut { width: 60px; height: 60px; }

/* Top row: flagship 2fr + 2 mini cards 1fr each */
.sv5-ach-row { display: grid; gap: 12px; }
.sv5-ach-row-top {
  grid-template-columns: 2fr 1fr 1fr;
  margin-bottom: 14px;
}
.sv5-ach-row-rest {
  grid-template-columns: 1fr 1fr;
  margin-bottom: 18px;
}

/* Flagship card */
.sv5-ach-flagship {
  background: linear-gradient(135deg, rgba(var(--ac-rgb,240,185,11),.18), rgba(var(--ac-rgb,240,185,11),.02));
  border: 1px solid rgba(var(--ac-rgb,240,185,11),.35);
  border-radius: 12px;
  padding: 18px;
  display: flex;
  gap: 14px;
  align-items: center;
}
.sv5-ach-flagship-ico {
  width: 56px; height: 56px;
  flex-shrink: 0;
  border-radius: 14px;
  background: rgba(var(--ac-rgb,240,185,11),.25);
  color: var(--ac-c, #F0B90B);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-ach-flagship-body { flex: 1; min-width: 0; }
.sv5-ach-flagship-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}
.sv5-ach-flagship-pill {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  font-weight: 800;
  padding: 3px 7px;
  background: var(--ac-c, #F0B90B);
  color: #0B0E11;
  border-radius: 4px;
  letter-spacing: .04em;
}
.sv5-ach-flagship-date {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  font-weight: 800;
  color: var(--ac-c, #F0B90B);
  letter-spacing: .04em;
}
.sv5-ach-flagship-name {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: #EAECEF;
  margin-bottom: 3px;
  line-height: 1.15;
  letter-spacing: -.01em;
}
.sv5-ach-flagship-desc {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #B7BDC6;
  line-height: 1.45;
}

/* Mini secondary cards (in top row) */
.sv5-ach-mini {
  background: #0B0E11;
  border: 1px solid rgba(var(--ac-rgb,132,142,156),.25);
  border-radius: 12px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sv5-ach-mini-hd {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sv5-ach-mini-ico {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: rgba(var(--ac-rgb,132,142,156),.18);
  color: var(--ac-c, #F0B90B);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-ach-mini-date {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  font-weight: 800;
  color: var(--ac-c, #F0B90B);
  letter-spacing: .04em;
}
.sv5-ach-mini-name {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 12px;
  font-weight: 800;
  color: #EAECEF;
  line-height: 1.2;
  letter-spacing: -.005em;
}
.sv5-ach-mini-desc {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  color: #848E9C;
  line-height: 1.4;
  margin-top: -3px;
}

/* Rest row: full-width row item */
.sv5-ach-row-it {
  background: #0B0E11;
  border: 1px solid rgba(var(--ac-rgb,132,142,156),.25);
  border-radius: 12px;
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.sv5-ach-row-ico {
  width: 38px; height: 38px;
  flex-shrink: 0;
  border-radius: 10px;
  background: rgba(var(--ac-rgb,132,142,156),.18);
  color: var(--ac-c, #F0B90B);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-ach-row-body { flex: 1; min-width: 0; }
.sv5-ach-row-name-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.sv5-ach-row-name {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 12px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -.005em;
}
.sv5-ach-row-status {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  font-weight: 800;
  color: var(--ac-c, #F0B90B);
  letter-spacing: .04em;
  white-space: nowrap;
}
.sv5-ach-row-desc {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 10px;
  color: #848E9C;
  line-height: 1.4;
  margin-top: 2px;
}

/* Locked chip-tags row */
.sv5-ach-locked-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 14px;
  border-top: 1px dashed rgba(132,142,156,.15);
}
.sv5-ach-locked-lbl {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 10px;
  color: #5E6673;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.sv5-ach-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  background: rgba(132,142,156,.08);
  border: 1px solid rgba(132,142,156,.2);
  border-radius: 999px;
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #B7BDC6;
  font-weight: 700;
}
.sv5-ach-chip svg { color: #5E6673; }
.sv5-ach-chip-meta {
  font-style: normal;
  color: #5E6673;
  font-weight: 600;
}

/* Mobile responsive */
@media (max-width: 900px) {
  .sv5-ach-board { padding: 16px 14px; }
  .sv5-ach-board-hd {
    gap: 10px;
    padding-bottom: 12px;
    margin-bottom: 14px;
  }
  .sv5-ach-board-h { font-size: 13px; }
  .sv5-ach-board-h svg { width: 14px; height: 14px; }
  .sv5-ach-board-sub { font-size: 10px; }
  .sv5-ach-board-meter { gap: 8px; }
  .sv5-ach-board-pct-v { font-size: 22px; }
  .sv5-ach-board-pct-l { font-size: 8px; }
  .sv5-ach-board-donut { width: 44px; height: 44px; }

  /* Stack flagship + mini vertically */
  .sv5-ach-row-top {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-bottom: 8px;
  }
  .sv5-ach-flagship {
    grid-column: 1 / -1;
    padding: 12px;
    gap: 10px;
  }
  .sv5-ach-flagship-ico { width: 40px; height: 40px; border-radius: 10px; }
  .sv5-ach-flagship-ico svg { width: 22px; height: 22px; }
  .sv5-ach-flagship-name { font-size: 13px; }
  .sv5-ach-flagship-desc { font-size: 10px; }
  .sv5-ach-flagship-meta { gap: 6px; margin-bottom: 4px; }
  .sv5-ach-flagship-pill { font-size: 8px; padding: 2px 5px; }
  .sv5-ach-flagship-date { font-size: 8px; }

  .sv5-ach-mini { padding: 10px; gap: 5px; }
  .sv5-ach-mini-ico { width: 24px; height: 24px; border-radius: 6px; }
  .sv5-ach-mini-ico svg { width: 12px; height: 12px; }
  .sv5-ach-mini-date { font-size: 8px; }
  .sv5-ach-mini-name { font-size: 11px; }
  .sv5-ach-mini-desc { display: none; }

  .sv5-ach-row-rest {
    grid-template-columns: 1fr;
    gap: 6px;
    margin-bottom: 12px;
  }
  .sv5-ach-row-it { padding: 10px; gap: 10px; }
  .sv5-ach-row-ico { width: 30px; height: 30px; border-radius: 8px; }
  .sv5-ach-row-ico svg { width: 14px; height: 14px; }
  .sv5-ach-row-name { font-size: 11px; }
  .sv5-ach-row-status { font-size: 8px; }
  .sv5-ach-row-desc { font-size: 9px; }

  .sv5-ach-locked-row { gap: 6px; padding-top: 10px; }
  .sv5-ach-locked-lbl { font-size: 9px; width: 100%; }
  .sv5-ach-chip { padding: 4px 8px; font-size: 10px; gap: 4px; }
  .sv5-ach-chip svg { width: 9px; height: 9px; }
}

/* Legacy achievement classes (kept for backwards-compat, hidden) */
.sv5-ach-grid,
.sv5-ach-card,
.sv5-ach-ico:not(.sv5-ach-mini-ico):not(.sv5-ach-row-ico),
.sv5-ach-name,
.sv5-ach-desc,
.sv5-ach-meta,
.sv5-ach-active,
.sv5-ach-lock,
.sv5-ach-locked { display: none; }

/* ═══ 4. PLAYER JOURNEY — Receipt style (v1.6.85) ═══ */
.sv5-pj-board {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 22px 24px;
}

/* Header */
.sv5-pj-board-hd {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding-bottom: 14px;
  margin-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.sv5-pj-board-ti { min-width: 0; }
.sv5-pj-board-h {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -.01em;
}
.sv5-pj-board-h svg { color: #F0B90B; }
.sv5-pj-board-sub {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #848E9C;
  margin-top: 4px;
}
.sv5-pj-board-chk {
  font-family: var(--font-mono, 'JetBrains Mono'), monospace;
  font-size: 10px;
  color: #848E9C;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Receipt */
.sv5-pj-receipt {
  background: #0B0E11;
  border: 1px solid rgba(255,255,255,.04);
  border-radius: 12px;
  padding: 24px;
}
.sv5-pj-receipt-tag {
  font-family: var(--font-mono, 'JetBrains Mono'), monospace;
  font-size: 9px;
  color: #5E6673;
  letter-spacing: .15em;
  text-align: center;
  margin-bottom: 14px;
  text-transform: uppercase;
}

/* Row */
.sv5-pj-row {
  display: grid;
  grid-template-columns: 44px 1fr auto auto;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px dashed rgba(132,142,156,.18);
}
.sv5-pj-row:last-of-type { border-bottom: none; }
.sv5-pj-row-num {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(var(--pj-rgb,132,142,156),.18);
  color: var(--pj-c, #848E9C);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 18px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.sv5-pj-row-body { min-width: 0; }
.sv5-pj-row-name {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -.005em;
  line-height: 1.2;
}
.sv5-pj-row-desc {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #848E9C;
  line-height: 1.4;
  margin-top: 2px;
}
.sv5-pj-row-time {
  font-family: var(--font-mono, 'JetBrains Mono'), monospace;
  font-size: 18px;
  font-weight: 900;
  color: var(--pj-c, #EAECEF);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.sv5-pj-row-game .sv5-pj-row-time {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 13px;
  font-weight: 800;
}
.sv5-pj-row-pill {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 9px;
  font-weight: 800;
  padding: 4px 9px;
  background: rgba(var(--pj-rgb,132,142,156),.12);
  color: var(--pj-c, #EAECEF);
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: .05em;
  white-space: nowrap;
}

/* Total */
.sv5-pj-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding-top: 14px;
  margin-top: 6px;
  border-top: 1px solid rgba(132,142,156,.2);
}
.sv5-pj-total-l { min-width: 0; }
.sv5-pj-total-lbl {
  display: block;
  font-family: var(--font-mono, 'JetBrains Mono'), monospace;
  font-size: 10px;
  color: #848E9C;
  letter-spacing: .1em;
  font-weight: 700;
}
.sv5-pj-total-note {
  display: block;
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 10px;
  color: #5E6673;
  margin-top: 2px;
}
.sv5-pj-total-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 22px;
  font-weight: 900;
  color: #F0B90B;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Safety recommendation */
.sv5-pj-safe {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px 18px;
  background: rgba(56,97,251,.06);
  border: 1px solid rgba(56,97,251,.2);
  border-radius: 10px;
  margin-top: 14px;
}
.sv5-pj-safe-ico {
  width: 38px; height: 38px;
  flex-shrink: 0;
  border-radius: 10px;
  background: rgba(56,97,251,.18);
  color: #3861FB;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-pj-safe-body { flex: 1; min-width: 0; }
.sv5-pj-safe-h {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 13px;
  font-weight: 800;
  color: #EAECEF;
  margin-bottom: 4px;
}
.sv5-pj-safe-t {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #B7BDC6;
  line-height: 1.55;
}
.sv5-pj-safe-t strong {
  color: #3861FB;
  font-weight: 800;
}
.sv5-pj-safe-tiers {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}
.sv5-pj-safe-tier {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 10px;
  color: #B7BDC6;
  padding: 4px 10px;
  background: rgba(255,255,255,.04);
  border-radius: 999px;
  font-weight: 700;
}
.sv5-pj-safe-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
}
.sv5-pj-safe-dot-g { background: #0ECB81; }
.sv5-pj-safe-dot-a { background: #F0B90B; }
.sv5-pj-safe-dot-r { background: #F6465D; }

/* Mobile */
@media (max-width: 768px) {
  .sv5-pj-board { padding: 16px 14px; }
  .sv5-pj-board-hd {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding-bottom: 12px;
    margin-bottom: 14px;
  }
  .sv5-pj-board-h { font-size: 13px; }
  .sv5-pj-board-h svg { width: 13px; height: 13px; }
  .sv5-pj-board-sub { font-size: 10px; }
  .sv5-pj-board-chk { font-size: 9px; align-self: flex-end; margin-top: -22px; }

  .sv5-pj-receipt { padding: 14px; border-radius: 10px; }
  .sv5-pj-receipt-tag { font-size: 8px; letter-spacing: .12em; margin-bottom: 10px; }

  .sv5-pj-row {
    grid-template-columns: 28px 1fr auto;
    gap: 10px;
    padding: 9px 0;
  }
  .sv5-pj-row-num {
    width: 28px; height: 28px;
    font-size: 13px;
  }
  .sv5-pj-row-name { font-size: 12px; }
  .sv5-pj-row-desc { font-size: 9px; }
  .sv5-pj-row-time { font-size: 13px; }
  .sv5-pj-row-game .sv5-pj-row-time { font-size: 10px; }
  .sv5-pj-row-pill { display: none; }

  .sv5-pj-total {
    padding-top: 10px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .sv5-pj-total-l { width: 100%; }
  .sv5-pj-total-lbl { font-size: 9px; }
  .sv5-pj-total-note { font-size: 9px; }
  .sv5-pj-total-v { font-size: 18px; align-self: flex-end; margin-top: -22px; }

  .sv5-pj-safe {
    padding: 12px;
    gap: 10px;
    margin-top: 10px;
  }
  .sv5-pj-safe-ico { width: 30px; height: 30px; border-radius: 8px; }
  .sv5-pj-safe-ico svg { width: 16px; height: 16px; }
  .sv5-pj-safe-h { font-size: 12px; }
  .sv5-pj-safe-t { font-size: 10px; }
  .sv5-pj-safe-tiers { gap: 4px; margin-top: 6px; }
  .sv5-pj-safe-tier { font-size: 9px; padding: 3px 7px; gap: 4px; }
  .sv5-pj-safe-dot { width: 5px; height: 5px; }
}

/* Legacy PJ classes (kept hidden for backwards-compat) */
.sv5-pj-grid,
.sv5-pj-card,
.sv5-pj-num,
.sv5-pj-ico,
.sv5-pj-name,
.sv5-pj-time,
.sv5-pj-desc,
.sv5-pj-pill,
.sv5-pj-active { display: none; }

/* ═══ 5. COMPETITIVE POSITION ════════════════════════════════════ */
.sv5-cp-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sv5-cp-row {
  display: grid;
  grid-template-columns: 80px 1fr 70px;
  align-items: center;
  gap: 16px;
}
.sv5-cp-lbl {
  font-size: 13px;
  color: var(--sv5-t2, #B7BDC6);
  font-weight: 500;
}
.sv5-cp-track {
  position: relative;
  height: 4px;
}
.sv5-cp-track-bg {
  position: absolute;
  inset: 0;
  background: var(--sv5-bg-3, #2B2F36);
  border-radius: 2px;
}
.sv5-cp-track-dot {
  position: absolute;
  top: 50%;
  width: 14px; height: 14px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 2px solid var(--sv5-bg-1, #181A20);
  transition: left 0.6s ease-out;
}
.sv5-cp-dot-g { background: var(--sv5-green, #0ECB81); box-shadow: 0 0 12px rgba(14, 203, 129, 0.4); }
.sv5-cp-dot-a { background: var(--sv5-amber, #F0B90B); box-shadow: 0 0 10px rgba(240, 185, 11, 0.35); }
.sv5-cp-dot-n { background: var(--sv5-t3, #848E9C); }
.sv5-cp-pos {
  display: flex;
  align-items: baseline;
  gap: 2px;
  justify-content: flex-end;
  font-variant-numeric: tabular-nums;
}
.sv5-cp-num {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.015em;
}
.sv5-cp-max {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
}
.sv5-cp-pos-g .sv5-cp-num { color: var(--sv5-green, #0ECB81); }
.sv5-cp-pos-a .sv5-cp-num { color: var(--sv5-amber, #F0B90B); }
.sv5-cp-pos-n .sv5-cp-num { color: var(--sv5-t2, #B7BDC6); }

/* ═══ 6. VS AVERAGE ═════════════════════════════════════════════ */
.sv5-vm-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.sv5-vm-row {
  display: grid;
  grid-template-columns: 110px 1fr 60px 100px;
  align-items: center;
  gap: 14px;
}
@media (max-width: 720px) {
  .sv5-vm-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}
.sv5-vm-lbl {
  font-size: 13px;
  color: var(--sv5-t2, #B7BDC6);
  font-weight: 500;
}
.sv5-vm-bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sv5-vm-bar-block {
  display: grid;
  grid-template-columns: 70px 1fr;
  align-items: center;
  gap: 10px;
}
.sv5-vm-key {
  font-size: 11px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
}
.sv5-vm-key-mine {
  color: var(--sv5-amber, #F0B90B);
  font-weight: 600;
}
.sv5-vm-bar-wrap {
  height: 8px;
  background: var(--sv5-bg-3, #2B2F36);
  border-radius: 4px;
  overflow: hidden;
}
.sv5-vm-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.8s ease-out;
}
.sv5-vm-fill-g { background: var(--sv5-green, #0ECB81); }
.sv5-vm-fill-a { background: var(--sv5-amber, #F0B90B); }
.sv5-vm-fill-n { background: var(--sv5-t4, #5E6673); }
.sv5-vm-vals {
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.sv5-vm-val-mine {
  font-size: 14px;
  font-weight: 800;
  color: var(--sv5-t1, #EAECEF);
  letter-spacing: -0.01em;
  line-height: 1;
}
.sv5-vm-val-avg {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  line-height: 1;
}
.sv5-vm-delta {
  background: rgba(14, 203, 129, 0.12);
  color: var(--sv5-green, #0ECB81);
  padding: 10px 12px;
  border-radius: var(--sv5-r, 8px);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
}
.sv5-vm-delta-bad {
  background: rgba(246, 70, 93, 0.12);
  color: var(--sv5-red, #F6465D);
}
@media (max-width: 720px) {
  .sv5-vm-bar-block { grid-template-columns: 60px 1fr; }
  .sv5-vm-vals { flex-direction: row; justify-content: space-between; }
}

/* ═══════════════════════════════════════════════════════════════════════
 *  REVIEWS DASHBOARD (V4 extended)
 *  Category bars + Radar + Monthly chart + Pros/Cons + 4 Metrics
 * ═══════════════════════════════════════════════════════════════════════ */
.sv5-rd {
  font-family: var(--font);
  color: var(--sv5-t1, #EAECEF);
}
.sv5-rd-card {
  background: var(--sv5-bg-2, #1E2329);
  border: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  border-radius: 12px;
  padding: 18px 20px;
}
.sv5-rd-ct {
  font-size: 11px;
  font-weight: 700;
  color: var(--sv5-t3, #848E9C);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 14px;
}

/* ROW 1: 5-seg bars + radar */
.sv5-rd-row1 {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 12px;
  margin-bottom: 12px;
}
@media (max-width: 900px) {
  .sv5-rd-row1 { grid-template-columns: 1fr; }
}

/* 5-segment category bars — proportional fill */
.sv5-rd-segs-row {
  display: grid;
  grid-template-columns: 90px 1fr 40px;
  gap: 12px;
  align-items: center;
  padding: 8px 0;
  font-size: 13px;
}
.sv5-rd-segs-lbl {
  color: var(--sv5-t2, #B7BDC6);
}
.sv5-rd-segs {
  display: flex;
  gap: 3px;
  height: 16px;
}
.sv5-rd-seg {
  flex: 1;
  border-radius: 3px;
  background: var(--sv5-bg-3, #2B2F36);
  overflow: hidden;
  position: relative;
}
.sv5-rd-seg-fill {
  position: absolute;
  inset: 0;
  border-radius: 3px;
  width: 0;
  transition: width 0.6s ease-out;
}
.sv5-rd-seg-on-g { background: var(--sv5-green, #0ECB81); }
.sv5-rd-seg-on-a { background: var(--sv5-amber, #F0B90B); }
.sv5-rd-seg-on-r { background: var(--sv5-red, #F6465D); }
.sv5-rd-segs-score {
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: 14px;
}

/* Radar card — canvas wrapper */
.sv5-rd-radar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 14px 16px;
}
.sv5-rd-radar-wrap {
  position: relative;
  width: 100%;
  height: 280px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-rd-radar-wrap canvas {
  max-width: 100% !important;
  max-height: 100% !important;
}

/* ROW 2: Monthly chart */
.sv5-rd-monthly {
  margin-bottom: 12px;
}
.sv5-rd-mh {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 14px;
  gap: 12px;
  flex-wrap: wrap;
}
.sv5-rd-ms {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
}
.sv5-rd-ms strong {
  color: var(--sv5-t1, #EAECEF);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sv5-rd-chart-wrap {
  position: relative;
  height: 200px;
  width: 100%;
}
.sv5-rd-chart-wrap canvas {
  max-width: 100% !important;
}
.sv5-rd-months {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  margin-top: 8px;
  font-size: 11px;
  color: var(--sv5-t3, #848E9C);
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* ROW 3: Pros & Cons */
.sv5-rd-row3 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
@media (max-width: 640px) {
  .sv5-rd-row3 { grid-template-columns: 1fr; }
}
.sv5-rd-pc-h {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 14px;
}
.sv5-rd-pc-sub {
  font-size: 11px;
  color: var(--sv5-t3, #848E9C);
  font-weight: 500;
  margin-left: 2px;
}
.sv5-rd-pc-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
}
.sv5-rd-pc-tag {
  color: var(--sv5-t1, #EAECEF);
}
.sv5-rd-pc-num {
  font-size: 12px;
  color: var(--sv5-t3, #848E9C);
  font-variant-numeric: tabular-nums;
}
.sv5-rd-pc-bar {
  grid-column: 1/-1;
  height: 4px;
  background: var(--sv5-bg-3, #2B2F36);
  border-radius: 2px;
  overflow: hidden;
  margin-top: 2px;
}
.sv5-rd-pc-fill-g {
  height: 100%;
  background: var(--sv5-green, #0ECB81);
  transition: width 0.6s ease-out;
}
.sv5-rd-pc-fill-r {
  height: 100%;
  background: var(--sv5-red, #F6465D);
  transition: width 0.6s ease-out;
}
.sv5-rd-empty {
  font-size: 12px;
  color: var(--sv5-t4, #5E6673);
  padding: 12px 0;
  text-align: center;
}

/* ROW 4: 4 Metrics */
.sv5-rd-row4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 640px) {
  .sv5-rd-row4 { grid-template-columns: repeat(2, 1fr); }
}
.sv5-rd-metric {
  background: var(--sv5-bg-2, #1E2329);
  border: 1px solid var(--sv5-line, rgba(255, 255, 255, 0.06));
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.sv5-rd-mi {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-rd-mv {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.015em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.sv5-rd-ml {
  font-size: 11px;
  color: var(--sv5-t3, #848E9C);
  margin-top: 2px;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  REVIEW CARDS · V1 FEATURED + V2 REGULAR
 *  Opt 1 (badges), 2 (trust), 3 (sparkline), 5 (compare),
 *  6 (games), 7 (attachments), 8 (reply), 9 (edited), 10 (helpful ratio)
 * ═══════════════════════════════════════════════════════════════════════ */

/* Hide legacy rv-* classes when using new sv5-rev-* */
body.single-casino .rv { display: none; }

/* Shared */
.sv5-rev-v1, .sv5-rev-v2 {
  font-family: var(--font);
  color: #EAECEF;
  margin-bottom: 16px;
}
.sv5-rev-av {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 14px; color: #FFFFFF;
  background: linear-gradient(135deg, #F0B90B, #C78900);
  flex-shrink: 0; overflow: hidden;
}
.sv5-rev-av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.sv5-rev-av-lg { width: 56px; height: 56px; font-size: 18px; }
.sv5-rev-name { font-size: 15px; font-weight: 700; color: #F0B90B; }
.sv5-rev-name-center { text-align: center; margin-top: 4px; }
.sv5-rev-verif {
  background: rgba(14,203,129,.15); color: #0ECB81;
  font-size: 11px; font-weight: 600; padding: 3px 8px;
  border-radius: 99px; display: inline-flex; align-items: center; gap: 4px;
  white-space: nowrap;
}
.sv5-rev-verdict {
  font-size: 11px; font-weight: 700;
  padding: 3px 10px; border-radius: 99px; display: inline-block;
}
.sv5-rev-verdict-g { background: rgba(14,203,129,.12); color: #0ECB81; }
.sv5-rev-verdict-a { background: rgba(240,185,11,.12); color: #F0B90B; }
.sv5-rev-verdict-r { background: rgba(246,70,93,.12); color: #F6465D; }

/* Opt 1: Author badges */
.sv5-rev-badges-row {
  display: flex; flex-wrap: wrap; gap: 4px;
  justify-content: center; margin-top: 8px;
}
.sv5-rev-badge {
  font-size: 10px; padding: 2px 7px; border-radius: 4px;
  font-weight: 600; display: inline-flex; align-items: center; gap: 3px;
  white-space: nowrap;
}
.sv5-rev-badge svg { width: 9px; height: 9px; }
.bd-gold {
  background: linear-gradient(135deg, rgba(240,185,11,.15), rgba(240,185,11,.05));
  color: #F0B90B; border: 1px solid rgba(240,185,11,.2);
}
.bd-green { background: rgba(14,203,129,.12); color: #0ECB81; }
.bd-blue { background: rgba(56,97,251,.12); color: #3861FB; }
.bd-purple { background: rgba(108,92,231,.15); color: #6C5CE7; }
/* Player level badges (v1.6.7) */
.bd-bronze { background: rgba(132,142,156,.1); color: #848E9C; border: 1px solid rgba(132,142,156,.2); }
.bd-silver { background: rgba(183,189,198,.1); color: #B7BDC6; border: 1px solid rgba(183,189,198,.2); }
.bd-platinum {
  background: linear-gradient(135deg, rgba(108,92,231,.15), rgba(108,92,231,.05));
  color: #6C5CE7; border: 1px solid rgba(108,92,231,.25);
}
.bd-diamond {
  background: linear-gradient(135deg, rgba(56,97,251,.15), rgba(56,97,251,.05));
  color: #3861FB; border: 1px solid rgba(56,97,251,.25);
}
/* Registration date badge (neutral, inline) */
.bd-regdate {
  background: transparent;
  color: #848E9C;
  border: 1px solid rgba(255,255,255,.08);
}

/* Opt 2: Trust score */
.sv5-rev-trust {
  padding: 10px 12px; background: rgba(14,203,129,.06);
  border: 1px solid rgba(14,203,129,.15);
  border-radius: 8px; font-size: 11px;
}
.sv5-rev-trust-l { color: #848E9C; margin-bottom: 4px; }
.sv5-rev-trust-body { display: flex; flex-direction: column; gap: 2px; }
.sv5-rev-trust-v {
  color: #0ECB81; font-size: 18px; font-weight: 800;
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
}
.sv5-rev-trust-v small { font-size: 11px; color: #848E9C; font-weight: 500; }
.sv5-rev-trust-d { font-size: 10px; color: #848E9C; }
.sv5-rev-trust-inline {
  color: #0ECB81 !important; display: inline-flex; align-items: center; gap: 4px;
}
.sv5-rev-trust-inline strong { color: #0ECB81; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Opt 3: Sparkline */
.sv5-rev-sparkline { align-items: center; }
.sv5-rev-sparkline svg { flex-shrink: 0; }

/* Opt 5: Compare to average */
.sv5-rev-compare {
  padding: 10px 14px; background: #1E2329; border-radius: 8px;
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.sv5-rev-compare-l { font-size: 12px; color: #848E9C; white-space: nowrap; }
.sv5-rev-compare-l strong { color: #EAECEF; font-weight: 700; }
.sv5-rev-compare-bar {
  flex: 1; height: 6px; background: #2B2F36; border-radius: 3px;
  position: relative; overflow: visible;
}
.sv5-rev-compare-avg {
  position: absolute; top: -4px; bottom: -4px; width: 2px;
  background: #848E9C; border-radius: 1px;
}
.sv5-rev-compare-mine {
  position: absolute; top: -4px; bottom: -4px; width: 3px;
  background: #F6465D; border-radius: 1px;
  transform: translateX(-1px);
}
.sv5-rev-compare-delta {
  font-size: 12px; font-weight: 700;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}

/* Categories grid */
.sv5-rev-cats-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
}
@media (max-width: 640px) {
  .sv5-rev-cats-grid { grid-template-columns: repeat(2, 1fr); }
}
.sv5-rev-cat {
  padding: 10px 12px; background: #1E2329; border-radius: 8px; text-align: center;
}
.sv5-rev-cat-l {
  font-size: 10px; color: #848E9C; margin-bottom: 4px;
  text-transform: uppercase; letter-spacing: 0.05em;
}
.sv5-rev-cat-s {
  font-size: 20px; font-weight: 800;
  font-variant-numeric: tabular-nums; letter-spacing: -0.025em;
  line-height: 1; margin-bottom: 6px;
}
.sv5-rev-cat-bar {
  height: 3px; border-radius: 2px; background: #2B2F36; overflow: hidden;
}
.sv5-rev-cat-bar-fill { height: 100%; transition: width 0.5s ease-out; }

/* Text */
.sv5-rev-txt {
  font-size: 14px; line-height: 1.6; color: #EAECEF; margin: 0;
}

/* Opt 6: Games played */
.sv5-rev-games {
  padding: 10px 12px; background: #1E2329; border-radius: 8px;
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 12px;
}
.sv5-rev-games-l {
  color: #848E9C; display: inline-flex; align-items: center; gap: 5px;
  white-space: nowrap;
}

/* Opt 7: Screenshots */
.sv5-rev-attach-wrap {
  display: flex; gap: 10px; align-items: center;
}
.sv5-rev-attach-l { font-size: 12px; color: #848E9C; }
.sv5-rev-attachments { display: flex; gap: 6px; flex-wrap: wrap; }
.sv5-rev-att {
  width: 60px; height: 60px; border-radius: 6px; background: #2B2F36;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; overflow: hidden; position: relative;
  text-decoration: none; color: #848E9C;
  transition: transform 0.2s, border-color 0.2s;
  border: 1px solid rgba(255,255,255,.05);
}
.sv5-rev-att:hover { transform: scale(1.05); border-color: rgba(240,185,11,.3); }
.sv5-rev-att img { width: 100%; height: 100%; object-fit: cover; }
.sv5-rev-att-more {
  background: rgba(240,185,11,.1); color: #F0B90B;
  font-weight: 700; font-size: 13px;
}

/* Chips */
.sv5-rev-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 10px; border-radius: 99px;
  font-size: 11px; font-weight: 500;
  background: #2B2F36; color: #B7BDC6; white-space: nowrap;
}
.sv5-rev-chip-g { background: rgba(14,203,129,.12); color: #0ECB81; }
.sv5-rev-chip-r { background: rgba(246,70,93,.12); color: #F6465D; }
.sv5-rev-chip-a { background: rgba(240,185,11,.12); color: #F0B90B; }

/* Tags block */
.sv5-rev-tags-block {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  padding: 12px 14px; background: #1E2329; border-radius: 8px;
}
@media (max-width: 640px) {
  .sv5-rev-tags-block { grid-template-columns: 1fr; }
}
.sv5-rev-tag-group { display: flex; flex-direction: column; gap: 8px; }
.sv5-rev-tag-title {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  display: flex; align-items: center; gap: 6px;
}
.sv5-rev-tag-list { display: flex; flex-wrap: wrap; gap: 5px; }

/* Opt 8: Casino reply */
.sv5-rev-reply {
  padding: 12px 14px; background: #1E2329;
  border-left: 2px solid #F0B90B;
  border-radius: 0 8px 8px 0;
  margin-top: 4px;
}
.sv5-rev-reply-h {
  display: flex; align-items: center; gap: 8px; margin-bottom: 8px;
  font-size: 12px; flex-wrap: wrap;
}
.sv5-rev-reply-av {
  width: 22px; height: 22px; border-radius: 50%;
  background: #F0B90B; color: #0B0E11;
  font-size: 10px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.sv5-rev-reply-name { color: #F0B90B; font-weight: 700; }
.sv5-rev-reply-time {
  color: #848E9C; font-size: 11px;
  margin-left: auto; white-space: nowrap;
}
.sv5-rev-reply-time strong {
  color: #0ECB81; font-weight: 700; font-variant-numeric: tabular-nums;
}
.sv5-rev-reply-txt {
  font-size: 13px; line-height: 1.5; color: #B7BDC6;
}

/* Footer */
.sv5-rev-foot {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12px; color: #848E9C;
  padding-top: 12px; border-top: 1px solid rgba(255,255,255,.06);
  gap: 10px; flex-wrap: wrap;
}
.sv5-rev-foot-l { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.sv5-rev-foot-l span {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; color: #848E9C;
}
.sv5-rev-foot-actions {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
}

/* Opt 9: Edited indicator */
.sv5-rev-edited {
  color: #848E9C; display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px !important; font-style: italic;
}

/* Opt 10: Helpful ratio */
.sv5-rev-helpful-ratio {
  font-size: 11px; color: #848E9C;
  padding-right: 6px; border-right: 1px solid rgba(255,255,255,.1);
  margin-right: 4px;
}
.sv5-rev-helpful-ratio strong {
  color: #0ECB81; font-weight: 700; font-variant-numeric: tabular-nums;
}

/* Vote buttons */
.sv5-rev-btn {
  background: transparent;
  border: 1px solid rgba(255,255,255,.1); color: #B7BDC6;
  padding: 5px 10px; border-radius: 6px;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-family: inherit; font-weight: 500;
  transition: background 0.15s, border-color 0.15s, color 0.15s, opacity 0.15s;
}
.sv5-rev-btn:hover { background: #2B2F36; }
.sv5-rev-btn:hover[data-type="like"]    { border-color: rgba(14,203,129,.4); color: #0ECB81; }
.sv5-rev-btn:hover[data-type="dislike"] { border-color: rgba(246,70,93,.4);  color: #F6465D; }

/* Active state — type-specific colors */
.sv5-rev-btn.sv5-rev-btn-on[data-type="like"] {
  background: rgba(14,203,129,.12);
  border-color: #0ECB81;
  color: #0ECB81;
}
.sv5-rev-btn.sv5-rev-btn-on[data-type="dislike"] {
  background: rgba(246,70,93,.12);
  border-color: #F6465D;
  color: #F6465D;
}

/* Voted but not chosen — dimmed */
.sv5-rev-btn.sv5-rev-btn-off {
  opacity: 0.45;
  pointer-events: none;
}
.sv5-rev-btn span { font-variant-numeric: tabular-nums; font-weight: 600; }

/* ═══ V1 FEATURED CARD ═══ */
.sv5-rev-v1 {
  background: #181A20;
  border: 1px solid rgba(240,185,11,.25);
  border-radius: 16px; padding: 28px;
  position: relative;
  display: flex; flex-direction: column; gap: 14px;
  background: linear-gradient(180deg, rgba(240,185,11,.04) 0%, transparent 100%), #181A20;
}
.sv5-rev-v1-badge {
  position: absolute; top: -10px; left: 28px;
  background: #F0B90B; color: #0B0E11;
  font-size: 10px; font-weight: 800;
  padding: 4px 10px; border-radius: 99px;
  letter-spacing: 0.06em; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 4px;
}
.sv5-rev-v1-top {
  display: grid; grid-template-columns: auto 1fr auto;
  gap: 18px; align-items: center;
}
.sv5-rev-v1 .sv5-rev-av { width: 56px; height: 56px; font-size: 18px; }
.sv5-rev-meta-wrap {
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.sv5-rev-name-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.sv5-rev-v1 .sv5-rev-name { font-size: 17px; }
.sv5-rev-meta {
  display: flex; gap: 12px; font-size: 12px; color: #848E9C; flex-wrap: wrap;
}
.sv5-rev-meta span {
  display: inline-flex; align-items: center; gap: 5px;
}
.sv5-rev-score-wrap {
  text-align: right;
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
}
.sv5-rev-score-big {
  font-size: 40px; font-weight: 900; line-height: 1;
  letter-spacing: -0.03em; font-variant-numeric: tabular-nums;
}

/* ═══ V2 REGULAR CARD (horizontal header) ═══ */
.sv5-rev-v2 {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Horizontal top: avatar + name-col + sparkline + score */
.sv5-rev-v2-top {
  display: grid;
  grid-template-columns: 36px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
@media (max-width: 640px) {
  .sv5-rev-v2-top {
    grid-template-columns: 36px 1fr auto;
  }
  .sv5-rev-v2-sparkline {
    display: none;
  }
}

.sv5-rev-v2 .sv5-rev-av {
  width: 36px; height: 36px; font-size: 12px;
}

.sv5-rev-v2-name-col {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.sv5-rev-v2-name-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-rev-v2 .sv5-rev-name {
  font-size: 14px;
}
.sv5-rev-v2-stats-row {
  display: flex;
  gap: 12px;
  font-size: 11px;
  color: #848E9C;
  flex-wrap: wrap;
}
.sv5-rev-v2-stats-row span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.sv5-rev-v2-stats-row svg { color: currentColor; }
.sv5-rev-v2-stats-row strong {
  color: #EAECEF;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.sv5-rev-v2-trust-inline {
  color: #0ECB81 !important;
}
.sv5-rev-v2-trust-inline strong {
  color: #0ECB81 !important;
}

.sv5-rev-v2-sparkline {
  flex-shrink: 0;
}

.sv5-rev-v2-score-cluster {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
.sv5-rev-v2-score-big {
  font-size: 26px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}

/* Games block — purple accent (different from amber reply / green pros / red cons) */
.sv5-rev-games {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  padding: 8px 12px;
  background: rgba(108,92,231,0.06);
  border: 1px solid rgba(108,92,231,0.15);
  border-radius: 8px;
  font-size: 12px;
}
.sv5-rev-games-l {
  color: #6C5CE7;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.sv5-rev-games-l svg { color: currentColor; }

/* ═══════════════════════════════════════════════════════════════════════
 *  PLAYER PROFILE POPUP (v1.6.8)
 * ═══════════════════════════════════════════════════════════════════════ */

.sv5-rev-av-clickable,
.sv5-rev-name-clickable {
  cursor: pointer;
  transition: opacity 0.15s, transform 0.15s;
}
.sv5-rev-av-clickable:hover { transform: scale(1.05); }
.sv5-rev-name-clickable:hover { opacity: 0.8; text-decoration: underline; text-underline-offset: 2px; }

.sv-pp {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font);
  padding: 20px;
  box-sizing: border-box;
}
.sv-pp-backdrop {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  cursor: pointer;
}
.sv-pp-dialog {
  position: relative;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  width: 100%;
  max-width: 680px;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  color: #EAECEF;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  animation: sv-pp-in 0.2s ease-out;
}
@keyframes sv-pp-in {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.sv-pp-dialog::-webkit-scrollbar { width: 8px; }
.sv-pp-dialog::-webkit-scrollbar-track { background: #0B0E11; }
.sv-pp-dialog::-webkit-scrollbar-thumb { background: #2B2F36; border-radius: 4px; }

.sv-pp-close {
  position: absolute; top: 16px; right: 16px;
  background: #2B2F36;
  border: 1px solid rgba(255,255,255,.08);
  color: #848E9C;
  width: 32px; height: 32px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  z-index: 10;
}
.sv-pp-close:hover {
  background: #474D57;
  color: #EAECEF;
}

.sv-pp-body {
  padding: 28px 24px 20px;
}

.sv-pp-loader,
.sv-pp-error,
.sv-pp-empty {
  text-align: center;
  padding: 40px 20px;
  color: #848E9C;
  font-size: 14px;
}
.sv-pp-error { color: #F6465D; }

/* Hero section */
.sv-pp-hero {
  display: flex;
  gap: 16px;
  align-items: center;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.sv-pp-av {
  width: 72px; height: 72px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 700;
  color: #FFFFFF;
  flex-shrink: 0;
  border: 3px solid rgba(255,255,255,.08);
}
.sv-pp-hero-info {
  flex: 1;
  min-width: 0;
}
.sv-pp-name {
  font-size: 22px;
  font-weight: 800;
  color: #F0B90B;
  margin: 0 0 8px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.sv-pp-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sv-pp-tag {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 99px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.sv-pp-tag-muted {
  color: #848E9C;
  background: transparent;
  border-color: rgba(255,255,255,.08);
}

/* Stats grid */
.sv-pp-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 24px;
}
@media (max-width: 480px) {
  .sv-pp-stats { grid-template-columns: repeat(2, 1fr); }
}
.sv-pp-stat {
  background: #1E2329;
  border-radius: 8px;
  padding: 12px 10px;
  text-align: center;
}
.sv-pp-stat-v {
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  color: #EAECEF;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  margin-bottom: 4px;
}
.sv-pp-stat-l {
  font-size: 10px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Section title */
.sv-pp-section-t {
  font-size: 13px;
  font-weight: 700;
  color: #F0B90B;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

/* Reviews list inside popup */
.sv-pp-reviews {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sv-pp-rev {
  background: #1E2329;
  border-radius: 8px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.04);
}
.sv-pp-rev-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.sv-pp-rev-casino {
  font-size: 14px;
  font-weight: 700;
  color: #F0B90B;
  text-decoration: none;
  transition: opacity 0.15s;
}
.sv-pp-rev-casino:hover { opacity: 0.8; text-decoration: underline; }
.sv-pp-rev-score {
  font-size: 16px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  flex-shrink: 0;
}
.sv-pp-rev-txt {
  font-size: 13px;
  line-height: 1.5;
  color: #B7BDC6;
  margin-bottom: 8px;
}
.sv-pp-rev-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  color: #848E9C;
}
.sv-pp-rev-votes {
  font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  REVIEWS GRID · Макет 1 Мінімалістичний (v1.6.10)
 *  Categories + Security Index + Casino Temperature
 * ═══════════════════════════════════════════════════════════════════════ */

.sv5-rgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 20px 0;
}
@media (max-width: 900px) {
  .sv5-rgrid { grid-template-columns: 1fr; }
}

.sv5-rgc {
  background: linear-gradient(180deg, #1a1d24 0%, #181A20 100%);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  font-family: var(--font);
}
.sv5-rgc::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,185,11,.25), transparent);
}
.sv5-rgc-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 14px;
  margin-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.sv5-rgc-t {
  font-size: 11px;
  font-weight: 700;
  color: #EAECEF;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  display: flex;
  align-items: center;
  gap: 8px;
}
.sv5-rgc-t svg { color: #F0B90B; flex-shrink: 0; }
.sv5-rgc-s {
  font-size: 10px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
}

/* ═══ CARD 1: Categories ═══ */
.sv5-rgc-rows {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
}
.sv5-rgc-row {
  display: grid;
  grid-template-columns: 90px 1fr 54px 50px;
  gap: 10px;
  align-items: center;
}
.sv5-rgc-label {
  font-size: 10px;
  color: #B7BDC6;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sv5-rgc-bar {
  height: 8px;
  background: #1E2329;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
}
.sv5-rgc-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.6s cubic-bezier(.2,.9,.3,1);
}
.sv5-rgc-spark {
  width: 54px;
  height: 18px;
  display: block;
}
.sv5-rgc-score {
  font-size: 14px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1;
  text-align: right;
  white-space: nowrap;
}
.sv5-rgc-trend {
  font-size: 11px;
  font-weight: 700;
  margin-left: 2px;
}
.sv5-rgc-foot {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.06);
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sv5-rgc-foot strong {
  color: #EAECEF;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

/* ═══ CARD 2: Security Index ═══ */
.sv5-rgc-gauge-wrap {
  position: relative;
  padding: 4px 0;
}
.sv5-rgc-gauge {
  width: 100%;
  height: 128px;
  display: block;
}
.sv5-rgc-gauge-center {
  position: absolute;
  left: 50%;
  top: 72%;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
}
.sv5-rgc-gauge-v {
  font-size: 42px;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.sv5-rgc-gauge-v small {
  font-size: 16px;
  color: #848E9C;
  font-weight: 600;
}

.sv5-rgc-sec-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.06);
  flex: 1;
}
.sv5-rgc-sec-row {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 6px 8px;
  background: rgba(255,255,255,.02);
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.04);
}
.sv5-rgc-sec-ico {
  width: 28px; height: 28px;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.sv5-rgc-sec-ico.ok   { background: rgba(14,203,129,.15);  color: #0ECB81; }
.sv5-rgc-sec-ico.warn { background: rgba(240,185,11,.15);  color: #F0B90B; }
.sv5-rgc-sec-ico.fail { background: rgba(246,70,93,.15);   color: #F6465D; }
.sv5-rgc-sec-l {
  font-size: 11px;
  font-weight: 600;
  color: #EAECEF;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.sv5-rgc-sec-l small {
  font-size: 9px;
  color: #848E9C;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sv5-rgc-sec-v {
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ═══ CARD 3: Casino Temperature ═══ */
.sv5-rgc-temp-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 16px;
}
.sv5-rgc-temp-v {
  font-size: 52px;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  display: inline-flex;
  align-items: flex-start;
}
.sv5-rgc-temp-deg {
  font-size: 28px;
  font-weight: 800;
  color: #848E9C;
  margin-left: 2px;
  line-height: 1;
}
.sv5-rgc-temp-label {
  font-size: 9px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 700;
  text-align: right;
  line-height: 1.3;
}

.sv5-rgc-tube-wrap {
  padding: 4px 0;
  margin-bottom: 16px;
}
.sv5-rgc-tube {
  position: relative;
  height: 22px;
  border-radius: 11px;
  background: linear-gradient(90deg, #F6465D 0%, #F0B90B 50%, #0ECB81 100%);
  box-shadow:
    inset 0 2px 4px rgba(0,0,0,.4),
    inset 0 -1px 2px rgba(255,255,255,.15);
}
.sv5-rgc-tube::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 3px;
  right: 3px;
  height: 7px;
  background: linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,0));
  border-radius: 11px 11px 4px 4px;
  pointer-events: none;
}
.sv5-rgc-tube-marker {
  position: absolute;
  top: -6px;
  bottom: -6px;
  width: 6px;
  background: #FFFFFF;
  border-radius: 3px;
  transform: translateX(-50%);
  box-shadow:
    0 0 0 2px #0B0E11,
    0 0 12px rgba(14,203,129,.6),
    0 2px 8px rgba(0,0,0,.4);
  z-index: 1;
}
.sv5-rgc-tube-scale {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 9px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.sv5-rgc-temp-stats {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.sv5-rgc-temp-stat {
  flex: 1;
  text-align: center;
}
.sv5-rgc-temp-stat-v {
  font-size: 20px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1;
  margin-bottom: 4px;
}
.sv5-rgc-temp-stat-l {
  font-size: 9px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

/* ═══ Helper classes ═══ */
.sv5-rgc .c-g { color: #0ECB81 !important; }
.sv5-rgc .c-a { color: #F0B90B !important; }
.sv5-rgc .c-r { color: #F6465D !important; }

/* ═══ Top bar: viewers counter + updated badge (v1.6.11 · 1-row strict) ═══ */
.sv5-up-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
  justify-content: flex-end;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sv5-up-wrap::-webkit-scrollbar { display: none; }
.sv5-up-viewers {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  background: rgba(14,203,129,.08);
  border: 1px solid rgba(14,203,129,.18);
  border-radius: 99px;
  font-size: 12px;
  font-weight: 600;
  color: #0ECB81;
  font-family: var(--font);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  transition: background 0.15s;
}
.sv5-up-viewers:hover { background: rgba(14,203,129,.12); }
.sv5-up-viewers-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #0ECB81;
  box-shadow: 0 0 6px #0ECB81;
  animation: sv5-dot-pulse 2s ease-in-out infinite;
  flex-shrink: 0;
}
.sv5-up-viewers-n { font-weight: 700; }
.sv5-up-viewers-l {
  color: #848E9C;
  font-weight: 500;
}
@keyframes sv5-dot-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .5; transform: scale(.7); }
}

/* ═══════════════════════════════════════════════════════════════════════
 *  HERO GRADIENT BONUS CARD (v1.6.12)
 * ═══════════════════════════════════════════════════════════════════════ */

.sv5-bonus-hero {
  background: linear-gradient(135deg, rgba(240,185,11,.08) 0%, rgba(240,185,11,.02) 50%, rgba(108,92,231,.06) 100%);
  border: 1px solid rgba(240,185,11,.2);
  border-radius: 14px;
  padding: 20px 24px;
  margin-top: 20px;
  margin-bottom: 24px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  font-family: var(--font);
}
.sv5-bonus-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #F0B90B, transparent);
}
.sv5-bonus-hero::after {
  content: '';
  position: absolute;
  top: -40px; right: -40px;
  width: 160px; height: 160px;
  background: radial-gradient(circle, rgba(240,185,11,.15) 0%, transparent 70%);
  pointer-events: none;
}

.sv5-bonus-hero-ico {
  width: 56px; height: 56px;
  border-radius: 14px;
  background: linear-gradient(135deg, #F0B90B, #C78900);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0B0E11;
  flex-shrink: 0;
  box-shadow:
    0 6px 16px rgba(240,185,11,.3),
    inset 0 1px 0 rgba(255,255,255,.3);
  position: relative;
  z-index: 1;
}

.sv5-bonus-hero-center {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  position: relative;
  z-index: 1;
}

.sv5-bonus-hero-label {
  font-size: 10px;
  color: #F0B90B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.sv5-bonus-hero-value {
  font-size: 26px;
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.15;
  color: #EAECEF;
}
.sv5-bonus-hl {
  background: linear-gradient(90deg, #F0B90B, #FCD535);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
}

.sv5-bonus-hero-meta {
  display: flex;
  gap: 10px;
  font-size: 11px;
  color: #848E9C;
  margin-top: 4px;
  flex-wrap: wrap;
  align-items: center;
}
.sv5-bonus-hero-meta span { display: inline-flex; align-items: center; }
.sv5-bonus-hero-meta strong {
  color: #EAECEF;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}
.sv5-bonus-hero-dot { color: #474D57; }

.sv5-bonus-hero-cta {
  background: linear-gradient(180deg, #F0B90B 0%, #C78900 100%);
  color: #0B0E11;
  font-weight: 800;
  border: none;
  padding: 13px 26px;
  border-radius: 10px;
  font-size: 14px;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  text-decoration: none;
  box-shadow:
    0 4px 14px rgba(240,185,11,.25),
    inset 0 1px 0 rgba(255,255,255,.2);
  transition: transform 0.15s, box-shadow 0.15s;
  white-space: nowrap;
  position: relative;
  z-index: 1;
}
.sv5-bonus-hero-cta:hover {
  transform: translateY(-1px);
  box-shadow:
    0 6px 20px rgba(240,185,11,.4),
    inset 0 1px 0 rgba(255,255,255,.2);
  color: #0B0E11;
}

/* Mobile: stack vertically */
@media (max-width: 720px) {
  .sv5-bonus-hero {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 18px 20px;
    text-align: center;
  }
  .sv5-bonus-hero-ico { margin: 0 auto; }
  .sv5-bonus-hero-center { align-items: center; text-align: center; }
  .sv5-bonus-hero-value { font-size: 22px; }
  .sv5-bonus-hero-meta { justify-content: center; }
  .sv5-bonus-hero-cta { width: 100%; justify-content: center; }
}

/* Secondary actions row (Write review + Add to compare) */
.sv5-cta-sec {
  display: flex;
  gap: 10px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.sv5-cta-sec .sv5-bs {
  flex: 1;
  justify-content: center;
}
@media (max-width: 540px) {
  .sv5-cta-sec .sv5-bs { flex: 1 1 100%; }
}

/* ═══════════════════════════════════════════════════════════════════════
 *  Hide duplicate breadcrumbs from SEO plugins (v1.6.13)
 *  Keep ONLY our .sv5-cr breadcrumbs inside .sv5-wrap
 *  Yoast / Rank Math / WP SEO / WooCommerce breadcrumbs all match these selectors
 * ═══════════════════════════════════════════════════════════════════════ */
body.single-casino .yoast-breadcrumbs,
body.single-casino #breadcrumbs,
body.single-casino .breadcrumbs,
body.single-casino .rank-math-breadcrumb,
body.single-casino .woocommerce-breadcrumb,
body.single-casino nav[aria-label="Breadcrumb"]:not(.sv5-cr),
body.single-casino nav[aria-label="breadcrumb"]:not(.sv5-cr),
body.single-casino nav.breadcrumb:not(.sv5-cr) {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  EXPERT RATING V5 TRUST SIGNAL (v1.6.14)
 *  Prefixed .sv5-rc-v5 so old .sv5-rc styles don't clash on unrelated pages
 * ═══════════════════════════════════════════════════════════════════════ */

/* Hide old tags block (stays in DOM for non-v5 pages, but on single-casino V5 overrides) */
.sv5-rc-v5 .sv5-rkl,
.sv5-rc-v5 .sv5-tg { display: none !important; }

/* License highlight block — green trust signal */
.sv5-rc-license {
  padding: 12px 14px;
  background: rgba(14,203,129,.06);
  border: 1px solid rgba(14,203,129,.18);
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  margin-bottom: 10px;
}
.sv5-rc-license-ico {
  width: 34px; height: 34px;
  border-radius: 8px;
  background: rgba(14,203,129,.15);
  color: #0ECB81;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-rc-license-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.sv5-rc-license-l {
  font-size: 9px;
  color: #0ECB81;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}
.sv5-rc-license-v {
  font-size: 13px;
  color: #EAECEF;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.sv5-rc-license-d {
  font-size: 10px;
  color: #848E9C;
}

/* Pills: rank + years */
.sv5-rc-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.sv5-rc-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  font-family: var(--font);
}
.sv5-rc-pill svg { flex-shrink: 0; }
.sv5-rc-pill-amber {
  background: rgba(240,185,11,.12);
  color: #F0B90B;
}
.sv5-rc-pill-neutral {
  background: rgba(255,255,255,.04);
  color: #B7BDC6;
  border: 1px solid rgba(255,255,255,.06);
}
.sv5-rc-pill-green {
  background: rgba(14,203,129,.12);
  color: #0ECB81;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  Casino Temperature · Макет 3 Combined (v1.6.15)
 *  Inverted scale: blue=cold=low, red=hot=top
 * ═══════════════════════════════════════════════════════════════════════ */

.sv5-rgc-temp-big-col {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.sv5-rgc-temp-status {
  font-size: 11px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 99px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.sv5-rgc-segs-row {
  display: flex;
  gap: 3px;
  margin-bottom: 8px;
}
.sv5-rgc-seg {
  flex: 1;
  height: 10px;
  border-radius: 3px;
  background: #1E2329;
  border: 1px solid rgba(255,255,255,.04);
  transition: background 0.4s;
}
.sv5-rgc-seg.on {
  border-color: transparent;
  box-shadow: 0 0 8px currentColor;
}
.sv5-rgc-segs-scale {
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  margin-bottom: 14px;
}

.sv5-rgc-temp-factors {
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.06);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sv5-rgc-temp-factor {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 8px;
  background: rgba(255,255,255,.02);
  border-radius: 6px;
  font-size: 11px;
}
.sv5-rgc-temp-factor span {
  color: #848E9C;
}
.sv5-rgc-temp-factor strong {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #EAECEF;
}

/* ═══════════════════════════════════════════════════════════════════════
 *  EXPERT OVERVIEW · 3 BLOCKS — Binance dark (v1.6.17)
 *  B1-V1 Author+Text+Pros/Cons+Verdict · B2-V4 Accordion · B3-V1 Line+Deltas
 * ═══════════════════════════════════════════════════════════════════════ */

/* ═══════ B1-V1: Expert Review ═══════ */
.sv5-exv1 {
  position: relative;
  background: linear-gradient(180deg, #1a1d24 0%, #181A20 100%);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 22px 24px 18px;
  margin-bottom: 18px;
  font-family: var(--font);
  color: #EAECEF;
}
.sv5-exv1::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,185,11,.25), transparent);
}
.sv5-exv1-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 9px;
  font-weight: 700;
  color: #F0B90B;
  background: rgba(240,185,11,.12);
  border: 1px solid rgba(240,185,11,.2);
  padding: 5px 10px;
  border-radius: 99px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 14px;
}
.sv5-exv1-hd {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.sv5-exv1-av {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0ECB81, #0BA868);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0B0E11;
  font-weight: 800;
  font-size: 16px;
  flex-shrink: 0;
}
.sv5-exv1-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sv5-exv1-name { font-size: 14px; font-weight: 700; color: #EAECEF; }
.sv5-exv1-role { font-size: 11px; color: #848E9C; }
.sv5-exv1-stats {
  display: flex; gap: 8px;
  font-size: 10px; color: #848E9C;
  margin-top: 3px;
  flex-wrap: wrap;
}
.sv5-exv1-sep { color: #474D57; }
.sv5-exv1-score {
  background: #0B0E11;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 70px;
}
.sv5-exv1-score-v {
  font-size: 24px;
  font-weight: 900;
  color: #0ECB81;
  letter-spacing: -0.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.sv5-exv1-score-l {
  font-size: 9px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 4px;
  font-weight: 600;
}
.sv5-exv1-text {
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.6;
  margin-bottom: 14px;
}
.sv5-exv1-pc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}
@media (max-width: 640px) {
  .sv5-exv1-pc { grid-template-columns: 1fr; }
  .sv5-exv1-hd { grid-template-columns: auto 1fr; }
  .sv5-exv1-score { grid-column: 1 / -1; margin-top: 6px; }
}
.sv5-exv1-pc-block {
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.04);
}
.sv5-exv1-pc-t {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.sv5-exv1-pc-pros { color: #0ECB81; }
.sv5-exv1-pc-cons { color: #F0B90B; }
.sv5-exv1-pc-list {
  font-size: 11px;
  color: #B7BDC6;
  line-height: 1.5;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sv5-exv1-pc-list li {
  margin-bottom: 3px;
  padding-left: 12px;
  position: relative;
}
.sv5-exv1-pc-list li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: #474D57;
}
.sv5-exv1-pc-plain {
  font-size: 11px;
  color: #B7BDC6;
  line-height: 1.5;
}
.sv5-exv1-verdict {
  display: flex;
  gap: 10px;
  padding: 12px 14px;
  background: rgba(14,203,129,.06);
  border-left: 3px solid #0ECB81;
  border-radius: 0 8px 8px 0;
  margin-bottom: 6px;
}
.sv5-exv1-verdict-ico {
  color: #0ECB81;
  flex-shrink: 0;
  margin-top: 2px;
}
.sv5-exv1-verdict-body { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.sv5-exv1-verdict-l {
  font-size: 9px; color: #0ECB81; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.08em;
}
.sv5-exv1-verdict-t {
  font-size: 12px; color: #EAECEF; line-height: 1.5;
}
.sv5-exv1-foot {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.04);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10px;
  color: #848E9C;
  gap: 12px;
  flex-wrap: wrap;
}

/* ═══════ B2-V4: 25 Criteria Accordion ═══════ */
.sv5-indv4 {
  position: relative;
  background: linear-gradient(180deg, #1a1d24 0%, #181A20 100%);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 22px 24px;
  margin-bottom: 18px;
  font-family: var(--font);
  color: #EAECEF;
}
.sv5-indv4::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,185,11,.25), transparent);
}
.sv5-indv4-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 14px 18px;
  margin-bottom: 14px;
  background: rgba(14,203,129,.04);
  border: 1px solid rgba(14,203,129,.12);
  border-radius: 10px;
}
@media (max-width: 540px) {
  .sv5-indv4-hero { grid-template-columns: 1fr; text-align: left; }
}
.sv5-indv4-hero-l { display: flex; flex-direction: column; gap: 4px; }
.sv5-indv4-chip {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 9px; font-weight: 700; color: #F0B90B;
  background: rgba(240,185,11,.12);
  padding: 3px 8px; border-radius: 99px;
  text-transform: uppercase; letter-spacing: 0.08em;
  align-self: flex-start;
}
.sv5-indv4-title {
  font-size: 15px; font-weight: 800; color: #EAECEF;
  letter-spacing: -0.01em;
}
.sv5-indv4-sub { font-size: 11px; color: #848E9C; line-height: 1.4; }
.sv5-indv4-hero-r { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.sv5-indv4-big { display: flex; align-items: baseline; gap: 2px; }
.sv5-indv4-big-v {
  font-size: 44px; font-weight: 900; color: #0ECB81;
  letter-spacing: -0.03em; line-height: 1;
  font-variant-numeric: tabular-nums;
}
.sv5-indv4-big-m { font-size: 16px; color: #848E9C; font-weight: 600; }
.sv5-indv4-big-d {
  font-size: 12px; font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.sv5-indv4-acc { display: flex; flex-direction: column; gap: 6px; }
.sv5-indv4-ac-item {
  background: rgba(255,255,255,.02);
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.04);
  overflow: hidden;
  transition: border-color 0.15s;
}
.sv5-indv4-ac-item:hover { border-color: rgba(255,255,255,.08); }
.sv5-indv4-ac-h {
  padding: 12px 14px;
  display: grid;
  grid-template-columns: auto 1fr auto auto auto auto;
  gap: 10px;
  align-items: center;
  cursor: pointer;
  user-select: none;
}
.sv5-indv4-ac-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.sv5-indv4-ac-name {
  font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sv5-indv4-ac-bar {
  width: 80px; height: 5px;
  background: #1E2329; border-radius: 3px;
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
}
.sv5-indv4-ac-bar-fill {
  height: 100%;
  border-radius: 3px;
  box-shadow: 0 0 6px currentColor;
  transition: width 0.4s;
}
.sv5-indv4-ac-v {
  font-size: 15px; font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  min-width: 28px; text-align: right;
}
.sv5-indv4-ac-d {
  font-size: 11px; font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 30px; text-align: right;
}
.sv5-indv4-ac-chev {
  color: #848E9C;
  transition: transform 0.2s;
  flex-shrink: 0;
}
.sv5-indv4-ac-item.open .sv5-indv4-ac-chev {
  transform: rotate(90deg);
  color: #F0B90B;
}
.sv5-indv4-ac-body {
  display: none;
  padding: 10px 14px 12px;
  border-top: 1px solid rgba(255,255,255,.04);
  background: rgba(0,0,0,.1);
}
.sv5-indv4-ac-item.open .sv5-indv4-ac-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}
@media (max-width: 540px) {
  .sv5-indv4-ac-item.open .sv5-indv4-ac-body { grid-template-columns: 1fr; }
  .sv5-indv4-ac-h { grid-template-columns: auto 1fr auto auto; gap: 8px; }
  .sv5-indv4-ac-bar { display: none; }
  .sv5-indv4-ac-d { display: none; }
}
.sv5-indv4-ac-crit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  padding: 6px 10px;
  border-radius: 6px;
  background: rgba(255,255,255,.02);
}
.sv5-indv4-ac-crit-n { color: #B7BDC6; }
.sv5-indv4-ac-crit-v {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  display: inline-flex; align-items: center; gap: 3px;
}
.sv5-indv4-ac-crit-d {
  font-size: 10px;
  margin-left: 2px;
}

/* ═══════ B3-V1: Rating Dynamics · Line + Deltas ═══════ */
.sv5-dynv1 {
  position: relative;
  background: linear-gradient(180deg, #1a1d24 0%, #181A20 100%);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 22px 24px 20px;
  margin-bottom: 18px;
  font-family: var(--font);
  color: #EAECEF;
}
.sv5-dynv1::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,185,11,.25), transparent);
}
.sv5-dynv1-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 10px;
}
.sv5-dynv1-h-l { display: flex; flex-direction: column; gap: 3px; }
.sv5-dynv1-t {
  font-size: 14px; font-weight: 800; color: #EAECEF;
  letter-spacing: -0.01em;
}
.sv5-dynv1-s { font-size: 11px; color: #848E9C; }
.sv5-dynv1-tabs {
  display: flex; gap: 4px;
  padding: 3px;
  background: rgba(255,255,255,.03);
  border-radius: 8px;
}
.sv5-dynv1-tab {
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 10px; font-weight: 700;
  cursor: pointer;
  color: #848E9C;
  text-transform: uppercase; letter-spacing: 0.05em;
  background: transparent;
  border: none;
  font-family: inherit;
  transition: all 0.15s;
}
.sv5-dynv1-tab:hover { color: #EAECEF; }
.sv5-dynv1-tab-on,
.sv5-dynv1-tab.sv-hist-tab--active {
  background: #F0B90B;
  color: #0B0E11 !important;
}
.sv5-dynv1-chart {
  background: rgba(255,255,255,.02);
  border-radius: 10px;
  padding: 16px 14px 10px;
  margin-bottom: 14px;
  border: 1px solid rgba(255,255,255,.04);
}
.sv5-dynv1-chart.sv-hist-hidden { display: none; }
.sv5-dynv1-toggles {
  display: flex; gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 0 4px;
}
.sv5-dynv1-tog {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  font-size: 10px; font-weight: 600;
  color: var(--c, #848E9C);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 99px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
  text-transform: uppercase; letter-spacing: 0.04em;
}
.sv5-dynv1-tog::before {
  content: '';
  width: 8px; height: 2px; border-radius: 1px;
  background: var(--c, #848E9C);
}
.sv5-dynv1-tog:hover { background: rgba(255,255,255,.05); }
.sv5-dynv1-tog-on.sv-hist-tog--active {
  background: color-mix(in srgb, var(--c, #848E9C) 10%, transparent);
  border-color: color-mix(in srgb, var(--c, #848E9C) 30%, transparent);
  color: var(--c, #EAECEF);
}
.sv5-dynv1-chart-canvas {
  position: relative;
  height: 220px;
  padding: 0 4px;
}
.sv5-dynv1-bar-legend {
  display: flex;
  gap: 14px;
  font-size: 11px;
  color: #848E9C;
  padding: 0 4px 10px;
}
.sv5-dynv1-bar-legend span {
  display: flex; align-items: center; gap: 5px;
}
.sv5-dynv1-bar-sq {
  width: 10px; height: 10px;
  border-radius: 2px;
}

.sv5-dynv1-deltas {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
}
@media (max-width: 900px) {
  .sv5-dynv1-deltas { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px) {
  .sv5-dynv1-deltas { grid-template-columns: repeat(2, 1fr); }
}
.sv5-dynv1-delta {
  padding: 10px 8px;
  border-radius: 8px;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.04);
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.sv5-dynv1-delta-total {
  background: rgba(14,203,129,.06);
  border-color: rgba(14,203,129,.18);
}
.sv5-dynv1-delta-l {
  font-size: 9px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}
.sv5-dynv1-delta-v {
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.sv5-dynv1-delta-d {
  font-size: 10px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* ═══ Duo grid: Position among competitors + VS Market (v1.6.19) ═══ */
.sv5-duo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 20px 0;
}
.sv5-duo .sv5-section {
  margin: 0;
  height: 100%;
}
@media (max-width: 900px) {
  .sv5-duo { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   v1.6.36 — Rating breakdown (Expert / Players / Votes)
   under the main score on single-casino hero
═══════════════════════════════════════════════════════════════ */
.sv5-rvr-breakdown {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
  padding: 12px 14px;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.04);
  border-radius: 10px;
  min-width: 160px;
}
.sv5-rvr-b-it {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
}
.sv5-rvr-b-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.sv5-rvr-b-l {
  color: var(--sv5-t3, #848E9C);
  flex: 1;
  font-weight: 500;
}
.sv5-rvr-b-v {
  color: var(--sv5-t1, #EAECEF);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  font-size: 13px;
}
@media (max-width: 720px) {
  .sv5-rvr-breakdown {
    flex-direction: row;
    justify-content: space-between;
    padding: 10px;
  }
  .sv5-rvr-b-it {
    flex-direction: column;
    gap: 2px;
    text-align: center;
    flex: 1;
  }
  .sv5-rvr-b-dot {
    margin-bottom: 2px;
  }
  .sv5-rvr-b-l {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
  }
}

/* ═══════════════════════════════════════════════════════════════
   v1.6.43 — Typography overrides for single-casino
   Unbounded display / Onest body / JetBrains Mono tabular
═══════════════════════════════════════════════════════════════ */
.sv5-rb,
.sv5-cv,
.sv5-sv,
.sv5-ss,
.sv5-sgb,
.sv5-bigscore,
.sv5-score-big,
.sv5-rvr-b-v,
.sv5-h-title,
.sv5-pill-n,
.block-hd h2,
.block-hd h3,
.sv5-cn {
  font-family: var(--font-display);
  letter-spacing: -0.02em;
}

/* Tabular figures for data */
.sv5-rb, .sv5-cv, .sv5-rvr-b-v, .sv5-rm,
.tabnum, [data-tabnum] {
  font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   v1.6.48 — INFO BUTTON + MODAL SYSTEM
═══════════════════════════════════════════════════════ */
.sv5-info-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  margin-left: 8px;
  background: rgba(240,185,11,.08);
  border: 1.5px solid rgba(240,185,11,.35);
  border-radius: 50%;
  color: #F0B90B;
  cursor: pointer;
  transition: all 0.15s ease;
  flex-shrink: 0;
  vertical-align: middle;
  position: relative;
  animation: sv5InfoPulse 2s ease-in-out infinite;
}
@keyframes sv5InfoPulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(240,185,11,.5), 0 0 0 0 rgba(240,185,11,.2);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(240,185,11,0), 0 0 0 8px rgba(240,185,11,0);
    transform: scale(1.05);
  }
}
.sv5-info-btn:hover {
  background: rgba(240,185,11,.2);
  border-color: #F0B90B;
  color: #FCD535;
  transform: scale(1.15);
  animation: none;
  box-shadow: 0 0 0 4px rgba(240,185,11,.15);
}
.sv5-info-btn:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(240,185,11,.4);
}
.sv5-info-btn svg {
  width: 14px;
  height: 14px;
  stroke-width: 2.5;
}
@media (prefers-reduced-motion: reduce) {
  .sv5-info-btn { animation: none; }
}

/* Overlay */
.sv5-info-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.75);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 10000;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 20px;
  overflow-y: auto;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.sv5-info-overlay.open {
  display: flex;
  opacity: 1;
}

/* Modal */
.sv5-info-modal {
  position: relative;
  width: 100%;
  max-width: 600px;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 28px 28px 24px;
  box-shadow: 0 20px 60px rgba(0,0,0,.6), 0 0 0 1px rgba(240,185,11,.15);
  animation: sv5InfoPop 0.25s cubic-bezier(.4,0,.2,1);
}
@keyframes sv5InfoPop {
  from { transform: scale(0.9) translateY(20px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}

.sv5-info-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  padding: 0;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  color: #848E9C;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  z-index: 2;
}
.sv5-info-close:hover {
  background: rgba(246,70,93,.15);
  border-color: rgba(246,70,93,.4);
  color: #F6465D;
}

.sv5-info-hd {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
  padding-right: 52px;
}
.sv5-info-ico {
  width: 44px;
  height: 44px;
  background: rgba(240,185,11,.12);
  border: 1px solid rgba(240,185,11,.3);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #F0B90B;
  flex-shrink: 0;
}
.sv5-info-title {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.25;
  padding-top: 4px;
}

.sv5-info-desc {
  font-family: var(--font);
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.65;
  margin: 0 0 22px;
}

.sv5-info-cur {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 20px;
  background: #1E2329;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  margin-bottom: 22px;
}
.sv5-info-cur-l {
  font-family: var(--font);
  font-size: 11px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.sv5-info-cur-v {
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: 900;
  color: #F0B90B;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1;
}

.sv5-info-scale-h {
  font-family: var(--font);
  font-size: 11px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 700;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.sv5-info-scale {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sv5-info-sr {
  display: grid;
  grid-template-columns: 14px minmax(auto, max-content) 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-radius: 8px;
  transition: all 0.15s;
  border: 1px solid transparent;
  position: relative;
}
.sv5-info-sr:hover {
  background: rgba(255,255,255,.02);
}
.sv5-info-sr.current {
  background: rgba(240,185,11,.08);
  border-color: rgba(240,185,11,.3);
  box-shadow: inset 0 0 0 1px rgba(240,185,11,.08);
}
.sv5-info-sr-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  box-shadow: 0 0 8px currentColor;
  flex-shrink: 0;
}
.sv5-info-sr-r {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: #EAECEF;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sv5-info-sr-l {
  font-family: var(--font);
  font-size: 12px;
  color: #B7BDC6;
  line-height: 1.45;
  min-width: 0;
  overflow-wrap: break-word;
}
.sv5-info-sr-here {
  display: none;
  font-family: var(--font);
  font-size: 10px;
  font-weight: 800;
  color: #0B0E11;
  background: #F0B90B;
  padding: 3px 8px;
  border-radius: 4px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}
.sv5-info-sr.current .sv5-info-sr-here {
  display: inline-block;
}

/* On narrower screens — stack range + label in 2 rows */
@media (max-width: 680px) {
  .sv5-info-sr {
    grid-template-columns: 11px 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 10px;
    padding: 10px 12px;
  }
  .sv5-info-sr-dot {
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: center;
  }
  .sv5-info-sr-r {
    grid-column: 2;
    grid-row: 1;
    font-size: 12px;
  }
  .sv5-info-sr-l {
    grid-column: 2;
    grid-row: 2;
    font-size: 11px;
    color: #848E9C;
    white-space: normal;
  }
  .sv5-info-sr-here {
    grid-column: 3;
    grid-row: 1 / span 2;
    align-self: center;
    font-size: 9px;
    padding: 3px 7px;
  }
}

@media (max-width: 560px) {
  .sv5-info-modal {
    padding: 24px 20px 20px;
    border-radius: 12px;
  }
  .sv5-info-title {
    font-size: 18px;
  }
  .sv5-info-hd {
    padding-right: 44px;
    gap: 10px;
  }
  .sv5-info-ico {
    width: 36px;
    height: 36px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.65 — SINGLE-CASINO · Expert mobile adaptation (all blocks)
   Philosophy: compact, readable, no wasted vertical space
   Breakpoint: 768px (main) + 480px (tightest)
═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ═══ GLOBAL CARD / WRAP PADDING ═══ */
  body.single-casino .content-main { padding: 0 !important; }
  body.single-casino .sv5-wrap { padding: 0 !important; }
  body.single-casino .sv5-card,
  body.single-casino .sv5-section {
    padding: 14px !important;
    margin: 0 12px 12px !important;
    border-radius: 12px !important;
  }
  /* v1.6.93 — Reviews section: tighter padding so individual review cards
     stretch closer to screen edges (user-requested). Only for reviews. */
  body.single-casino #reviews.sv5-section {
    padding: 10px 8px !important;
  }
  body.single-casino .sv5-top {
    padding: 10px 12px !important;
    margin: 0 12px 10px !important;
  }

  /* ═══ 1. TOP BAR (breadcrumb + "50 на сторінці") ═══ */
  .sv5-top { font-size: 11px !important; gap: 8px !important; flex-wrap: wrap !important; }
  .sv5-top-r { flex-wrap: wrap !important; gap: 6px !important; }
  .sv5-top-r > * { font-size: 10px !important; padding: 3px 8px !important; }

  /* ═══ 2. HEADER · logo + name + actions ═══ */
  .sv5-hd {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    grid-template-areas:
      "logo info"
      "actions actions" !important;
    gap: 12px !important;
    align-items: start !important;
  }
  .sv5-lg { grid-area: logo; width: 84px !important; height: 54px !important; border-radius: 10px !important; padding: 4px !important; }
  .sv5-hi { grid-area: info; min-width: 0; }
  .sv5-ac { grid-area: actions; margin-top: 6px !important; }

  .sv5-nr {
    gap: 6px !important;
    flex-wrap: wrap !important;
    align-items: center !important;
  }
  .sv5-nt {
    font-size: 22px !important;
    letter-spacing: -0.02em !important;
    line-height: 1.1 !important;
  }
  .sv5-tk {
    font-size: 9px !important;
    padding: 3px 7px !important;
    letter-spacing: 0.05em !important;
  }
  .sv5-rk { font-size: 10px !important; padding: 3px 7px !important; }
  .sv5-vr {
    font-size: 10px !important;
    padding: 3px 8px !important;
    gap: 3px !important;
  }
  .sv5-vr svg { width: 10px !important; height: 10px !important; }

  /* Alt names row — compact */
  .sv5-al {
    font-size: 11px !important;
    margin-top: 6px !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
    line-height: 1.4 !important;
  }
  .sv5-al b { font-size: 12px !important; }

  /* Action buttons: icon-only except "Написати відгук" */
  .sv5-ac {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
  }
  .sv5-ab {
    padding: 8px 10px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    gap: 5px !important;
    border-radius: 8px !important;
    min-height: 36px !important;
  }
  .sv5-ab svg { width: 14px !important; height: 14px !important; }
  /* Primary action "Написати відгук" stays with text; others hide text → icon only */
  .sv5-ab:not(.sv5-ab-primary):not([data-primary]) .sv5-ab-lbl,
  .sv5-ab:nth-child(n+2) .sv5-ab-lbl {
    display: none !important;
  }
  .sv5-ab:nth-child(n+2) {
    width: 36px !important;
    padding: 0 !important;
    justify-content: center !important;
  }
  .sv5-ab:first-child {
    flex: 1 !important;
    min-width: 0 !important;
  }

  /* ═══ 3. AWARDS · hide on mobile (already in header as ticker) ═══ */
  /* They show icons like "#16/6 premium" + "2 роки" — keep but compact */
  .sv5-aw-row {
    gap: 6px !important;
    flex-wrap: wrap !important;
  }
  .sv5-aw-item {
    padding: 5px 10px !important;
    font-size: 11px !important;
    gap: 5px !important;
  }
  .sv5-aw-item svg { width: 13px !important; height: 13px !important; }

  /* ═══ 4. HERO: main rating + chart ═══ */
  .sv5-hg {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  /* Main score big number */
  .sv5-rc {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    gap: 14px !important;
    align-items: center !important;
  }
  .sv5-rb {
    font-size: 52px !important;
    line-height: 1 !important;
    padding: 14px 18px !important;
    border-radius: 10px !important;
    letter-spacing: -0.04em !important;
  }
  .sv5-rvr { gap: 8px !important; flex-wrap: wrap !important; }
  .sv5-rm { font-size: 13px !important; color: #5E6673 !important; }
  .sv5-sgb {
    font-size: 14px !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
  }
  .sv5-sgb svg { width: 11px !important; height: 11px !important; }

  /* v1.6.65 legacy — old breakdown styles (class renamed, harmless to keep only leaf rules) */

  /* License block */
  .sv5-lic {
    padding: 10px 12px !important;
    border-radius: 10px !important;
    gap: 10px !important;
  }
  .sv5-lic-ico {
    width: 32px !important;
    height: 32px !important;
    flex-shrink: 0 !important;
  }
  .sv5-lic-ico svg { width: 16px !important; height: 16px !important; }
  .sv5-lic-lbl { font-size: 9px !important; letter-spacing: 0.08em !important; }
  .sv5-lic-v { font-size: 14px !important; }
  .sv5-lic-sub { font-size: 10px !important; }

  /* Chart block */
  .sv5-chh {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
    align-items: flex-start !important;
  }
  .sv5-chl {
    display: flex !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    width: 100% !important;
    padding-bottom: 2px !important;
    align-items: center !important;
  }
  .sv5-chl::-webkit-scrollbar { display: none !important; }
  .sv5-chl .sv5-ci {
    font-size: 12px !important;
    gap: 4px !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
  }
  .sv5-chl .sv5-cn { font-size: 12px !important; }
  .sv5-chl .sv5-cv { font-size: 13px !important; font-weight: 800 !important; }
  .sv5-chl .sv5-cdl {
    font-size: 9px !important;
    padding: 1px 5px !important;
    font-weight: 800 !important;
  }
  .sv5-chl .sv5-cd {
    width: 8px !important;
    height: 8px !important;
    flex-shrink: 0 !important;
  }
  .sv5-chr-lg-i b { font-size: 12px !important; }
  .sv5-chr-lg-i .sv5-chr-delta {
    font-size: 9px !important;
    padding: 1px 5px !important;
  }
  .sv5-chr-tf {
    gap: 2px !important;
    padding: 2px !important;
  }
  .sv5-chr-tb,
  .sv5-tf-btn {
    font-size: 11px !important;
    padding: 5px 9px !important;
    min-width: 32px !important;
  }
  .sv5-chr-tt {
    gap: 3px !important;
    padding: 2px !important;
  }
  .sv5-chr-tt button {
    width: 30px !important;
    height: 30px !important;
  }
  .sv5-chr-tt svg { width: 14px !important; height: 14px !important; }
  .sv5-chr canvas,
  #sv5ChartCanvas {
    max-height: 240px !important;
  }

  /* ═══ 4b. RADAR + DONUT + GAUGE (3-card row → stack) ═══ */
  .sv5-fw-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .sv5-fw-card { padding: 14px !important; border-radius: 12px !important; }
  .sv5-fw-card h3,
  .sv5-fw-card-t { font-size: 13px !important; }
  .sv5-fw-card canvas { max-height: 220px !important; }

  /* ═══ 5. BONUS block ═══ */
  .sv5-hgb {
    padding: 14px !important;
    border-radius: 12px !important;
  }
  .sv5-hgb-v {
    font-size: 22px !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em !important;
  }
  .sv5-hgb-sub { font-size: 12px !important; }
  .sv5-hgb-cta {
    padding: 12px 16px !important;
    font-size: 13px !important;
    letter-spacing: 0.04em !important;
  }
  .sv5-hgb-wager { font-size: 11px !important; }

  /* Secondary actions row after bonus (Написати відгук etc) */
  .sv5-hgsa { gap: 6px !important; flex-wrap: wrap !important; }
  .sv5-hgsa a {
    padding: 8px 12px !important;
    font-size: 11px !important;
    min-height: 36px !important;
  }

  /* ═══ 6. STATS BAR (games, providers, RTP, etc) ═══ */
  .sv5-st-grid,
  .sv5-stats-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .sv5-st-item,
  .sv5-stats-item {
    padding: 10px 12px !important;
    border-radius: 10px !important;
  }
  .sv5-st-v,
  .sv5-stats-v {
    font-size: 18px !important;
    letter-spacing: -0.01em !important;
  }
  .sv5-st-l,
  .sv5-stats-l {
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
  }
  .sv5-st-ico {
    width: 28px !important;
    height: 28px !important;
  }
  .sv5-st-ico svg { width: 14px !important; height: 14px !important; }

  /* ═══ 7. RATING SEGMENTS (5-bar breakdown Expert/Players/Votes) ═══ */
  .sv5-rsb-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .sv5-rsb-card { padding: 12px !important; }
  .sv5-rsb-hd-v { font-size: 20px !important; }

  /* ═══ 8. PROS/CONS ═══ */
  .sv5-pc-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .sv5-pc-card { padding: 12px !important; }
  .sv5-pc-li { font-size: 12px !important; padding: 6px 0 !important; }

  /* ═══ 9. PAYMENTS + PROVIDERS (chips row) ═══ */
  .sv5-pp-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .sv5-pp-card { padding: 12px !important; }
  .sv5-pp-list {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 4px !important;
  }
  .sv5-pp-list::-webkit-scrollbar { display: none; }
  .sv5-pp-chip {
    flex-shrink: 0 !important;
    font-size: 11px !important;
    padding: 5px 10px !important;
  }

  /* ═══ REACTION BLOCK ═══ */
  .sv5-rb-grid,
  .sv5-reactions-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
  .sv5-reaction-item { padding: 10px !important; }
  .sv5-reaction-emoji { font-size: 22px !important; }
  .sv5-reaction-v { font-size: 16px !important; }
  .sv5-reaction-l { font-size: 10px !important; }

  /* ═══ CASINO STATISTICS (big stats section) ═══ */
  .sv5-cs-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .sv5-cs-wide { grid-column: span 2 !important; }
  .sv5-cs-item { padding: 12px !important; }
  .sv5-cs-v { font-size: 20px !important; }
  .sv5-cs-l { font-size: 10px !important; }

  /* ═══ ACHIEVEMENTS ═══ */
  .sv5-ach-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .sv5-ach-card { padding: 12px 10px !important; text-align: center !important; }
  .sv5-ach-ico { width: 36px !important; height: 36px !important; margin: 0 auto 6px !important; }
  .sv5-ach-v { font-size: 13px !important; }
  .sv5-ach-l { font-size: 10px !important; }

  /* ═══ PLAYER JOURNEY ═══ */
  .sv5-pj-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .sv5-pj-card { padding: 12px 10px !important; }
  .sv5-pj-step { font-size: 10px !important; }
  .sv5-pj-title { font-size: 12px !important; }
  .sv5-pj-desc { font-size: 11px !important; }

  /* ═══ STICKY NAV ═══ */
  .sv5-sticky-nav,
  .sv5-nav {
    overflow-x: auto !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .sv5-nav::-webkit-scrollbar,
  .sv5-sticky-nav::-webkit-scrollbar { display: none !important; }
  .sv5-nav-i {
    font-size: 12px !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  /* ═══ SECTION HEADERS ═══ */
  .sv5-section-t,
  .sv5-section-ti {
    font-size: 16px !important;
    margin-bottom: 12px !important;
  }

  /* ═══════════════════════════════════════════════════════════════════
     REVIEWS — v1.6.90 full mobile compact rewrite
     Card stretches to full width, top row condensed, categories 1-col,
     vs-average inline, cons as highlight block.
  ═══════════════════════════════════════════════════════════════════ */

  /* v1.6.91 — reduce inner card padding on mobile for both:
     (a) aggregation cards (Середня оцінка / Радар / Відгуки по місяцях)
     (b) individual review cards
     Gives back ~16px of horizontal content width per card. */
  .sv5-rd-card {
    padding: 12px 12px !important;
  }

  .sv5-review-card,
  .sv-review-item,
  .sv5-rev-v1,
  .sv5-rev-v2 {
    padding: 12px !important;
    border-radius: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* ── TOP ROW: avatar + name+verif+meta + compact score-box ── */
  .sv5-rev-v1-top {
    display: grid !important;
    grid-template-columns: 44px 1fr auto !important;
    gap: 10px !important;
    align-items: center !important;
    margin-bottom: 10px !important;
  }
  .sv5-rev-v1 .sv5-rev-av,
  .sv5-rev-av {
    width: 44px !important;
    height: 44px !important;
    font-size: 14px !important;
    flex-shrink: 0 !important;
  }
  .sv5-rev-meta-wrap {
    min-width: 0 !important;
    gap: 2px !important;
  }
  .sv5-rev-name-row {
    flex-wrap: wrap !important;
    gap: 6px !important;
    align-items: center !important;
  }
  .sv5-rev-v1 .sv5-rev-name,
  .sv5-rev-name {
    font-size: 14px !important;
    line-height: 1.2 !important;
  }
  .sv5-rev-verif {
    font-size: 9px !important;
    padding: 1px 5px !important;
  }
  .sv5-rev-verif svg { width: 8px !important; height: 8px !important; }

  /* Meta line under name — tighter, wrap, smaller icons */
  .sv5-rev-meta {
    font-size: 10px !important;
    gap: 6px 10px !important;
    flex-wrap: wrap !important;
    margin-top: 3px !important;
  }
  .sv5-rev-meta span {
    font-size: 10px !important;
    gap: 3px !important;
  }
  .sv5-rev-meta svg { width: 9px !important; height: 9px !important; }

  /* Compact score box */
  .sv5-rev-score-wrap {
    text-align: center !important;
    padding: 6px 9px !important;
    border-radius: 10px !important;
    background: rgba(132,142,156,.06) !important;
    min-width: 58px !important;
  }
  .sv5-rev-score-big {
    font-size: 22px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    font-variant-numeric: tabular-nums !important;
  }
  .sv5-rev-score-big::after {
    content: '/5';
    font-size: 10px;
    color: #848E9C;
    font-weight: 500;
    margin-left: 1px;
  }
  .sv5-rev-verdict {
    font-size: 8px !important;
    padding: 2px 5px !important;
    margin-top: 3px !important;
    white-space: nowrap !important;
    letter-spacing: .02em !important;
  }

  /* Small badges inside name row — squeeze */
  .sv5-rev-badge {
    font-size: 9px !important;
    padding: 2px 6px !important;
    gap: 3px !important;
  }
  .sv5-rev-badge svg { width: 8px !important; height: 8px !important; }
  .sv5-rev-trust-inline {
    font-size: 10px !important;
  }

  /* ── vs-AVERAGE compare bar ── */
  .sv5-rev-compare {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    background: #0B0E11 !important;
    border-radius: 8px !important;
    margin-top: 10px !important;
    flex-wrap: nowrap !important;
  }
  .sv5-rev-compare-l {
    font-size: 10px !important;
    white-space: nowrap !important;
  }
  .sv5-rev-compare-l strong {
    font-size: 11px !important;
    margin-left: 3px !important;
  }
  .sv5-rev-compare-bar {
    flex: 1 !important;
    min-width: 40px !important;
    height: 4px !important;
  }
  .sv5-rev-compare-delta {
    font-size: 10px !important;
    white-space: nowrap !important;
    font-weight: 800 !important;
  }

  /* ── CATEGORIES: 1-col list (label + value + bar) ── */
  .sv5-rev-cats-grid {
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    margin-top: 12px !important;
  }
  .sv5-rev-cat {
    display: grid !important;
    grid-template-columns: 85px 32px 1fr !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
  }
  .sv5-rev-cat-l {
    font-size: 10px !important;
    color: #848E9C !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    margin: 0 !important;
  }
  .sv5-rev-cat-s {
    font-size: 13px !important;
    font-weight: 900 !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
    margin: 0 !important;
  }
  .sv5-rev-cat-bar {
    height: 4px !important;
    border-radius: 2px !important;
    margin: 0 !important;
  }

  /* ── REVIEW TEXT ── */
  .sv5-rev-txt,
  .sv5-rev-text {
    font-size: 13px !important;
    line-height: 1.55 !important;
    margin: 12px 0 0 !important;
  }

  /* ── GAMES PLAYED — v1.6.92 horizontal scroll, no wrap ── */
  .sv5-rev-games {
    padding: 8px 10px !important;
    gap: 6px !important;
    margin-top: 10px !important;
    border-radius: 8px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x proximity !important;
    scrollbar-width: none !important;
  }
  .sv5-rev-games::-webkit-scrollbar { display: none; }
  .sv5-rev-games-l {
    font-size: 10px !important;
    gap: 4px !important;
    flex-shrink: 0 !important;
  }
  .sv5-rev-games .sv5-rev-chip {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    scroll-snap-align: start !important;
  }

  /* ── TAGS (pros/cons) ── */
  .sv5-rev-tags-block {
    gap: 8px !important;
    margin-top: 10px !important;
  }
  .sv5-rev-tag-group {
    padding: 10px 12px !important;
    border-radius: 8px !important;
    border-left-width: 2px !important;
  }
  .sv5-rev-tag-title {
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    gap: 5px !important;
    margin-bottom: 6px !important;
  }
  .sv5-rev-tag-list {
    gap: 4px !important;
  }
  .sv5-rev-chip {
    font-size: 11px !important;
    padding: 3px 10px !important;
    border-radius: 999px !important;
  }

  /* Legacy tag names too */
  .sv5-rev-tags { gap: 4px !important; }
  .sv5-rev-tag {
    font-size: 10px !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
  }

  /* Segment bars (used in some review variants) */
  .sv5-rev-seg { gap: 4px !important; }
  .sv5-rev-seg-bar { gap: 2px !important; }
  .sv5-rev-seg-s { height: 4px !important; }
  .sv5-rev-seg-l { font-size: 10px !important; }

  /* ── REPLY ── */
  .sv5-rev-reply {
    padding: 10px 12px !important;
    margin-top: 10px !important;
    border-radius: 8px !important;
  }
  .sv5-rev-reply-h {
    gap: 6px !important;
    flex-wrap: wrap !important;
    margin-bottom: 6px !important;
  }
  .sv5-rev-reply-av {
    width: 24px !important; height: 24px !important;
    font-size: 11px !important;
  }
  .sv5-rev-reply-name {
    font-size: 12px !important;
  }
  .sv5-rev-reply-time {
    font-size: 9px !important;
    width: 100% !important;
  }
  .sv5-rev-reply-txt {
    font-size: 12px !important;
    line-height: 1.5 !important;
  }

  /* ── FOOTER (date + like buttons) ── */
  .sv5-rev-foot {
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding-top: 10px !important;
    margin-top: 10px !important;
  }
  .sv5-rev-foot-l {
    font-size: 10px !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
  .sv5-rev-foot-l span { gap: 4px !important; }
  .sv5-rev-foot-l svg { width: 10px !important; height: 10px !important; }
  .sv5-rev-foot-actions {
    gap: 6px !important;
  }
  .sv5-rev-btn {
    padding: 4px 8px !important;
    font-size: 11px !important;
  }
  .sv5-rev-helpful-ratio {
    font-size: 10px !important;
    width: 100% !important;
    order: -1 !important;
  }

  /* Score-box variant used in other review cards */
  .sv5-rev-score-box { padding: 8px 10px !important; min-width: 64px !important; }
  .sv5-rev-score-v { font-size: 22px !important; }
  .sv5-rev-score-max { font-size: 11px !important; }

  /* ═══ EXPERT REVIEW section ═══ */
  .sv5-expert-hd { flex-wrap: wrap !important; gap: 8px !important; }
  .sv5-expert-av { width: 40px !important; height: 40px !important; }
  .sv5-expert-name { font-size: 13px !important; }
  .sv5-expert-text { font-size: 13px !important; line-height: 1.6 !important; }

  /* ═══ BONUSES GRID ═══ */
  .sv5-bonuses-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .sv5-bonus-card { padding: 14px !important; }
  .sv5-bonus-v { font-size: 20px !important; }

  /* ═══ HISTORY TIMELINE ═══ */
  .sv5-timeline-item { padding: 12px !important; gap: 10px !important; }
  .sv5-timeline-date { font-size: 11px !important; min-width: 60px !important; }
  .sv5-timeline-title { font-size: 13px !important; }
  .sv5-timeline-desc { font-size: 12px !important; }

  /* ═══ FAQ ═══ */
  .sv5-faq-q { font-size: 13px !important; padding: 12px !important; }
  .sv5-faq-a { font-size: 12px !important; padding: 0 12px 12px !important; line-height: 1.55 !important; }

  /* ═══ SIDEBAR (hidden on mobile) ═══ */
  body.single-casino .sidebar,
  body.single-casino .sv5-sidebar { display: none !important; }

  /* ═══ Info buttons (i) smaller ═══ */
  .sv5-info-btn {
    width: 18px !important;
    height: 18px !important;
    font-size: 11px !important;
  }
}

/* Tightest screens <480px */
@media (max-width: 480px) {
  body.single-casino .sv5-card,
  body.single-casino .sv5-section {
    padding: 12px !important;
    margin: 0 10px 10px !important;
  }
  .sv5-nt { font-size: 20px !important; }
  .sv5-rb { font-size: 44px !important; padding: 12px 14px !important; }
  .sv5-rgc-sec-v { font-size: 18px !important; }
  .sv5-st-grid,
  .sv5-stats-grid,
  .sv5-cs-grid {
    grid-template-columns: 1fr !important;
  }
  .sv5-cs-wide { grid-column: span 1 !important; }
  .sv5-hgb-v { font-size: 20px !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.66 — SINGLE-CASINO · Hero area precise fixes
   1. Main rating row (3.6 /5 +0.5) — 1 row, compact, larger
   2. Breakdown with SVG icons — 3 cols equal
   3. License — full-width
   4. Ticker already removed from HTML
═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* Main rating row: force 1 line, bigger, tight gap */
  .sv5-rvr {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
  }
  .sv5-rb {
    font-size: 56px !important;
    line-height: 1 !important;
    padding: 10px 16px !important;
    border-radius: 10px !important;
    letter-spacing: -0.04em !important;
    flex-shrink: 0 !important;
  }
  .sv5-rm {
    font-size: 18px !important;
    color: #5E6673 !important;
    font-weight: 600 !important;
    flex-shrink: 0 !important;
  }
  .sv5-trd {
    font-size: 14px !important;
    padding: 5px 10px !important;
    border-radius: 8px !important;
    gap: 3px !important;
    flex-shrink: 0 !important;
    font-weight: 800 !important;
  }
  .sv5-trd svg { width: 12px !important; height: 12px !important; }

  /* Label "Рейтинг Tymoshenko.com.ua (i)" above number */
  .sv5-lb {
    font-size: 11px !important;
    color: #848E9C !important;
    margin-bottom: 10px !important;
    gap: 6px !important;
  }

  /* Breakdown: 3 equal cols with SVG icons */
  .sv5-rvr-breakdown {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 8px !important;
    padding: 12px 8px !important;
    background: #0B0E11 !important;
    border-radius: 12px !important;
    margin-top: 8px !important;
  }
  .sv5-rvr-b-it {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 4px 2px !important;
    border-right: 1px solid rgba(255,255,255,.05) !important;
    text-align: center !important;
    background: transparent !important;
  }
  .sv5-rvr-b-it:last-child { border-right: none !important; }
  /* Hide legacy dots if PHP still renders them */
  .sv5-rvr-b-dot { display: none !important; }
  /* Show SVG icon */
  .sv5-rvr-b-ico {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
    background: rgba(255,255,255,.04) !important;
    margin-bottom: 2px !important;
  }
  .sv5-rvr-b-ico svg {
    width: 16px !important;
    height: 16px !important;
  }
  .sv5-rvr-b-l {
    font-family: var(--font) !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: #848E9C !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
  }
  .sv5-rvr-b-v {
    font-family: var(--font-display) !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    color: #EAECEF !important;
    line-height: 1 !important;
    letter-spacing: -0.03em !important;
  }

  /* License — full-width row */
  .sv5-rc-license {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    gap: 12px !important;
    padding: 12px 14px !important;
    margin-top: 12px !important;
    border-radius: 12px !important;
    background: rgba(14,203,129,.08) !important;
    border: 1px solid rgba(14,203,129,.2) !important;
  }
  .sv5-rc-license-ico {
    width: 40px !important;
    height: 40px !important;
    flex-shrink: 0 !important;
    border-radius: 10px !important;
    background: rgba(14,203,129,.15) !important;
    color: #0ECB81 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .sv5-rc-license-ico svg { width: 20px !important; height: 20px !important; }
  .sv5-rc-license-body {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }
  .sv5-rc-license-l {
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #0ECB81 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
  }
  .sv5-rc-license-v {
    font-family: var(--font-display) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #EAECEF !important;
    letter-spacing: -0.01em !important;
  }
  .sv5-rc-license-d {
    font-size: 10px !important;
    color: #848E9C !important;
    line-height: 1.4 !important;
  }

  /* RC grid: main rating fills full width, license full width below */
  .sv5-rc-grid,
  .sv5-rc-v5 {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
  }

  /* Top bar badges — strict 1 row, scroll if needed */
  .sv5-up-wrap {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding-bottom: 2px !important;
  }
  .sv5-up-wrap::-webkit-scrollbar { display: none !important; }
  .sv5-up-viewers,
  .sv5-up {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 4px 10px !important;
    background: #181A20 !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    color: #B7BDC6 !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    font-weight: 600 !important;
  }
  .sv5-up-viewers-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #0ECB81 !important;
    box-shadow: 0 0 6px #0ECB81 !important;
    animation: sv5ViewerPulse 1.8s ease-in-out infinite !important;
    flex-shrink: 0 !important;
  }
  .sv5-up-ico {
    color: #848E9C !important;
    flex-shrink: 0 !important;
  }
  .sv5-up-viewers-n {
    font-family: var(--font-mono) !important;
    font-weight: 800 !important;
    color: #0ECB81 !important;
  }
  @keyframes sv5ViewerPulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.4; }
  }
}

/* Desktop: same breakdown icons look good — apply lighter version */
@media (min-width: 769px) {
  .sv5-rvr-b-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: rgba(255,255,255,.03);
    margin-right: 6px;
  }
  .sv5-rvr-b-ico svg { width: 14px; height: 14px; }
  .sv5-rvr-b-dot { display: none !important; }

  /* Desktop: clock icon in "оновлено" badge */
  .sv5-up-ico {
    color: #848E9C;
    flex-shrink: 0;
    vertical-align: middle;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.68 — SINGLE-CASINO · Rating 2×2 grid (Variant 3)
   Higher specificity (.sv5-card .sv5-rgrid) to override earlier rules
═══════════════════════════════════════════════════════════════════════ */

/* Header row — applies all viewports */
.sv5-card .sv5-lb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 12px !important;
  margin-top: 0 !important;
}
.sv5-card .sv5-lb-txt {
  flex: 1 !important;
  font-size: 10px !important;
  color: #848E9C !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 700 !important;
}
.sv5-card .sv5-lb-trd {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  font-family: var(--font-mono, 'JetBrains Mono'), monospace !important;
}
.sv5-card .sv5-lb-trd.sv5-trd-up {
  color: #0ECB81 !important;
  background: rgba(14,203,129,.12) !important;
}
.sv5-card .sv5-lb-trd.sv5-trd-dn {
  color: #F6465D !important;
  background: rgba(246,70,93,.12) !important;
}

/* 2×2 Grid wrapper — now: main full-width on top, breakdown 3-col below */
.sv5-card .sv5-rgrid-hero {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin: 0 0 14px 0 !important;
  width: 100% !important;
}

/* TOP: full-width main rating block with amber gradient */
.sv5-card .sv5-rgrid-hero .sv5-rgrid-main {
  background: linear-gradient(180deg, rgba(240,185,11,.14) 0%, rgba(240,185,11,.02) 100%) !important;
  border: 1px solid rgba(240,185,11,.28) !important;
  border-radius: 12px !important;
  padding: 22px 16px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rgrid-main-l {
  font-family: var(--font, 'Onest'), sans-serif !important;
  font-size: 10px !important;
  color: #F0B90B !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rgrid-main-vl {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 4px !important;
  line-height: 1 !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rgrid-main-vl .sv5-rb {
  font-family: var(--font-display, 'Unbounded'), sans-serif !important;
  font-size: 56px !important;
  font-weight: 900 !important;
  color: #EAECEF !important;
  letter-spacing: -0.04em !important;
  line-height: 1 !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rgrid-main-vl .sv5-rm {
  font-size: 16px !important;
  color: #848E9C !important;
  font-weight: 600 !important;
}
/* Hide duplicate trend inside main card (already in header) */
.sv5-card .sv5-rgrid-hero .sv5-rgrid-main .sv5-trd {
  display: none !important;
}

/* BOTTOM: 3 mini-cards in a row (under main rating) */
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  grid-template-rows: none !important;
  gap: 6px !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  min-width: 0 !important;
  flex-direction: row !important;
  width: 100% !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-it {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 10px 6px !important;
  background: #2B2F36 !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 10px !important;
  text-align: center !important;
  flex: none !important;
  min-width: 0 !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-ico {
  width: 22px !important;
  height: 22px !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-ico svg {
  width: 16px !important;
  height: 16px !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-l {
  font-family: var(--font, 'Onest'), sans-serif !important;
  font-size: 10px !important;
  color: #B7BDC6 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  line-height: 1.1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  color: #EAECEF !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
  text-align: center !important;
  margin-top: 2px !important;
}
/* Hide legacy dots */
.sv5-card .sv5-rgrid-hero .sv5-rvr-b-dot { display: none !important; }

/* Mobile: tighter padding */
@media (max-width: 768px) {
  .sv5-card .sv5-rgrid-hero {
    gap: 6px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rgrid-main {
    padding: 18px 12px !important;
    gap: 8px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rgrid-main-vl .sv5-rb {
    font-size: 54px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rgrid-main-vl .sv5-rm {
    font-size: 16px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown {
    gap: 5px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-it {
    padding: 8px 4px !important;
    gap: 3px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-ico {
    width: 20px !important;
    height: 20px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-ico svg {
    width: 14px !important;
    height: 14px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-l {
    font-size: 9px !important;
    letter-spacing: 0.04em !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-v {
    font-size: 17px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.70 — Top bar badges · Compact text on narrow screens
═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  /* Shrink text + hide secondary words to fit 3 badges in 1 row */
  .sv5-up-wrap {
    gap: 4px !important;
    justify-content: flex-start !important;
  }
  .sv5-up-viewers,
  .sv5-up {
    font-size: 10px !important;
    padding: 3px 8px !important;
    gap: 4px !important;
  }
  .sv5-up-ico,
  .sv5-up-viewers-dot {
    width: 11px !important;
    height: 11px !important;
  }
  .sv5-up-viewers-dot {
    width: 6px !important;
    height: 6px !important;
  }
  /* Hide "на сторінці" text — keep only number */
  .sv5-up-viewers-l { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.71 — Per-category trend badges inside mini-cards
═══════════════════════════════════════════════════════════════════════ */
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-trd {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
  font-family: var(--font-mono, 'JetBrains Mono'), monospace !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  padding: 2px 6px !important;
  border-radius: 5px !important;
  line-height: 1 !important;
  margin-top: 3px !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-trd.sv5-trd-up {
  color: #0ECB81 !important;
  background: rgba(14,203,129,.12) !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-trd.sv5-trd-dn {
  color: #F6465D !important;
  background: rgba(246,70,93,.12) !important;
}
.sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-trd svg {
  width: 9px !important;
  height: 9px !important;
  flex-shrink: 0 !important;
}

@media (max-width: 768px) {
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-trd {
    font-size: 9px !important;
    padding: 1px 5px !important;
    margin-top: 2px !important;
  }
  .sv5-card .sv5-rgrid-hero .sv5-rvr-breakdown .sv5-rvr-b-trd svg {
    width: 8px !important;
    height: 8px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.72 — Chart legend strict 1-row on narrow screens (correct selectors)
═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  .sv5-chl { gap: 8px !important; }
  .sv5-chl .sv5-ci {
    font-size: 11px !important;
    gap: 3px !important;
  }
  .sv5-chl .sv5-cn { font-size: 11px !important; }
  .sv5-chl .sv5-cv { font-size: 12px !important; }
  .sv5-chl .sv5-cdl {
    font-size: 8px !important;
    padding: 1px 4px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.77 — 3 BIG CARDS · Mobile wrappers (clean dual-HTML approach)
   Desktop: original HTML untouched
   Mobile ≤768px: hide desktop HTML, show .sv5-rgc-*-mobile wrappers
═══════════════════════════════════════════════════════════════════════ */

/* Hide mobile wrappers on desktop */
.sv5-rgc-cats-mobile,
.sv5-rgc-secb-mobile,
.sv5-rgc-temph-mobile {
  display: none;
}

@media (max-width: 768px) {

  /* ═══ CARD 1: Rating by Categories ═══ */
  .sv5-rgc .sv5-rgc-rows { display: none !important; }
  .sv5-rgc-cats-mobile {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .sv5-rgc-cm-it {
    background: #0B0E11;
    border: 1px solid rgba(255,255,255,.04);
    border-radius: 10px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
  }
  .sv5-rgc-cm-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
  }
  .sv5-rgc-cm-l {
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 10px;
    font-weight: 700;
    color: #848E9C;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    flex: 1;
  }
  .sv5-rgc-cm-d {
    font-family: var(--font-mono, 'JetBrains Mono'), monospace;
    font-size: 10px;
    font-weight: 800;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1;
    flex-shrink: 0;
  }
  .sv5-rgc-cm-mid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
  }
  .sv5-rgc-cm-v {
    font-family: var(--font-display, 'Unbounded'), sans-serif;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
  }
  .sv5-rgc-cm-spark {
    width: 60px;
    height: 20px;
    flex-shrink: 0;
  }

  /* ═══ CARD 2: Safety Index — hide desktop, show mobile B3 ═══ */
  .sv5-rgc > .sv5-rgc-gauge-wrap,
  .sv5-rgc > .sv5-rgc-sec-list {
    display: none !important;
  }
  .sv5-rgc-secb-mobile { display: block !important; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-row {
    display: flex;
    gap: 3px;
    margin-bottom: 8px;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-seg {
    flex: 1;
    height: 14px;
    background: #2B2F36;
    border-radius: 3px;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-seg.hl {
    box-shadow: 0 0 8px currentColor;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-scale {
    display: flex;
    justify-content: space-between;
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 9px;
    font-weight: 800;
    color: #5E6673;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 16px;
    padding: 0 2px;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-scale .on { font-weight: 900; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it {
    background: #0B0E11;
    border-left: 3px solid #474D57;
    border-radius: 6px;
    padding: 8px 10px;
    min-width: 0;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it.ok   { border-left-color: #0ECB81; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it.warn { border-left-color: #F0B90B; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it.fail { border-left-color: #F6465D; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it-l {
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 9px;
    font-weight: 700;
    color: #848E9C;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it-v {
    font-family: var(--font-display, 'Unbounded'), sans-serif;
    font-size: 13px;
    font-weight: 800;
    margin-top: 4px;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #EAECEF;
  }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it.ok   .sv5-rgc-secb-it-v { color: #0ECB81; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it.warn .sv5-rgc-secb-it-v { color: #F0B90B; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it.fail .sv5-rgc-secb-it-v { color: #F6465D; }

  /* ═══ CARD 3: Temperature — hide desktop, show mobile V5 ═══ */
  .sv5-rgc > .sv5-rgc-temp-big-col,
  .sv5-rgc > .sv5-rgc-segs-row,
  .sv5-rgc > .sv5-rgc-segs-scale,
  .sv5-rgc > .sv5-rgc-temp-factors {
    display: none !important;
  }
  .sv5-rgc-temph-mobile { display: block !important; }
  .sv5-rgc-temph-mobile .sv5-rgc-temph-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 4px 0 14px;
    flex-wrap: wrap;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-temph-v {
    font-family: var(--font-display, 'Unbounded'), sans-serif;
    font-size: 48px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.05em;
    display: inline-flex;
    align-items: baseline;
    font-variant-numeric: tabular-nums;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-temph-v span {
    font-size: 24px;
    margin-left: 2px;
    color: inherit;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-temph-pill {
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 11px;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-hmap {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 3px;
    margin-bottom: 6px;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-hmap-b {
    height: 22px;
    background: #2B2F36;
    border-radius: 3px;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-hmap-b.cur {
    box-shadow: 0 0 8px currentColor;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-hmap-scale {
    display: flex;
    justify-content: space-between;
    font-family: var(--font-mono, 'JetBrains Mono'), monospace;
    font-size: 10px;
    font-weight: 700;
    color: #5E6673;
    margin-bottom: 14px;
    padding: 0 2px;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-tempm-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-tempm-it {
    background: #0B0E11;
    border: 1px solid rgba(255,255,255,.04);
    border-radius: 8px;
    padding: 10px 12px;
    min-width: 0;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-tempm-l {
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 9px;
    font-weight: 700;
    color: #848E9C;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1;
  }
  .sv5-rgc-temph-mobile .sv5-rgc-tempm-v {
    font-family: var(--font-display, 'Unbounded'), sans-serif;
    font-size: 14px;
    font-weight: 800;
    margin-top: 5px;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #EAECEF;
  }

  /* Card header stays consistent on mobile — tighter */
  .sv5-rgc .sv5-rgc-h {
    margin-bottom: 14px;
    flex-wrap: wrap;
  }
  .sv5-rgc .sv5-rgc-t {
    font-size: 13px;
  }
  /* Card Unify: ensure rgc has flex column layout on mobile with consistent padding */
  .sv5-rgc {
    padding: 16px 14px;
    display: flex;
    flex-direction: column;
  }
  /* Footer only for Card 1 — still relevant */
  .sv5-rgc-foot {
    font-size: 10px !important;
  }
}

/* Tighter ≤480px */
@media (max-width: 480px) {
  .sv5-rgc-cm-v { font-size: 22px !important; }
  .sv5-rgc-cm-spark { width: 50px !important; height: 18px !important; }
  .sv5-rgc-cm-d { font-size: 9px !important; padding: 1px 5px !important; }
  .sv5-rgc-cm-l { font-size: 9px !important; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-seg { height: 12px !important; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-scale { font-size: 8px !important; }
  .sv5-rgc-secb-mobile .sv5-rgc-secb-it-v { font-size: 12px !important; }
  .sv5-rgc-temph-mobile .sv5-rgc-temph-v { font-size: 40px !important; }
  .sv5-rgc-temph-mobile .sv5-rgc-temph-v span { font-size: 20px !important; }
  .sv5-rgc-temph-mobile .sv5-rgc-hmap-b { height: 18px !important; }
  .sv5-rgc-temph-mobile .sv5-rgc-tempm-v { font-size: 13px !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.80 — FOR WHOM mobile (4 status tiers)
   Tiers: perfect (5★) / yes (4★) / partly (3★) / no (1-2★)
   Colors driven by inline styles in PHP for color flexibility.
═══════════════════════════════════════════════════════════════════════ */

.sv5-fw-mobile { display: none; }

@media (max-width: 768px) {
  .sv5-fw .sv5-fw-grid,
  .sv5-fw .sv5-fw-stackbar-wrap,
  .sv5-fw .sv5-fw-detail { display: none !important; }
  .sv5-fw-mobile {
    display: block !important;
    background: #181A20;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 12px;
    padding: 14px;
  }

  .sv5-fw-mob-hd {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 8px;
  }
  .sv5-fw-mob-hd + .sv5-fw-mob-list + .sv5-fw-mob-hd { margin-top: 16px; }

  .sv5-fw-mob-hd .sv5-fw-mob-line {
    flex: 1;
    height: 1px;
    display: block;
  }

  .sv5-fw-mob-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .sv5-fw-mob-it {
    border-radius: 8px;
    padding: 10px 12px;
    border: 1px solid;
  }
  .sv5-fw-mob-tier-no { opacity: .85; }

  .sv5-fw-mob-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
  }
  .sv5-fw-mob-name {
    font-family: var(--font-display, 'Unbounded'), sans-serif;
    font-size: 13px;
    font-weight: 800;
    color: #EAECEF;
    line-height: 1.1;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .sv5-fw-mob-tier-no .sv5-fw-mob-name { color: #B7BDC6; }

  .sv5-fw-mob-dots {
    display: flex;
    gap: 3px;
    flex-shrink: 0;
  }
  .sv5-fw-mob-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
  }

  .sv5-fw-mob-desc {
    font-family: var(--font, 'Onest'), sans-serif;
    font-size: 11px;
    color: #B7BDC6;
    line-height: 1.4;
  }
  .sv5-fw-mob-tier-no .sv5-fw-mob-desc { color: #848E9C; }
}

@media (max-width: 480px) {
  .sv5-fw-mob-name { font-size: 12px !important; }
  .sv5-fw-mob-desc { font-size: 10px !important; }
  .sv5-fw-mob-it { padding: 9px 10px !important; }
  .sv5-fw-mob-dot { width: 5px !important; height: 5px !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.86 — Awards (Нагороди) horizontal scroll on mobile
   On ≤768px the awards bar becomes a horizontal scrollable strip
   instead of wrapping to multiple rows.
═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .sv5-aw {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    gap: 8px;
    padding: 8px 12px;
  }
  .sv5-aw::-webkit-scrollbar {
    display: none;
  }
  .sv5-awk {
    flex-shrink: 0;
    margin-right: 4px;
  }
  .sv5-ai {
    flex-shrink: 0;
    scroll-snap-align: start;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.89 — POSITIONS BAR (same visual as Awards bar)
   4 pills: Безпека / Експерт / Відгуки / Голоси + trend arrow
═══════════════════════════════════════════════════════════════════════ */
.sv5-pos-bar {
  background: var(--sv5-bg-2, #1E2329);
  border: 1px solid var(--sv5-line, rgba(255,255,255,.06));
  border-radius: var(--sv5-rm, 12px);
  padding: 10px 14px;
  margin-bottom: 20px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.sv5-pos-bar-lbl {
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 11px;
  color: #848E9C;
  font-weight: 500;
  margin-right: 4px;
}
.sv5-pos-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px 5px 6px;
  background: var(--sv5-bg-3, #2B2F36);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 999px;
  font-family: var(--font, 'Onest'), sans-serif;
  font-size: 12px;
}
.sv5-pos-pill-g { border-color: rgba(14,203,129,.25); }
.sv5-pos-pill-a { border-color: rgba(240,185,11,.25); }
.sv5-pos-pill-r { border-color: rgba(246,70,93,.2); }

.sv5-pos-ico {
  width: 22px; height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-pos-ico svg { width: 12px; height: 12px; }
.sv5-pos-ico-g { background: rgba(14,203,129,.15); color: #0ECB81; }
.sv5-pos-ico-a { background: rgba(240,185,11,.15); color: #F0B90B; }
.sv5-pos-ico-r { background: rgba(246,70,93,.15); color: #F6465D; }

.sv5-pos-pill b {
  color: #EAECEF;
  font-weight: 500;
}
.sv5-pos-lbl-short { display: none; }

.sv5-pos-num {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.sv5-pos-pill-g .sv5-pos-num { color: #0ECB81; }
.sv5-pos-pill-a .sv5-pos-num { color: #F0B90B; }
.sv5-pos-pill-r .sv5-pos-num { color: #F6465D; }

.sv5-pos-max {
  color: #848E9C;
  font-size: 10px;
}

.sv5-pos-trend {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 10px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: -2px;
}
.sv5-pos-trend-up   { color: #0ECB81; }
.sv5-pos-trend-dn   { color: #F6465D; }
.sv5-pos-trend-flat { color: #848E9C; }

/* Mobile: horizontal scroll (same pattern as .sv5-aw) + short labels */
@media (max-width: 768px) {
  .sv5-pos-bar {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    gap: 8px;
    padding: 8px 12px;
    margin-bottom: 16px;
  }
  .sv5-pos-bar::-webkit-scrollbar { display: none; }
  .sv5-pos-bar-lbl {
    flex-shrink: 0;
    margin-right: 4px;
  }
  .sv5-pos-pill {
    flex-shrink: 0;
    scroll-snap-align: start;
    gap: 5px;
    padding: 4px 10px 4px 5px;
    white-space: nowrap;
  }
  .sv5-pos-ico { width: 18px; height: 18px; }
  .sv5-pos-ico svg { width: 10px; height: 10px; }
  .sv5-pos-pill b { font-size: 11px; }
  /* Show short labels on mobile instead of full */
  .sv5-pos-lbl-full  { display: none; }
  .sv5-pos-lbl-short { display: inline; }
  .sv5-pos-num { font-size: 11px; }
  .sv5-pos-max { display: none; } /* save space */
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.94 — Hero action buttons: states / animations / dropdowns / toast
═══════════════════════════════════════════════════════════════════════ */

/* Wrapper (needed for dropdown positioning on Alert & Share) */
.sv5-ab-wrap {
  position: relative;
  display: inline-flex;
}

/* Active state (toggled ON) */
.sv5-ab.sv5-ab-active {
  background: rgba(240, 185, 11, 0.12) !important;
  border-color: rgba(240, 185, 11, 0.4) !important;
  color: #F0B90B !important;
}
.sv5-ab.sv5-ab-active svg {
  color: #F0B90B;
}

/* Badge (count indicator, e.g. 2/4) */
.sv5-ab {
  position: relative;
}
.sv5-ab-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background: #F6465D;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  border-radius: 999px;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  border: 2px solid var(--sv5-bg-1, #181A20);
  font-variant-numeric: tabular-nums;
  font-family: var(--font, 'Onest'), sans-serif;
  line-height: 1;
}
.sv5-ab-badge[hidden] { display: none; }

/* Hover lift */
.sv5-ab {
  transition: all 0.18s ease;
}
.sv5-ab:hover {
  transform: translateY(-1px);
}

/* Pulse animation (on toggle) */
.sv5-ab-pulse {
  animation: sv5abPulse 0.42s ease;
}
@keyframes sv5abPulse {
  0% { transform: scale(1); }
  40% { transform: scale(1.12); }
  100% { transform: scale(1); }
}

/* Shake animation (on error) */
.sv5-ab-shake {
  animation: sv5abShake 0.42s cubic-bezier(.36,.07,.19,.97);
}
@keyframes sv5abShake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(3px); }
  30%, 50%, 70% { transform: translateX(-5px); }
  40%, 60% { transform: translateX(5px); }
}

/* ═══ DROPDOWN MENU (Alerts & Share) ═══ */
.sv5-ab-drop {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 240px;
  background: var(--sv5-bg-0, #0B0E11);
  border: 1px solid var(--sv5-line-2, rgba(255, 255, 255, 0.1));
  border-radius: 10px;
  padding: 8px;
  z-index: 1000;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  font-family: var(--font, 'Onest'), sans-serif;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.18s, transform 0.18s;
  pointer-events: none;
}
.sv5-ab-drop.sv5-ab-drop-show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.sv5-ab-drop-share { min-width: 200px; }

.sv5-ab-drop-h {
  font-size: 10px;
  color: #848E9C;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 4px 10px;
  margin-bottom: 4px;
}
.sv5-ab-drop-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 12px;
  color: #EAECEF;
  cursor: pointer;
  transition: background 0.12s;
  width: 100%;
  background: transparent;
  border: none;
  text-align: left;
  font-family: inherit;
}
.sv5-ab-drop-row:hover {
  background: var(--sv5-bg-3, #2B2F36);
}
.sv5-ab-drop-row input[type="checkbox"] {
  accent-color: #F0B90B;
  cursor: pointer;
  margin: 0;
  flex-shrink: 0;
}
.sv5-ab-drop-row svg {
  flex-shrink: 0;
  color: #848E9C;
}
.sv5-ab-drop-row:hover svg {
  color: #EAECEF;
}
.sv5-ab-drop-row span {
  min-width: 0;
}
.sv5-ab-drop-div {
  height: 1px;
  background: rgba(255, 255, 255, 0.06);
  margin: 6px 0;
}
.sv5-ab-drop-save {
  display: block;
  width: 100%;
  padding: 8px 10px;
  background: rgba(240, 185, 11, 0.1);
  border: 1px solid rgba(240, 185, 11, 0.25);
  border-radius: 6px;
  color: #F0B90B;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.sv5-ab-drop-save:hover {
  background: rgba(240, 185, 11, 0.18);
  border-color: #F0B90B;
}

/* ═══ TOAST ═══ */
#sv5-toast.sv5-toast,
.sv5-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(120px);
  background: var(--sv5-bg-0, #0B0E11);
  color: var(--sv5-t1, #EAECEF);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  padding: 12px 18px;
  font-size: 13px;
  font-weight: 500;
  z-index: 10000;
  transition: transform 0.3s cubic-bezier(.68,-.55,.27,1.55), opacity 0.25s;
  opacity: 0;
  max-width: 90vw;
  font-family: var(--font, 'Onest'), sans-serif;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  pointer-events: none;
}
.sv5-toast.sv5-toast-show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.sv5-toast-success { border-color: rgba(14, 203, 129, 0.35); }
.sv5-toast-error   { border-color: rgba(246, 70, 93, 0.35); }
.sv5-toast-info    { border-color: rgba(56, 97, 251, 0.35); }
.sv5-toast-cta {
  color: #F0B90B;
  text-decoration: none;
  font-weight: 700;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(240, 185, 11, 0.12);
  transition: background 0.15s;
  display: inline-block;
}
.sv5-toast-cta:hover {
  background: rgba(240, 185, 11, 0.22);
  color: #FCD535;
}

/* ═══ MOBILE: dropdown becomes bottom sheet ═══ */
@media (max-width: 768px) {
  .sv5-ab-drop {
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    min-width: 100% !important;
    max-width: 100% !important;
    border-radius: 14px 14px 0 0 !important;
    padding: 16px 16px calc(16px + env(safe-area-inset-bottom)) !important;
    transform: translateY(100%) !important;
    z-index: 10001;
  }
  .sv5-ab-drop.sv5-ab-drop-show {
    transform: translateY(0) !important;
  }
  /* Grab handle at top */
  .sv5-ab-drop::before {
    content: '';
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 4px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 2px;
  }
  .sv5-ab-drop > *:first-child {
    margin-top: 8px;
  }
  .sv5-ab-drop-row {
    padding: 12px 10px;
    font-size: 14px;
  }
  .sv5-ab-drop-save {
    padding: 12px;
    font-size: 14px;
    margin-top: 4px;
  }

  /* Backdrop overlay on mobile when any drop is open */
  body:has(.sv5-ab-drop-show)::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
    pointer-events: none;
  }

  /* Toast position on mobile */
  .sv5-toast {
    bottom: 16px !important;
    padding: 10px 14px !important;
    font-size: 12px !important;
    max-width: calc(100vw - 32px) !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.95 — CABINET (player + rep) + PUBLIC PROFILE
   Binance-dark: #0B0E11 / #181A20 / #1E2329 / #2B2F36 / #474D57
   Amber accent #F0B90B, semantic: #0ECB81 green / #F6465D red
═══════════════════════════════════════════════════════════════════════ */

.sv5-cab {
  background: #0B0E11;
  min-height: calc(100vh - 200px);
  font-family: var(--font, 'Onest'), sans-serif;
  color: #EAECEF;
  padding: 20px 0 40px;
}
.sv5-cab-wrap {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 20px;
}

/* ═══ LOGIN WALL / ERROR ═══ */
.sv5-cab-login-wall {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  background: #0B0E11;
}
.sv5-cab-login-box {
  max-width: 440px;
  text-align: center;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: 40px 32px;
}
.sv5-cab-login-ico {
  color: #F0B90B;
  margin-bottom: 16px;
  display: inline-flex;
}
.sv5-cab-login-h {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: #EAECEF;
  margin: 0 0 10px;
  letter-spacing: -.01em;
}
.sv5-cab-login-p {
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.55;
  margin: 0 0 22px;
}
.sv5-cab-login-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}

/* ═══ MOBILE TOGGLE ═══ */
.sv5-cab-mob-toggle {
  display: none;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  color: #EAECEF;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  margin-bottom: 12px;
  width: 100%;
}

/* ═══ SIDEBAR ═══ */
.sv5-cab-side {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 0;
  align-self: flex-start;
  position: sticky;
  top: 90px;
}
.sv5-cab-profile {
  padding: 24px 18px 18px;
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.sv5-cab-av {
  position: relative;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, #F0B90B, #FCD535);
  color: #0B0E11;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 22px;
  font-weight: 900;
  margin-bottom: 10px;
  overflow: visible;
}
.sv5-cab-av img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.sv5-cab-av span { display: inline-block; }
.sv5-cab-av-v {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #0ECB81;
  border: 3px solid #181A20;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-cab-av-lg {
  width: 80px;
  height: 80px;
  font-size: 26px;
}
.sv5-cab-pname {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #EAECEF;
  letter-spacing: -.005em;
  margin-bottom: 2px;
}
.sv5-cab-pmail {
  font-size: 11px;
  color: #848E9C;
  word-break: break-all;
  margin-bottom: 10px;
}
.sv5-cab-pmeta {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}
.sv5-cab-pmeta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  color: #848E9C;
  padding: 3px 8px;
  background: rgba(255,255,255,.03);
  border-radius: 999px;
}

/* Rep-specific profile */
.sv5-cab-profile-rep { padding: 20px 16px; }
.sv5-cab-rep-logo {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: #2B2F36;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sv5-cab-rep-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.sv5-cab-rep-rating {
  display: inline-flex;
  align-items: baseline;
  padding: 6px 14px;
  background: rgba(240,185,11,.12);
  border: 1px solid rgba(240,185,11,.3);
  border-radius: 999px;
  margin-top: 10px;
}
.sv5-cab-rep-rating-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 18px;
  font-weight: 900;
  color: #F0B90B;
  font-variant-numeric: tabular-nums;
}
.sv5-cab-rep-rating-max {
  font-size: 10px;
  color: #848E9C;
  margin-left: 2px;
}

/* Nav */
.sv5-cab-nav {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.sv5-cab-nav-i {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #B7BDC6;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  transition: all .15s;
  position: relative;
}
.sv5-cab-nav-i:hover { background: rgba(255,255,255,.04); color: #EAECEF; }
.sv5-cab-nav-i.on {
  background: rgba(240,185,11,.1);
  color: #F0B90B;
  font-weight: 700;
}
.sv5-cab-nav-i.on svg { color: #F0B90B; }
.sv5-cab-nav-i svg { color: #848E9C; flex-shrink: 0; }
.sv5-cab-nav-i span { flex: 1; }
.sv5-cab-nav-bd {
  background: rgba(255,255,255,.08);
  color: #EAECEF;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
.sv5-cab-nav-bd-r {
  background: #F6465D;
  color: #fff;
}
.sv5-cab-nav-i.on .sv5-cab-nav-bd {
  background: rgba(240,185,11,.25);
  color: #F0B90B;
}
.sv5-cab-nav-div {
  height: 1px;
  background: rgba(255,255,255,.05);
  margin: 6px 0;
}
.sv5-cab-nav-logout {
  color: #848E9C !important;
}
.sv5-cab-nav-logout:hover {
  background: rgba(246,70,93,.08) !important;
  color: #F6465D !important;
}
.sv5-cab-nav-logout:hover svg { color: #F6465D; }

/* ═══ MAIN ═══ */
.sv5-cab-main { min-width: 0; }
.sv5-cab .sv5-cab-tab { display: none !important; }
.sv5-cab .sv5-cab-tab.on { display: block !important; }

.sv5-cab-tab-h {
  margin-bottom: 20px;
  position: relative;
}
.sv5-cab-tab-t {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 24px;
  font-weight: 800;
  color: #EAECEF;
  margin: 0 0 4px;
  letter-spacing: -.015em;
}
.sv5-cab-tab-s {
  font-size: 13px;
  color: #848E9C;
  margin: 0;
  line-height: 1.5;
}
.sv5-cab-tab-act {
  position: absolute;
  top: 0;
  right: 0;
}
.sv5-cab-tab-act-row {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}

/* ═══ STATS GRID ═══ */
.sv5-cab-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.sv5-cab-stat {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  padding: 16px;
  position: relative;
}
.sv5-cab-stat-ico {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}
.sv5-cab-stat-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 24px;
  font-weight: 900;
  color: #EAECEF;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
}
.sv5-cab-stat-v small {
  font-size: 12px;
  color: #848E9C;
  font-weight: 500;
  margin-left: 1px;
}
.sv5-cab-stat-l {
  font-size: 11px;
  color: #848E9C;
  margin-top: 4px;
  font-weight: 500;
}

/* ═══ PANEL ═══ */
.sv5-cab-panel {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  padding: 18px 20px;
  margin-bottom: 16px;
}
.sv5-cab-panel-nopad { padding: 0; overflow: hidden; }
.sv5-cab-panel-danger { border-color: rgba(246,70,93,.2); }
.sv5-cab-panel-warn { border-color: rgba(246,70,93,.3); background: rgba(246,70,93,.04); }
.sv5-cab-panel-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  gap: 10px;
  flex-wrap: wrap;
}
.sv5-cab-panel-nopad .sv5-cab-panel-h {
  padding: 16px 20px;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-panel-t {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: #EAECEF;
  margin: 0;
  letter-spacing: -.005em;
}
.sv5-cab-panel-a {
  font-size: 12px;
  color: #F0B90B;
  text-decoration: none;
  font-weight: 600;
}
.sv5-cab-panel-a:hover { color: #FCD535; }

/* ═══ QUICK ACTIONS ═══ */
.sv5-cab-qa {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.sv5-cab-qa-i {
  background: #1E2329;
  border: 1px solid rgba(255,255,255,.04);
  border-radius: 10px;
  padding: 14px;
  text-decoration: none;
  transition: all .18s;
}
.sv5-cab-qa-i:hover {
  background: #2B2F36;
  transform: translateY(-2px);
  border-color: rgba(240,185,11,.2);
}
.sv5-cab-qa-ico {
  margin-bottom: 8px;
}
.sv5-cab-qa-t {
  font-size: 13px;
  font-weight: 700;
  color: #EAECEF;
  margin-bottom: 2px;
}
.sv5-cab-qa-d {
  font-size: 11px;
  color: #848E9C;
}

/* ═══ NOTIFICATIONS ═══ */
.sv5-cab-notif-list {
  display: flex;
  flex-direction: column;
}
.sv5-cab-panel-nopad .sv5-cab-notif-list > .sv5-cab-notif:not(:last-child),
.sv5-cab-panel-nopad > .sv5-cab-notif:not(:last-child) {
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-notif {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 20px;
  position: relative;
  cursor: pointer;
  transition: background .15s;
}
.sv5-cab-notif:hover { background: rgba(255,255,255,.02); }
.sv5-cab-notif-new {
  background: rgba(240,185,11,.04);
}
.sv5-cab-notif-ico {
  width: 32px; height: 32px;
  border-radius: 8px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-cab-notif-ico-info    { background: rgba(56,97,251,.14); color: #3861FB; }
.sv5-cab-notif-ico-rating  { background: rgba(240,185,11,.14); color: #F0B90B; }
.sv5-cab-notif-ico-reply   { background: rgba(14,203,129,.14); color: #0ECB81; }
.sv5-cab-notif-ico-bonus   { background: rgba(108,92,231,.14); color: #6C5CE7; }
.sv5-cab-notif-body { flex: 1; min-width: 0; }
.sv5-cab-notif-t {
  font-size: 13px;
  font-weight: 700;
  color: #EAECEF;
  line-height: 1.35;
}
.sv5-cab-notif-d {
  font-size: 12px;
  color: #B7BDC6;
  line-height: 1.45;
  margin-top: 2px;
}
.sv5-cab-notif-tm {
  font-size: 10px;
  color: #848E9C;
  margin-top: 4px;
}
.sv5-cab-notif-tm a {
  color: #F0B90B;
  text-decoration: none;
  font-weight: 600;
}
.sv5-cab-notif-dot {
  width: 8px;
  height: 8px;
  background: #F6465D;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 6px;
}

/* ═══ FILTER TABS ═══ */
.sv5-cab-filter {
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.sv5-cab-filter-i {
  padding: 7px 14px;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  color: #B7BDC6;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  text-decoration: none;
}
.sv5-cab-filter-i:hover { background: #2B2F36; color: #EAECEF; }
.sv5-cab-filter-i.on {
  background: rgba(240,185,11,.14);
  border-color: rgba(240,185,11,.4);
  color: #F0B90B;
}

/* ═══ REVIEW CARDS (cabinet) ═══ */
.sv5-cab-rev {
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-rev:last-child { border-bottom: none; }
.sv5-cab-rev-hd {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 10px;
}
.sv5-cab-rev-lg {
  width: 38px; height: 38px;
  border-radius: 8px;
  background: #2B2F36;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.sv5-cab-rev-lg img { max-width: 28px; max-height: 28px; object-fit: contain; }
.sv5-cab-rev-hi { flex: 1; min-width: 0; }
.sv5-cab-rev-cn {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}
.sv5-cab-rev-cn a,
.sv5-cab-rev-cn span {
  font-size: 14px;
  font-weight: 700;
  color: #EAECEF;
  text-decoration: none;
}
.sv5-cab-rev-cn a:hover { color: #F0B90B; }
.sv5-cab-rev-st {
  font-size: 9px;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.sv5-cab-rev-st-g { background: rgba(14,203,129,.14); color: #0ECB81; }
.sv5-cab-rev-st-a { background: rgba(240,185,11,.14); color: #F0B90B; }
.sv5-cab-rev-st-r { background: rgba(246,70,93,.14); color: #F6465D; }
.sv5-cab-rev-st-n { background: rgba(132,142,156,.14); color: #848E9C; }
.sv5-cab-rev-mt {
  display: flex;
  gap: 12px;
  font-size: 11px;
  color: #848E9C;
  flex-wrap: wrap;
}
.sv5-cab-rev-mt span { display: inline-flex; align-items: center; gap: 3px; }
.sv5-cab-rev-mt-g { color: #0ECB81 !important; font-weight: 600; }
.sv5-cab-rev-txt {
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.55;
  margin-bottom: 10px;
}
.sv5-cab-rev-act {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-cab-rev-btn {
  padding: 5px 12px;
  background: #2B2F36;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #B7BDC6;
  cursor: pointer;
  text-decoration: none;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: all .15s;
}
.sv5-cab-rev-btn:hover {
  background: #363B44;
  color: #EAECEF;
  border-color: rgba(255,255,255,.12);
}
.sv5-cab-rev-btn-r:hover {
  background: rgba(246,70,93,.14);
  border-color: rgba(246,70,93,.3);
  color: #F6465D;
}

/* ═══ WATCHLIST TABLE ═══ */
.sv5-cab-wl-hd,
.sv5-cab-wl-row {
  display: grid;
  grid-template-columns: 2.5fr 80px 100px 90px 140px;
  gap: 12px;
  align-items: center;
  padding: 12px 20px;
}
.sv5-cab-wl-hd {
  font-size: 10px;
  color: #848E9C;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-wl-row {
  border-bottom: 1px solid rgba(255,255,255,.03);
  transition: background .15s;
}
.sv5-cab-wl-row:last-child { border-bottom: none; }
.sv5-cab-wl-row:hover { background: rgba(255,255,255,.02); }
.sv5-cab-wl-cn {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
}
.sv5-cab-wl-cn > :first-child {
  width: 32px; height: 32px;
  border-radius: 6px;
  background: #2B2F36;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sv5-cab-wl-cn > :first-child img { max-width: 24px; max-height: 24px; object-fit: contain; }
.sv5-cab-wl-n {
  font-size: 13px;
  font-weight: 700;
  color: #EAECEF;
  text-decoration: none;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sv5-cab-wl-n:hover { color: #F0B90B; }
.sv5-cab-wl-dm {
  font-size: 10px;
  color: #848E9C;
  margin-top: 1px;
}
.sv5-cab-wl-r {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: #F0B90B;
  font-variant-numeric: tabular-nums;
}
.sv5-cab-wl-r span { color: #848E9C; font-size: 10px; font-weight: 500; }
.sv5-cab-wl-t { font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.sv5-cab-wl-trd-up { color: #0ECB81; display: inline-flex; align-items: center; gap: 3px; }
.sv5-cab-wl-trd-dn { color: #F6465D; display: inline-flex; align-items: center; gap: 3px; }
.sv5-cab-wl-trd-flat { color: #848E9C; }
.sv5-cab-wl-m { font-size: 11px; color: #848E9C; }
.sv5-cab-wl-act { display: flex; gap: 6px; align-items: center; }

/* ═══ COMPARE TABLE ═══ */
.sv5-cab-cmp-wrap {
  overflow-x: auto;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
}
.sv5-cab-cmp {
  width: 100%;
  border-collapse: collapse;
  min-width: 600px;
}
.sv5-cab-cmp th,
.sv5-cab-cmp td {
  padding: 14px 16px;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-cmp th { background: #1E2329; }
.sv5-cab-cmp th:first-child { width: 160px; }
.sv5-cab-cmp-ch {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
  position: relative;
}
.sv5-cab-cmp-ch a {
  font-size: 13px;
  font-weight: 700;
  color: #EAECEF;
  text-decoration: none;
}
.sv5-cab-cmp-ch > :first-child {
  width: 40px; height: 40px;
  border-radius: 8px;
  background: #2B2F36;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sv5-cab-cmp-rm {
  position: absolute;
  top: 0;
  right: 0;
  background: transparent;
  border: none;
  color: #848E9C;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
}
.sv5-cab-cmp-rm:hover { background: rgba(246,70,93,.14); color: #F6465D; }
.sv5-cab-cmp-l {
  font-size: 11px;
  color: #848E9C;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.sv5-cab-cmp td:not(.sv5-cab-cmp-l) {
  font-size: 13px;
  color: #EAECEF;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* ═══ FORMS ═══ */
.sv5-cab-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sv5-cab-field { display: flex; flex-direction: column; gap: 6px; }
.sv5-cab-field-indent { padding-left: 48px; }
.sv5-cab-field label {
  font-size: 12px;
  color: #B7BDC6;
  font-weight: 600;
}
.sv5-cab-field label small {
  color: #848E9C;
  font-weight: 400;
  font-size: 11px;
}
.sv5-cab-field input[type="text"],
.sv5-cab-field input[type="email"],
.sv5-cab-field input[type="password"],
.sv5-cab-field textarea,
.sv5-cab-field select {
  background: #0B0E11;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  color: #EAECEF;
  padding: 10px 12px;
  font-size: 13px;
  font-family: inherit;
  transition: border-color .15s;
}
.sv5-cab-field input:focus,
.sv5-cab-field textarea:focus,
.sv5-cab-field select:focus {
  outline: none;
  border-color: #F0B90B;
}
.sv5-cab-field input:disabled,
.sv5-cab-field textarea:disabled {
  background: #181A20;
  color: #848E9C;
  cursor: not-allowed;
}
.sv5-cab-form-foot {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}

/* Avatar edit */
.sv5-cab-av-edit {
  display: flex;
  gap: 14px;
  align-items: center;
}

/* Public link */
.sv5-cab-pub-link {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  background: #0B0E11;
  border-radius: 8px;
  flex-wrap: wrap;
}
.sv5-cab-pub-link code {
  font-family: var(--font-mono, 'JetBrains Mono'), monospace;
  font-size: 11px;
  color: #848E9C;
  background: transparent;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sv5-cab-pub-link a {
  font-size: 12px;
  color: #F0B90B;
  text-decoration: none;
  font-weight: 600;
  white-space: nowrap;
}

/* Toggle switch */
.sv5-cab-toggle {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 14px;
  align-items: center;
  padding: 12px 14px;
  background: #1E2329;
  border-radius: 10px;
  cursor: pointer;
}
.sv5-cab-toggle-ro { cursor: default; opacity: .7; }
.sv5-cab-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.sv5-cab-toggle-sw {
  position: relative;
  width: 36px;
  height: 20px;
  background: #2B2F36;
  border-radius: 999px;
  transition: background .2s;
}
.sv5-cab-toggle-sw::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background: #EAECEF;
  border-radius: 50%;
  transition: transform .2s;
}
.sv5-cab-toggle input:checked ~ .sv5-cab-toggle-sw {
  background: #F0B90B;
}
.sv5-cab-toggle input:checked ~ .sv5-cab-toggle-sw::after {
  transform: translateX(16px);
  background: #0B0E11;
}
.sv5-cab-toggle-info { min-width: 0; }
.sv5-cab-toggle-t {
  font-size: 13px;
  font-weight: 700;
  color: #EAECEF;
}
.sv5-cab-toggle-t small { font-weight: 400; color: #848E9C; font-size: 11px; }
.sv5-cab-toggle-d {
  font-size: 11px;
  color: #848E9C;
  margin-top: 2px;
  line-height: 1.4;
}

/* Sessions */
.sv5-cab-sess {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sv5-cab-sess-i {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  background: #1E2329;
  border-radius: 8px;
}
.sv5-cab-sess-cur {
  border: 1px solid rgba(14,203,129,.3);
  background: rgba(14,203,129,.04);
}
.sv5-cab-sess-ico {
  width: 32px; height: 32px;
  background: #2B2F36;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #848E9C;
}
.sv5-cab-sess-cur .sv5-cab-sess-ico { color: #0ECB81; background: rgba(14,203,129,.14); }
.sv5-cab-sess-t { font-size: 13px; font-weight: 700; color: #EAECEF; }
.sv5-cab-sess-d { font-size: 11px; color: #848E9C; margin-top: 2px; }
.sv5-cab-sess-cur-lbl {
  display: inline-block;
  font-size: 9px;
  font-weight: 800;
  color: #0ECB81;
  background: rgba(14,203,129,.14);
  padding: 2px 7px;
  border-radius: 4px;
  margin-left: 6px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* Danger row */
.sv5-cab-danger-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.sv5-cab-danger-t { font-size: 13px; font-weight: 700; color: #EAECEF; }
.sv5-cab-danger-d { font-size: 11px; color: #848E9C; margin-top: 4px; }

/* ═══ BUTTONS ═══ */
.sv5-cab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 16px;
  background: #2B2F36;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  color: #EAECEF;
  cursor: pointer;
  text-decoration: none;
  font-family: inherit;
  transition: all .15s;
  white-space: nowrap;
}
.sv5-cab-btn:hover { background: #363B44; }
.sv5-cab-btn-primary {
  background: #F0B90B;
  color: #0B0E11;
  border-color: transparent;
}
.sv5-cab-btn-primary:hover { background: #FCD535; }
.sv5-cab-btn-outline {
  background: transparent;
  border-color: rgba(255,255,255,.12);
  color: #B7BDC6;
}
.sv5-cab-btn-outline:hover { background: rgba(255,255,255,.04); color: #EAECEF; }
.sv5-cab-btn-ghost {
  background: transparent;
  border-color: transparent;
  color: #848E9C;
}
.sv5-cab-btn-ghost:hover { background: rgba(255,255,255,.04); color: #B7BDC6; }
.sv5-cab-btn-danger {
  background: rgba(246,70,93,.14);
  border-color: rgba(246,70,93,.3);
  color: #F6465D;
}
.sv5-cab-btn-danger:hover { background: rgba(246,70,93,.22); color: #FF5A6F; }
.sv5-cab-btn-r { margin-left: auto; }

/* ═══ EMPTY STATE ═══ */
.sv5-cab-empty {
  padding: 60px 20px;
  text-align: center;
  color: #848E9C;
}
.sv5-cab-empty svg { color: #474D57; margin-bottom: 16px; }
.sv5-cab-empty h3 {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 16px;
  color: #EAECEF;
  margin: 0 0 6px;
  font-weight: 700;
}
.sv5-cab-empty p {
  font-size: 13px;
  margin: 0 0 16px;
  line-height: 1.5;
}

/* Hide on mobile helper */
.sv5-cab-hide-mob {}

/* ═══ REP CABINET-SPECIFIC ═══ */
.sv5-cab-warn-list { display: flex; flex-direction: column; gap: 10px; }
.sv5-cab-warn-i {
  padding: 14px 16px;
  background: rgba(246,70,93,.08);
  border-radius: 8px;
  border-left: 3px solid #F6465D;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.sv5-cab-warn-t { font-size: 13px; font-weight: 700; color: #F6465D; }
.sv5-cab-warn-d { font-size: 11px; color: #B7BDC6; margin-top: 2px; flex: 1; }

.sv5-cab-rep-week { display: flex; flex-direction: column; gap: 10px; }
.sv5-cab-rep-week-i {
  display: grid;
  grid-template-columns: 40px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  background: #1E2329;
  border-radius: 8px;
}
.sv5-cab-rep-week-r {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 18px;
  font-weight: 900;
  text-align: center;
}
.sv5-cab-rep-week-a { font-size: 12px; font-weight: 700; color: #EAECEF; }
.sv5-cab-rep-week-d { font-size: 11px; color: #848E9C; margin-top: 2px; line-height: 1.4; }
.sv5-cab-rep-week-t { font-size: 10px; color: #848E9C; white-space: nowrap; }
.sv5-cab-rep-week-avg { font-size: 11px; color: #848E9C; }
.sv5-cab-rep-week-avg strong { color: #F0B90B; }

/* Rep review list */
.sv5-cab-rep-rev {
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-rep-rev:last-child { border-bottom: none; }
.sv5-cab-rep-rev-hd {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 10px;
}
.sv5-cab-rep-rev-av {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: #2B2F36;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
  color: #848E9C;
  flex-shrink: 0;
}
.sv5-cab-rep-rev-hi { flex: 1; min-width: 0; }
.sv5-cab-rep-rev-n {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 14px;
  font-weight: 700;
  color: #EAECEF;
  margin-bottom: 2px;
}
.sv5-cab-rep-rev-sc {
  font-size: 10px;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 4px;
}
.sv5-cab-rep-rev-sc-g { background: rgba(14,203,129,.14); color: #0ECB81; }
.sv5-cab-rep-rev-sc-a { background: rgba(240,185,11,.14); color: #F0B90B; }
.sv5-cab-rep-rev-sc-r { background: rgba(246,70,93,.14); color: #F6465D; }
.sv5-cab-rep-rev-mt {
  display: flex;
  gap: 10px;
  font-size: 11px;
  color: #848E9C;
  flex-wrap: wrap;
}
.sv5-cab-rep-rev-neg {
  color: #F6465D !important;
  font-weight: 700;
}
.sv5-cab-rep-rev-txt {
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.55;
  margin-bottom: 10px;
}
.sv5-cab-rep-rev-reply {
  margin-top: 10px;
  padding: 10px 12px;
  background: rgba(240,185,11,.06);
  border-left: 2px solid #F0B90B;
  border-radius: 0 8px 8px 0;
}
.sv5-cab-rep-rev-reply-h {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: #F0B90B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 4px;
}
.sv5-cab-rep-rev-reply-t {
  font-size: 12px;
  color: #EAECEF;
  line-height: 1.55;
}
.sv5-cab-rep-rev-form {
  margin-top: 10px;
  padding: 12px;
  background: #1E2329;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sv5-cab-rep-rev-form textarea {
  background: #0B0E11;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 6px;
  color: #EAECEF;
  padding: 10px 12px;
  font-size: 12px;
  resize: vertical;
  font-family: inherit;
}
.sv5-cab-rep-rev-form-foot {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sv5-cab-rep-rev-dispute {
  margin-top: 8px;
  padding: 8px 12px;
  background: rgba(240,185,11,.06);
  border-radius: 6px;
  font-size: 11px;
  color: #B7BDC6;
}

/* Rep disputes */
.sv5-cab-rep-dispute {
  padding: 16px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-cab-rep-dispute:last-child { border-bottom: none; }
.sv5-cab-rep-dispute-hd {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  gap: 10px;
  flex-wrap: wrap;
}
.sv5-cab-rep-dispute-n { font-size: 13px; font-weight: 700; color: #EAECEF; }
.sv5-cab-rep-dispute-d { font-size: 11px; color: #848E9C; margin-top: 2px; }
.sv5-cab-rep-dispute-orig,
.sv5-cab-rep-dispute-reason {
  font-size: 12px;
  color: #B7BDC6;
  line-height: 1.55;
  padding: 8px 12px;
  background: #1E2329;
  border-radius: 6px;
  margin-bottom: 6px;
}
.sv5-cab-rep-dispute-orig strong,
.sv5-cab-rep-dispute-reason strong { color: #EAECEF; }

/* Rep content info */
.sv5-cab-rep-info {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.sv5-cab-rep-info-i {
  padding: 10px 12px;
  background: #1E2329;
  border-radius: 8px;
}
.sv5-cab-rep-info-l {
  font-size: 10px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 700;
  margin-bottom: 4px;
}
.sv5-cab-rep-info-v { font-size: 13px; color: #EAECEF; font-weight: 600; }

/* Rep bonuses */
.sv5-cab-rep-bonuses {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
}
.sv5-cab-rep-bonus {
  padding: 12px 14px;
  background: rgba(240,185,11,.06);
  border: 1px solid rgba(240,185,11,.15);
  border-radius: 8px;
}
.sv5-cab-rep-bonus-t { font-size: 11px; color: #848E9C; margin-bottom: 4px; }
.sv5-cab-rep-bonus-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: #F0B90B;
}

/* Analytics chart placeholder */
.sv5-cab-chart-placeholder {
  padding: 16px 0 0;
}
.sv5-cab-chart-note {
  font-size: 11px;
  color: #848E9C;
  text-align: center;
  margin-top: 10px;
}

/* Sentiment bars */
.sv5-cab-sent { display: flex; flex-direction: column; gap: 10px; }
.sv5-cab-sent-r {
  display: grid;
  grid-template-columns: 100px 1fr 40px;
  gap: 12px;
  align-items: center;
}
.sv5-cab-sent-l { font-size: 12px; color: #B7BDC6; font-weight: 600; }
.sv5-cab-sent-bar {
  height: 6px;
  background: #2B2F36;
  border-radius: 3px;
  overflow: hidden;
}
.sv5-cab-sent-bar-f { height: 100%; border-radius: 3px; transition: width .4s; }
.sv5-cab-sent-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 13px;
  font-weight: 800;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* ═══ PUBLIC PROFILE (pp) ═══ */
.sv5-pp {
  background: #0B0E11;
  min-height: calc(100vh - 200px);
  font-family: var(--font, 'Onest'), sans-serif;
  color: #EAECEF;
  padding: 30px 0 60px;
}
.sv5-pp-wrap {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 20px;
}

.sv5-pp-hero {
  display: flex;
  gap: 24px;
  align-items: center;
  padding: 24px;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  margin-bottom: 16px;
}
.sv5-pp-av {
  position: relative;
  width: 96px; height: 96px;
  border-radius: 50%;
  background: linear-gradient(135deg, #F0B90B, #FCD535);
  color: #0B0E11;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 32px;
  font-weight: 900;
  flex-shrink: 0;
}
.sv5-pp-av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.sv5-pp-av-v {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #0ECB81;
  border: 3px solid #181A20;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sv5-pp-hi { flex: 1; min-width: 0; }
.sv5-pp-name-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.sv5-pp-n {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 24px;
  font-weight: 800;
  color: #EAECEF;
  margin: 0;
  letter-spacing: -.01em;
}
.sv5-pp-tier {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 10px;
  border: 1px solid;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.sv5-pp-meta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.sv5-pp-meta span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: #848E9C;
}
.sv5-pp-meta svg { color: #848E9C; }
.sv5-pp-bio {
  font-size: 12px;
  color: #B7BDC6;
  line-height: 1.55;
  margin: 10px 0 0;
}

.sv5-pp-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 16px;
}
.sv5-pp-stat {
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  padding: 16px;
  text-align: center;
}
.sv5-pp-stat-v {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 22px;
  font-weight: 900;
  color: #F0B90B;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.sv5-pp-stat-v small { font-size: 11px; color: #848E9C; font-weight: 500; }
.sv5-pp-stat-l {
  font-size: 10px;
  color: #848E9C;
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 700;
}

/* Achievements grid */
.sv5-pp-ach {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
}
.sv5-pp-ach-i {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  background: #1E2329;
  border: 1px solid rgba(255,255,255,.04);
  border-left: 3px solid var(--ach-c, #F0B90B);
  border-radius: 8px;
}
.sv5-pp-ach-ico {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--ach-c, #F0B90B) 15%, transparent);
  color: var(--ach-c, #F0B90B);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-pp-ach-t { font-size: 12px; font-weight: 700; color: #EAECEF; line-height: 1.35; }

/* Public reviews */
.sv5-pp-rev {
  padding: 16px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.sv5-pp-rev:last-child { border-bottom: none; }
.sv5-pp-rev-hd {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.sv5-pp-rev-lg {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: #2B2F36;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.sv5-pp-rev-lg img { max-width: 26px; max-height: 26px; object-fit: contain; }
.sv5-pp-rev-hi { flex: 1; min-width: 0; }
.sv5-pp-rev-cn {
  font-size: 14px;
  font-weight: 700;
  color: #EAECEF;
  text-decoration: none;
}
.sv5-pp-rev-cn:hover { color: #F0B90B; }
.sv5-pp-rev-d { font-size: 11px; color: #848E9C; margin-top: 2px; }
.sv5-pp-rev-sc {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 16px;
  font-weight: 900;
  padding: 6px 12px;
  border: 1px solid;
  border-radius: 8px;
  font-variant-numeric: tabular-nums;
}
.sv5-pp-rev-sc small { font-size: 10px; color: #848E9C; font-weight: 500; }
.sv5-pp-rev-txt {
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.55;
  margin: 0;
}
.sv5-pp-rev-foot {
  margin-top: 10px;
  display: flex;
  gap: 14px;
  font-size: 11px;
  color: #848E9C;
}
.sv5-pp-rev-foot span { display: inline-flex; align-items: center; gap: 4px; }

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE — Cabinet + Public Profile
═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .sv5-cab {
    padding: 12px 0 30px;
  }
  .sv5-cab-wrap {
    grid-template-columns: 1fr;
    padding: 0 12px;
    gap: 12px;
  }
  .sv5-cab-mob-toggle { display: flex; }
  .sv5-cab-side {
    position: static;
    display: none;
  }
  .sv5-cab-mob-toggle[aria-expanded="true"] ~ .sv5-cab-side {
    display: block;
  }

  .sv5-cab-tab-t { font-size: 20px; }
  .sv5-cab-tab-s { font-size: 12px; }
  .sv5-cab-tab-act { position: static; margin-top: 10px; width: 100%; }

  .sv5-cab-stats { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .sv5-cab-stat { padding: 12px; }
  .sv5-cab-stat-v { font-size: 20px; }

  .sv5-cab-panel { padding: 14px; }
  .sv5-cab-panel-nopad { padding: 0; }
  .sv5-cab-panel-nopad .sv5-cab-panel-h { padding: 14px; }
  .sv5-cab-panel-t { font-size: 13px; }

  .sv5-cab-qa { grid-template-columns: repeat(2, 1fr); }

  .sv5-cab-wl-hd { display: none; }
  .sv5-cab-wl-row { grid-template-columns: 1fr auto; padding: 12px 14px; }
  .sv5-cab-hide-mob { display: none !important; }

  .sv5-cab-field-indent { padding-left: 0; }
  .sv5-cab-form-foot { flex-direction: column; }
  .sv5-cab-form-foot .sv5-cab-btn { width: 100%; }

  .sv5-cab-av-edit { flex-direction: column; align-items: flex-start; }

  .sv5-cab-rev,
  .sv5-cab-rep-rev {
    padding: 14px;
  }
  .sv5-cab-rev-mt { gap: 8px; font-size: 10px; }

  /* Rep */
  .sv5-cab-rep-info { grid-template-columns: 1fr; }

  /* Sentiment bars */
  .sv5-cab-sent-r { grid-template-columns: 80px 1fr 34px; gap: 8px; }

  /* Public profile */
  .sv5-pp-hero {
    flex-direction: column;
    text-align: center;
    padding: 20px 16px;
  }
  .sv5-pp-meta { justify-content: center; }
  .sv5-pp-name-row { justify-content: center; }
  .sv5-pp-n { font-size: 20px; }
  .sv5-pp-av { width: 80px; height: 80px; font-size: 26px; }
  .sv5-pp-stats { grid-template-columns: repeat(2, 1fr); }
  .sv5-pp-rev-hd { flex-wrap: wrap; }
  .sv5-pp-rev-sc { font-size: 14px; padding: 4px 10px; }

  /* Compare table scrolls */
  .sv5-cab-cmp { min-width: 500px; }

  /* Warn panel stacked */
  .sv5-cab-warn-i { flex-direction: column; align-items: flex-start; }

  /* Rep week row */
  .sv5-cab-rep-week-i { grid-template-columns: 32px 1fr; }
  .sv5-cab-rep-week-t { grid-column: 2; font-size: 9px; }

  /* Danger row stacked */
  .sv5-cab-danger-row { flex-direction: column; align-items: stretch; }
  .sv5-cab-danger-row .sv5-cab-btn { width: 100%; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v1.6.98 — AUTH PAGE (login + register: player + rep)
═══════════════════════════════════════════════════════════════════════ */

.sv5-auth {
  background: #0B0E11;
  min-height: calc(100vh - 140px);
  display: flex;
  align-items: center;
  padding: 30px 20px;
  font-family: var(--font, 'Onest'), sans-serif;
  color: #EAECEF;
}
.sv5-auth-wrap {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  background: #181A20;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  min-height: 560px;
}

/* ─── Benefits (left) ─── */
.sv5-auth-benefits {
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  background:
    radial-gradient(circle at 20% 0%, rgba(240,185,11,.08), transparent 50%),
    radial-gradient(circle at 80% 100%, rgba(56,97,251,.06), transparent 50%),
    #181A20;
  border-right: 1px solid rgba(255,255,255,.04);
}
.sv5-auth-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.sv5-auth-logo-sq {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  background: #F0B90B;
  color: #0B0E11;
  border-radius: 10px;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -.02em;
}
.sv5-auth-logo-t {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #EAECEF;
  letter-spacing: -.01em;
}
.sv5-auth-h1 {
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-size: 26px;
  font-weight: 800;
  color: #EAECEF;
  line-height: 1.2;
  letter-spacing: -.02em;
  margin: 0;
}
.sv5-auth-sub {
  font-size: 13px;
  color: #B7BDC6;
  line-height: 1.6;
  margin: 0;
}
.sv5-auth-sub strong { color: #F0B90B; font-weight: 800; }

.sv5-auth-ben-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sv5-auth-ben {
  display: flex;
  align-items: center;
  gap: 12px;
}
.sv5-auth-ben-ico {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sv5-auth-ben-t {
  font-size: 13px;
  font-weight: 700;
  color: #EAECEF;
}
.sv5-auth-ben-d {
  font-size: 11px;
  color: #848E9C;
  margin-top: 1px;
  line-height: 1.4;
}

/* ─── Form (right) ─── */
.sv5-auth-form-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 36px;
}
.sv5-auth-form-box {
  width: 100%;
  max-width: 340px;
}

.sv5-auth-logo-mob {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  margin-bottom: 20px;
}
.sv5-auth-logo-mob .sv5-auth-logo-sq {
  width: 28px; height: 28px;
  font-size: 11px;
  border-radius: 8px;
}
.sv5-auth-logo-mob .sv5-auth-logo-t { font-size: 13px; }

/* Mode toggle */
.sv5-auth-mode {
  display: flex;
  background: #0B0E11;
  border-radius: 8px;
  padding: 4px;
  margin-bottom: 20px;
  gap: 0;
}
.sv5-auth-mode-i {
  flex: 1;
  padding: 10px 12px;
  text-align: center;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  color: #848E9C;
  border-radius: 6px;
  transition: all .18s;
}
.sv5-auth-mode-i.on {
  background: #F0B90B;
  color: #0B0E11;
  font-weight: 800;
}

/* Role tabs (register) */
.sv5-auth-role {
  display: flex;
  gap: 6px;
  margin-bottom: 18px;
}
.sv5-auth-role-i {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 10px;
  background: #2B2F36;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  color: #B7BDC6;
  text-decoration: none;
  transition: all .15s;
}
.sv5-auth-role-i:hover { background: #363B44; color: #EAECEF; }
.sv5-auth-role-i.on {
  background: rgba(240,185,11,.1);
  border-color: rgba(240,185,11,.4);
  color: #F0B90B;
  font-weight: 700;
}
.sv5-auth-role-i.on svg { color: #F0B90B; }

/* Alerts */
.sv5-auth-alert {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 16px;
}
.sv5-auth-alert svg { flex-shrink: 0; margin-top: 1px; }
.sv5-auth-alert-success {
  background: rgba(14,203,129,.08);
  border: 1px solid rgba(14,203,129,.25);
  color: #0ECB81;
}
.sv5-auth-alert-error {
  background: rgba(246,70,93,.08);
  border: 1px solid rgba(246,70,93,.25);
  color: #F6465D;
}

.sv5-auth-notice {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  background: rgba(56,97,251,.08);
  border: 1px solid rgba(56,97,251,.2);
  border-radius: 8px;
  font-size: 11px;
  color: #B7BDC6;
  line-height: 1.5;
  margin-bottom: 14px;
}
.sv5-auth-notice svg { color: #3861FB; flex-shrink: 0; margin-top: 1px; }

/* Form */
.sv5-auth-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sv5-auth-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.sv5-auth-field label {
  font-size: 11px;
  color: #B7BDC6;
  font-weight: 600;
}
.sv5-auth-field label small {
  color: #848E9C;
  font-weight: 400;
  font-size: 10px;
  margin-left: 2px;
}
.sv5-auth-field input,
.sv5-auth-field select {
  background: #0B0E11;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  color: #EAECEF;
  padding: 11px 12px;
  font-size: 13px;
  font-family: inherit;
  transition: border-color .15s;
}
.sv5-auth-field input:focus,
.sv5-auth-field select:focus {
  outline: none;
  border-color: #F0B90B;
}
.sv5-auth-field input::placeholder { color: #5E6673; }

.sv5-auth-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  gap: 10px;
  flex-wrap: wrap;
}
.sv5-auth-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  color: #B7BDC6;
  font-size: 12px;
}
.sv5-auth-check input { accent-color: #F0B90B; cursor: pointer; }
.sv5-auth-check-block {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.5;
  font-size: 11px;
  padding: 6px 0;
}
.sv5-auth-check-block input { margin-top: 3px; flex-shrink: 0; }
.sv5-auth-check-block a {
  color: #F0B90B;
  text-decoration: none;
}
.sv5-auth-check-block a:hover { text-decoration: underline; }

.sv5-auth-link {
  color: #F0B90B;
  text-decoration: none;
  font-weight: 600;
  font-size: 12px;
}
.sv5-auth-link:hover { color: #FCD535; }

.sv5-auth-btn {
  background: #F0B90B;
  color: #0B0E11;
  border: none;
  border-radius: 8px;
  padding: 12px;
  font-family: var(--font-display, 'Unbounded'), sans-serif;
  font-weight: 800;
  font-size: 13px;
  cursor: pointer;
  transition: background .15s;
  letter-spacing: -.005em;
  margin-top: 4px;
}
.sv5-auth-btn:hover { background: #FCD535; }
.sv5-auth-btn:active { transform: scale(.98); }

/* Divider */
.sv5-auth-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 14px;
}
.sv5-auth-divider::before,
.sv5-auth-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(255,255,255,.06);
}
.sv5-auth-divider span {
  font-size: 10px;
  color: #848E9C;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 600;
}

/* Social */
.sv5-auth-social {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.sv5-auth-social-i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 6px;
  background: #2B2F36;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
  color: #EAECEF;
  cursor: pointer;
  transition: all .15s;
  font-family: inherit;
}
.sv5-auth-social-i:hover {
  background: #363B44;
  border-color: rgba(255,255,255,.12);
}

/* Footer switch */
.sv5-auth-switch {
  text-align: center;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.05);
  font-size: 12px;
  color: #848E9C;
}
.sv5-auth-switch a {
  color: #F0B90B;
  text-decoration: none;
  font-weight: 700;
  margin-left: 4px;
}
.sv5-auth-switch a:hover { color: #FCD535; }

/* ═══ MOBILE ═══ */
@media (max-width: 820px) {
  .sv5-auth { padding: 16px; }
  .sv5-auth-wrap {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .sv5-auth-benefits { display: none; }
  .sv5-auth-form-wrap {
    padding: 24px 20px;
  }
  .sv5-auth-logo-mob { display: inline-flex; }
  .sv5-auth-form-box { max-width: 100%; }
}