/* ===================================================
   PG Slot Thai — Luxury Dark Blue Gold Theme
   : #0b0e1a bg / #111422 header / #c9a84c gold accent
   : Roboto (Google)
   =================================================== */

:root {
  --bg:        #0b0e1a;
  --bg-header: #0d1020;
  --bg-card:   #141726;
  --bg-card2:  #1a1e30;
  --bg-widget: #111422;
  --red:       #c9a84c;
  --red-h:     #e8c96a;
  --green:     #2ecc71;
  --amber:     #f39c12;
  --grey:      #7f8c8d;
  --text:      #f0ead6;
  --text-muted:#9a94a8;
  --border:    rgba(201,168,76,0.15);
  --radius:    8px;
  --font:      'Noto Sans Thai','Sarabun','Roboto',sans-serif;
  --gold:      #c9a84c;
  --gold-h:    #e8c96a;
  --gold-dim:  rgba(201,168,76,0.12);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); background-image: radial-gradient(ellipse at 20% 50%, rgba(201,168,76,0.04) 0%, transparent 60%), radial-gradient(ellipse at 80% 20%, rgba(100,80,200,0.06) 0%, transparent 50%); color: var(--text); font-family: var(--font); font-size: 15px; line-height: 1.6; overflow-x: hidden; padding-top: 58px; }
a { color: var(--gold); text-decoration: none; transition: color .15s; }
a:hover { color: var(--gold-h); }
img { max-width: 100%; height: auto; display: block; }

/* ── CONTAINER ── */
.mq-container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }

/* ── HEADER ── */
.mq-header { background: linear-gradient(135deg, #0d1020 0%, #131628 100%); border-bottom: 1px solid rgba(201,168,76,0.4); box-shadow: 0 2px 20px rgba(0,0,0,0.5); position: fixed; top: 0; left: 0; right: 0; z-index: 100; }
.wv-header-logo-nav { display: flex; align-items: center; height: 58px; gap: 16px; }
.mq-header-image-link { flex-shrink: 0; display: flex; align-items: center; gap: 8px; }
.mq-header-image { width: 36px; height: 36px; border-radius: 4px; }
.site-logo-text { font-size: 18px; font-weight: 900; background: linear-gradient(135deg, #e8c96a, #c9a84c); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; white-space: nowrap; max-width: 200px; overflow: hidden; text-overflow: ellipsis; display: inline-block; }
.site-logo-text span { color: var(--gold); }

/* nav */
.mq-main-nav-wrap { flex: 1; display: flex; align-items: center; justify-content: space-between; }
.mq-navigation ul { display: flex; list-style: none; gap: 2px; }
.mq-navigation > ul > li { position: relative; }
.mq-navigation a { color: #ccc; padding: 6px 12px; border-radius: 4px; font-size: 13px; font-weight: 600; display: block; white-space: nowrap; }
.mq-navigation a:hover { color: #fff; background: rgba(255,255,255,.06); }
/* dropdown */
.mq-navigation .sub-menu { display: none; position: absolute; top: 100%; left: 0; background: #1a1a1a; border: 1px solid var(--border); border-radius: var(--radius); min-width: 180px; z-index: 200; padding: 4px 0; }
.mq-navigation li:hover > .sub-menu { display: block; }
.mq-navigation .sub-menu a { padding: 8px 14px; font-size: 13px; border-radius: 0; }
.mq-navigation .sub-menu a:hover { background: rgba(221,51,51,.15); color: var(--red); }

/* header CTA */
.wv-auth-menu-item { display: flex; gap: 8px; flex-shrink: 0; align-items: center; }
.wv-nav-cta,
.wv-auth-menu-item .wv-play-cta { background: linear-gradient(135deg, #c9a84c, #a07830); color: #1a1200; border: none; border-radius: 20px; padding: 7px 16px; font-size: 13px; font-weight: 800; display: inline-block; white-space: nowrap; box-shadow: 0 2px 10px rgba(201,168,76,0.3); }
.wv-nav-cta:hover,
.wv-auth-menu-item .wv-play-cta:hover { background: linear-gradient(135deg, #e8c96a, #c9a84c); color: #1a1200; }
.wv-auth-btn { padding: 6px 16px; border-radius: 20px; font-size: 12px; font-weight: 700; }
.wv-auth-login  { border: 1px solid rgba(255,255,255,.2); color: #ccc; }
.wv-auth-login:hover { color: #fff; border-color: #fff; }
.wv-auth-register { background: var(--red); color: #fff !important; }
.wv-auth-register:hover { background: var(--red-h); }

/* mobile hamburger */
#mobile-menu-button { display: none; cursor: pointer; padding: 6px; }
.hamburger-line { display: block; width: 22px; height: 2px; background: #fff; margin: 5px 0; transition: .3s; }

/* mobile nav overlay */
.mq-mobile-nav { display: none; position: fixed; top: 58px; left: 0; right: 0; bottom: 0; background: #0d0d0d; z-index: 99; overflow-y: auto; padding: 8px 16px; }
.mq-mobile-nav.open { display: block; }
.mq-mobile-nav ul { list-style: none; }
.mq-mobile-nav li { border-bottom: 1px solid var(--border); }
.mq-mobile-nav a { display: block; padding: 13px 4px; color: #ddd; font-size: 15px; font-weight: 600; }
.mq-mobile-nav a:hover { color: var(--red); }

/* ── PAGE LAYOUT ── */
.mq-wrapper { padding: 28px 0; }
.mq-home-columns { display: grid; grid-template-columns: 65.83% 31.66%; gap: 2.51%; align-items: start; }
.mq-single-columns { display: grid; grid-template-columns: 65.83% 31.66%; gap: 2.51%; }
.mq-sidebar { min-width: 0; }

/* ── WIDGET TITLE ── */
.mq-widget { margin-bottom: 28px; }
.mq-widget-title { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .7px; color: var(--gold); margin-bottom: 14px; padding-bottom: 8px; border-bottom: 1px solid rgba(201,168,76,0.3); display: flex; align-items: center; justify-content: space-between; }
.mq-widget-title a { font-size: 11px; font-weight: 600; color: #777; text-transform: none; }
.mq-widget-title a:hover { color: var(--gold); }

.rx-wrap { display: grid; grid-template-columns: 1fr 280px; grid-template-rows: auto auto; gap: 12px; margin-bottom: 28px; }

/* hero card — spans full left column both rows */
.rx-hero { grid-column: 1; grid-row: 1 / 3; min-width: 0; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.rx-hero-thumbwrap { display: block; position: relative; overflow: hidden; height: 260px; }
.rx-hero-thumb { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.rx-hero:hover .rx-hero-thumb { transform: scale(1.03); }
.rx-hero-text { padding: 14px 16px 16px; }
.rx-hero-title { display: block; font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 6px; line-height: 1.3; }
.rx-hero-title:hover { color: var(--gold); }

/* side3 — right column, 3 stacked cards */
.rx-side3 { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rx-side { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: border-color .2s; }
.rx-side:hover { border-color: rgba(201,168,76,.4); }
.rx-side-inner { display: flex; align-items: stretch; height: 88px; }
.rx-side-thumbwrap { display: block; position: relative; flex-shrink: 0; width: 110px; overflow: hidden; }
.rx-side-thumbwrap .rx-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.rx-side:hover .rx-side-thumbwrap .rx-thumb { transform: scale(1.05); }
.rx-side-text { flex: 1; min-width: 0; padding: 8px 12px; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.rx-side-title { display: block; font-size: 13px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3; }
.rx-side-title:hover { color: var(--gold); }
.rx-side-excerpt { font-size: 11px; color: #777; line-height: 1.4; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* shared card base */
.rx-card { background: linear-gradient(160deg, #171a2e 0%, #111422 100%); border-radius: var(--radius); overflow: hidden; border: 1px solid rgba(201,168,76,0.12); transition: border-color .25s, transform .25s, box-shadow .25s; display: flex; flex-direction: column; }
.rx-card:hover { border-color: rgba(201,168,76,0.45); transform: translateY(-2px); box-shadow: 0 8px 30px rgba(0,0,0,0.4), 0 0 15px rgba(201,168,76,0.08); }

/* shared thumbwrap */
.rx-thumbwrap { display: block; position: relative; }
.rx-thumb { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }

/* score badge — inline in meta row */
.rx-badge { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 24px; border-radius: 4px; font-size: 12px; font-weight: 900; color: #fff; flex-shrink: 0; }
.rx-meta-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.rx-score { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 4px; font-size: 14px; font-weight: 900; color: #fff; flex-shrink: 0; }
.rx-rating-box--green { background: var(--green); }
.rx-rating-box--amber { background: var(--amber); }
.rx-rating-box--red   { background: var(--red); }
.rx-rating-box--grey  { background: var(--grey); }

/* shared meta / text */
.rx-meta { padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.rx-title { font-size: 12px; font-weight: 700; color: #ddd; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3; }
.rx-title:hover { color: var(--red); }
.rx-tagpill { background: rgba(221,51,51,.85); color: #fff; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 3px; display: inline-block; white-space: nowrap; width: fit-content; }
.rx-excerpt { font-size: 12px; color: #888; line-height: 1.5; margin: 0; display: none; }
.rx-tag { font-size: 10px; color: #777; display: block; margin-top: 1px; }
.rx-text { flex: 1; min-width: 0; }
.rx-text .rx-title { font-size: 12px; font-weight: 700; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ══════════════════════════════════════
   HERO LAYOUT  (bigwinboard style)
   Top:    left big hero  |  right 3 rows
   Bottom: 4 equal cards
══════════════════════════════════════ */

/* top grid */
.rx-top { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 8px; }
.rx-hero-cell { min-width: 0; }
.rx-side-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }

/* ── HERO CARD (left big) ── */
.rx-item-badge { position: absolute; top: 8px; left: 8px; background: var(--amber); color: #000; font-size: 14px; font-weight: 900; min-width: 28px; height: 28px; padding: 0 6px; border-radius: 4px; display: flex; align-items: center; justify-content: center; z-index: 2; }
.rx-hero-card { display: block; position: relative; border-radius: var(--radius); overflow: hidden; background: #111; text-decoration: none; }
.rx-hero-img { display: block; width: 100%; height: 220px; object-fit: cover; }
.rx-hero-overlay { background: var(--bg-card); border: 1px solid var(--border); border-top: none; padding: 12px 14px; }
.rx-hero-body { }
.rx-hero-title { display: block; font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 4px; line-height: 1.2; }
.rx-hero-provider { display: block; font-size: 12px; color: var(--red); font-weight: 600; margin-bottom: 6px; }
.rx-hero-excerpt { font-size: 13px; color: #aaa; line-height: 1.5; margin: 0 0 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rx-hero-imgwrap { position: relative; }
.rx-hero-playbtn { position: absolute; bottom: 12px; left: 12px; z-index: 2; }
.rx-play-btn { display: inline-block; background: linear-gradient(135deg,#c9a84c,#a07830); color: #1a1200; font-weight: 800; font-size: 13px; padding: 7px 16px; border-radius: 20px; white-space: nowrap; }
.rx-play-btn:hover { background: linear-gradient(135deg,#e8c96a,#c9a84c); color: #1a1200; }
.rx-play-btn--sm { font-size: 11px; padding: 5px 12px; margin-top: 4px; }

/* ── SIDE CARDS (right 3 rows) ── */
.rx-side-card { display: flex; align-items: stretch; gap: 0; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; text-decoration: none; flex: 1; transition: border-color .2s; }
.rx-side-card:hover { border-color: rgba(201,168,76,.4); }
.rx-side-thumb-wrap { position: relative; flex-shrink: 0; width: 160px; min-height: 90px; overflow: hidden; }
.rx-side-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.rx-side-badge { position: absolute; bottom: 6px; left: 6px; background: var(--amber); color: #000; font-size: 13px; font-weight: 900; width: 26px; height: 26px; border-radius: 3px; display: flex; align-items: center; justify-content: center; }
.rx-side-body { flex: 1; min-width: 0; padding: 10px 12px; display: flex; flex-direction: column; justify-content: center; }
.rx-side-title { display: block; font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-side-card:hover .rx-side-title { color: var(--gold); }
.rx-side-provider { display: block; font-size: 11px; color: var(--red); font-weight: 600; margin-bottom: 5px; }
.rx-side-excerpt { font-size: 12px; color: #888; line-height: 1.45; margin: 0 0 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ── BOTTOM ROW (4 cards) ── */
.rx-bottom-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.rx-sq-card { display: block; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; text-decoration: none; transition: border-color .2s; }
.rx-sq-card:hover { border-color: rgba(201,168,76,.4); }
.rx-sq-thumb-wrap { position: relative; padding-top: 58%; overflow: hidden; }
.rx-sq-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.rx-sq-badge { position: absolute; bottom: 6px; left: 6px; background: var(--amber); color: #000; font-size: 13px; font-weight: 900; width: 26px; height: 26px; border-radius: 3px; display: flex; align-items: center; justify-content: center; }
.rx-sq-body { padding: 8px 10px; }
.rx-sq-title { display: block; font-size: 12px; font-weight: 700; color: #ddd; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 2px; }
.rx-sq-card:hover .rx-sq-title { color: var(--gold); }
.rx-sq-provider { display: block; font-size: 11px; color: #777; }

/* ── GAME CARD GRID (crw-grid) — standalone 5-col compact grid ── */
.rx-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; }
.rx-grid .rx-thumbwrap { padding-top: 76%; overflow: hidden; }
.rx-grid .rx-thumb { position: absolute; inset: 0; }
.rx-bottom { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.rx-bottom .rx-thumbwrap { padding-top: 58%; overflow: hidden; }
.rx-bottom .rx-thumb { position: absolute; inset: 0; }
.rx-card-cta { display: block; text-align: center; background: linear-gradient(135deg, #c9a84c, #a07830); color: #1a1200; font-size: 12px; font-weight: 800; padding: 9px; margin: 0; border-radius: 0 0 var(--radius) var(--radius); margin-top: auto; }
.rx-card-cta:hover { background: linear-gradient(135deg, #e8c96a, #c9a84c); color: #1a1200; }

/* ── TRENDING SLOTS (trs) — bigwinboard ranking style ── */
.tr-wrap { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; overflow: hidden; }
.tr-heading { font-size: 15px; font-weight: 900; color: #fff; letter-spacing: .5px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.tr-panel { display: none; }
.tr-panel--active { display: block; }
.tr-tabs { display: flex; gap: 6px; margin-bottom: 14px; }
.tr-tab { background: #fff; color: #000; border: none; font-size: 13px; font-weight: 700; padding: 6px 16px; border-radius: 4px; cursor: pointer; transition: .15s; }
.tr-tab:not(.tr-tab--active) { background: transparent; color: #aaa; border: 1px solid var(--border); }
.tr-tab:not(.tr-tab--active):hover { background: rgba(255,255,255,.08); color: #fff; }

/* 2-column grid, 10 items = 5 per col */
.tr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; overflow: hidden; }
.tr-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,.05); text-decoration: none; transition: background .15s; min-width: 0; overflow: hidden; }
.tr-item:hover { background: rgba(255,255,255,.04); }
/* left col items get a right border */
.tr-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.06); }
/* last row: no bottom border */
.tr-item:nth-last-child(-n+2) { border-bottom: none; }

.tr-rank { font-size: 13px; font-weight: 900; color: rgba(255,255,255,.25); min-width: 18px; text-align: center; flex-shrink: 0; }
.tr-item:nth-child(1) .tr-rank,
.tr-item:nth-child(2) .tr-rank { color: #f4d03f; }
.tr-item:nth-child(3) .tr-rank,
.tr-item:nth-child(4) .tr-rank { color: #bdc3c7; }
.tr-item:nth-child(5) .tr-rank,
.tr-item:nth-child(6) .tr-rank { color: #e59866; }

.tr-thumb-wrap { flex-shrink: 0; width: 70px; height: 46px; border-radius: 4px; overflow: hidden; background: #0d0f1c; }
.tr-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }

.tr-body { flex: 1; min-width: 0; }
.tr-title { display: block; font-size: 13px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 2px; }
.tr-item:hover .tr-title { color: var(--gold); }
.tr-provider { display: block; font-size: 11px; color: #888; margin-bottom: 1px; }
.tr-date { display: block; font-size: 11px; color: #666; }

.tr-trend { display: flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 800; flex-shrink: 0; padding: 3px 7px; border-radius: 4px; }
.tr-up   { background: rgba(39,174,96,.15); color: #27ae60; }
.tr-down { background: rgba(221,51,51,.15); color: #dd3333; }
.tr-flat { background: rgba(255,255,255,.06); color: #888; }
.tr-up   .tr-arrow::before { content: "▲"; font-size: 9px; }
.tr-down .tr-arrow::before { content: "▼"; font-size: 9px; }
.tr-flat .tr-arrow::before { content: "→"; font-size: 10px; }

/* keep old tts/tusw classes so other widgets don't break */
.tt-chip { font-size: 10px; font-weight: 800; padding: 1px 5px; border-radius: 3px; flex-shrink: 0; }
.tt-chip.up   { background: rgba(39,174,96,.2); color: #27ae60; }
.tt-chip.down { background: rgba(221,51,51,.2); color: var(--red); }

.wv-reviews-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; flex-wrap: wrap; gap: 10px; }
.wv-reviews-count { font-size: 13px; color: #888; }
.wv-reviews-sort select { background: var(--bg-card); border: 1px solid var(--border); color: #ccc; padding: 6px 10px; border-radius: 4px; font-size: 13px; }
.wv-rw-list { list-style: none; width: 100%; overflow: hidden; }
.wv-rw-item { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border); width: 100%; max-width: 100%; }
.wv-rw-item:last-child { border-bottom: none; }
.wv-rw-thumb { flex-shrink: 0; width: 120px; height: 70px; border-radius: 4px; overflow: hidden; display: block; }
.wv-rw-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.wv-rw-item:hover .wv-rw-thumb img { transform: scale(1.04); }
.wv-rw-main { flex: 1; min-width: 0; }
.wv-rw-title { font-size: 15px; font-weight: 700; color: #fff; margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wv-rw-title a { color: inherit; }
.wv-rw-title a:hover { color: var(--red); }
.wv-rw-submeta { font-size: 12px; color: #888; margin-bottom: 1px; }
.wv-rw-meta { font-size: 11px; color: #666; margin-top: 4px; display: flex; gap: 6px; }
.wv-rw-trend { text-align: center; flex-shrink: 0; min-width: 70px; }
.wv-rw-label { display: block; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: #666; margin-bottom: 3px; }
.wv-rw-trend-value { font-size: 18px; font-weight: 900; color: #fff; }
.wv-rw-scores { display: flex; flex-direction: column; align-items: center; gap: 4px; flex-shrink: 0; min-width: 60px; }
.wv-rw-score { text-align: center; }
.wv-rw-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; padding: 6px 10px; border-radius: 6px; font-size: 17px; font-weight: 900; color: #fff; line-height: 1; white-space: nowrap; box-sizing: border-box; }
.wv-rw-badge-label { font-size: 10px; color: #888; text-transform: uppercase; letter-spacing: .5px; }
.wv-rw-scores .wv-play-cta--sm { margin-top: 2px; font-size: 11px; padding: 5px 10px; white-space: nowrap; }
.wv-se, .wv-sg { background: var(--green); }
.wv-sm, .wv-sa  { background: var(--amber); }
.wv-sb, .wv-sr      { background: var(--red); }
.wv-sn, .wv-sy      { background: var(--grey); }

/* pagination */
.wv-pagination { display: flex; justify-content: center; gap: 5px; padding: 24px 0; }
.page-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 8px; border-radius: 4px; background: var(--bg-card); border: 1px solid var(--border); color: #aaa; font-size: 14px; transition: .2s; }
.page-btn:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* ── REVIEW PAGE — GSW stats card ── */
.wv-gsw-wrap { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin-bottom: 22px; }
.wv-gsw-thumb-area { position: relative; }
.wv-gsw-thumb-area img.wv-gsw-thumb { width: 100%; max-height: 240px; object-fit: cover; display: block; }
.wv-gsw-thumb-release { position: absolute; bottom: 10px; right: 12px; background: rgba(0,0,0,.7); font-size: 11px; color: #aaa; padding: 2px 8px; border-radius: 3px; }
/* score badges */
.wv-toprow { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.wv-badges { display: flex; gap: 10px; }
.wv-score-badge { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 5px; background: var(--bg-card2); border: 2px solid; }
.wv-score-badge--critic { border-color: var(--green); }
.wv-score-badge--user   { border-color: var(--grey); }
.wv-score-num  { font-size: 28px; font-weight: 900; line-height: 1; }
.wv-score-label  { font-size: 11px; color: #aaa; }
.wv-score-phrase { font-size: 12px; font-weight: 700; color: #fff; }
.review-summary-title { font-size: 12px; font-weight: 700; text-transform: uppercase; color: #888; margin-bottom: 4px; }
.review-desc-content p { font-size: 14px; color: #ccc; font-style: italic; }
/* stats list */
.wv-gsw-list { list-style: none; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--border); }
.wv-gsw-list li { padding: 12px 14px; border-right: 1px solid var(--border); display: flex; align-items: center; gap: 10px; }
.wv-gsw-list li:last-child { border-right: none; }
.wv-gsw-stat-icon { font-size: 16px; color: var(--red); flex-shrink: 0; }
.wv-gsw-label { font-size: 10px; color: #888; text-transform: uppercase; letter-spacing: .5px; }
.wv-gsw-value { font-size: 14px; font-weight: 700; color: #fff; }
.wv-gsw-value.rtp    { color: var(--amber); }
.wv-gsw-value.maxwin { color: var(--green); }

/* ── BONUS BOXES ── */
.wv-bonus-section { margin-bottom: 24px; }
.wv-bonus-title { font-size: 14px; font-weight: 800; color: #fff; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.wv-bonus-container { display: flex; flex-direction: column; gap: 10px; }
.wv-bonus-box { display: flex; align-items: center; gap: 12px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; position: relative; overflow: hidden; transition: border-color .2s; border-left: 3px solid var(--bwb-bt-accent, var(--red)); }
.wv-bonus-box:hover { border-color: rgba(255,255,255,.15); }
.wv-bonus-logo { width: 52px; height: 52px; object-fit: contain; border-radius: 4px; background: #111; flex-shrink: 0; }
.wv-bonus-text { flex: 1; min-width: 0; }
.wv-bonus-text p:first-child { font-size: 16px; font-weight: 800; color: var(--bwb-bt-accent, var(--red)); }
.wv-bonus-text p:last-child  { font-size: 12px; color: #aaa; }
.wv-bonus-button { background: var(--bwb-bt-accent, var(--red)); color: #fff; padding: 8px 18px; border-radius: 20px; font-size: 13px; font-weight: 700; white-space: nowrap; flex-shrink: 0; transition: opacity .2s; }
.wv-bonus-button:hover { opacity: .85; color: #fff; }
.wv-bonus-terms { font-size: 10px; color: #666; margin-top: 2px; }
.wv-bt-ribbon { position: absolute; top: 8px; right: -18px; background: var(--red); color: #fff; font-size: 9px; font-weight: 700; padding: 2px 24px; transform: rotate(35deg); }

/* ── ARTICLE CONTENT ── */
.entry-content { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 26px; margin-bottom: 22px; }
.entry-content h1 { font-size: 24px; font-weight: 900; color: #fff; margin-bottom: 6px; line-height: 1.3; }
.entry-content .post-meta { font-size: 12px; color: #777; margin-bottom: 20px; display: flex; gap: 14px; flex-wrap: wrap; }
.entry-content h2 { font-size: 18px; font-weight: 800; color: #fff; margin: 22px 0 10px; padding-bottom: 7px; border-bottom: 1px solid var(--border); }
.entry-content h3 { font-size: 15px; font-weight: 700; color: #e0e0e0; margin: 18px 0 8px; }
.entry-content p  { color: #bbb; margin-bottom: 12px; line-height: 1.8; }
.entry-content ul, .entry-content ol { padding-left: 20px; margin-bottom: 12px; color: #bbb; }
.entry-content li { margin-bottom: 5px; line-height: 1.7; }
.entry-content table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 14px; }
.entry-content th { background: #111; color: #fff; padding: 9px 13px; text-align: left; font-weight: 700; border: 1px solid var(--border); }
.entry-content td { padding: 9px 13px; border: 1px solid var(--border); color: #bbb; }
.entry-content tr:nth-child(even) td { background: rgba(255,255,255,.02); }

/* ── SIDEBAR WIDGETS ── */
.sidebar-widget { background: var(--bg-widget); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; margin-bottom: 18px; }

/* top list */
.top-slots-list { list-style: none; }
.top-slots-list li { display: flex; align-items: center; gap: 9px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.top-slots-list li:last-child { border-bottom: none; }
.top-rank { font-size: 13px; font-weight: 900; color: rgba(255,255,255,.2); min-width: 18px; text-align: center; }
.top-rank.r1 { color: #f4d03f; }
.top-rank.r2 { color: #bdc3c7; }
.top-rank.r3 { color: #e59866; }
.top-thumb { width: 44px; height: 26px; object-fit: cover; border-radius: 3px; flex-shrink: 0; }
.top-name { font-size: 12px; font-weight: 600; color: #ddd; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.top-name a { color: inherit; }
.top-name a:hover { color: var(--red); }
.top-provider { font-size: 10px; color: #777; }
.top-score { flex-shrink: 0; }
.top-score .rx-badge { width: 28px; height: 28px; font-size: 13px; border-radius: 3px; display: flex; align-items: center; justify-content: center; font-weight: 900; color: #fff; }

/* tag cloud */
.tag-cloud { display: flex; flex-wrap: wrap; gap: 5px; }
.tag-item { background: rgba(255,255,255,.05); border: 1px solid var(--border); color: #bbb; font-size: 11px; padding: 3px 9px; border-radius: 3px; transition: .2s; }
.tag-item:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* ── BREADCRUMB ── */
.wv-breadcrumb { display: flex; align-items: center; gap: 5px; font-size: 12px; color: #666; margin-bottom: 16px; flex-wrap: wrap; }
.wv-breadcrumb a { color: #777; }
.wv-breadcrumb a:hover { color: var(--red); }
.wv-breadcrumb .sep { color: #444; }

/* ── LIKE BUTTON ── */
.wv-like { margin-bottom: 12px; }
.wv-like-button { background: rgba(255,255,255,.06); border: 1px solid var(--border); color: #aaa; padding: 6px 14px; border-radius: 20px; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: .2s; }
.wv-like-button:hover { background: rgba(221,51,51,.15); border-color: var(--red); color: var(--red); }

/* ── FOOTER ── */
.mq-footer { background: #0a0a0a; border-top: 1px solid var(--border); margin-top: 40px; }
.mq-footer-widgets { display: grid; grid-template-columns: repeat(4,1fr); gap: 32px; padding: 36px 0 28px; }
#footertitletxt { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .8px; color: #fff; margin-bottom: 12px; }
.navzlink { display: block; font-size: 13px; color: #555; margin-bottom: 6px; transition: color .15s; }
.navzlink:hover { color: var(--red); }
.mq-copyright-wrap { border-top: 1px solid var(--border); padding: 14px 0; display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #444; flex-wrap: wrap; gap: 8px; }
.mq-copyright-wrap a { color: #555; }
.mq-copyright-wrap a:hover { color: var(--red); }

/* domain links */
.footer-domain-links { border-top: 1px solid var(--border); padding: 12px 0; }
.footer-domain-links ul { display: flex; flex-wrap: wrap; list-style: none; gap: 3px; }
.footer-domain-links ul li a { font-size: 11px; color: #999; padding: 2px 5px; transition: color .15s; }
.footer-domain-links ul li a:hover { color: var(--red); }

/* ── PLAY CTA ── */
.wv-play-cta-box { background: linear-gradient(135deg, #1a0505, #180518); border: 1px solid rgba(221,51,51,.25); border-radius: var(--radius); padding: 18px 20px; margin-bottom: 22px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.wv-play-cta-box h3 { font-size: 15px; font-weight: 800; color: #fff; margin-bottom: 3px; }
.wv-play-cta-box p  { font-size: 12px; color: #aaa; }
.btn-red  { background: var(--red); color: #fff; padding: 9px 20px; border-radius: 4px; font-weight: 700; font-size: 13px; white-space: nowrap; display: inline-block; }
.btn-red:hover  { background: var(--red-h); color: #fff; }
.btn-outline { border: 1px solid rgba(255,255,255,.2); color: #ccc; padding: 8px 18px; border-radius: 4px; font-weight: 600; font-size: 13px; white-space: nowrap; display: inline-block; }
.btn-outline:hover { border-color: var(--red); color: var(--red); }
.cta-btns { display: flex; gap: 8px; flex-wrap: wrap; flex-shrink: 0; }

/* ── HOME TWO-COLUMN LAYOUT ── */
.mq-home-wrap { padding-top: 28px; padding-bottom: 40px; }
.mq-home-columns { display: grid; grid-template-columns: 65.83% 31.66%; gap: 2.51%; align-items: start; }
.mq-home-main { min-width: 0; }
.mq-widget { margin-bottom: 0; }
.mq-home-main .mq-widget { margin-bottom: 24px; }
.mq-widget-col-1.mq-sidebar { position: sticky; top: 70px; display: flex; flex-direction: column; gap: 16px; }
.mq-home-6 { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; }
.mq-widget-title { font-size: 13px; font-weight: 800; color: #fff; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.mq-widget-title-inner { }

/* hot topics list */
.wv-ht-list { list-style: none; }
.wv-ht-item { padding: 8px 0; border-bottom: 1px solid var(--border); }
.wv-ht-item:last-child { border-bottom: none; }
.wv-ht-row { display: flex; align-items: center; gap: 8px; }
.wv-ht-num { font-size: 13px; font-weight: 900; color: rgba(255,255,255,.2); min-width: 16px; text-align: center; flex-shrink: 0; }
.wv-ht-thumbwrap { flex-shrink: 0; display: block; width: 64px; height: 38px; border-radius: 3px; overflow: hidden; }
.wv-ht-thumb { width: 100%; height: 100%; object-fit: cover; }
.wv-ht-info { flex: 1; min-width: 0; }
.wv-ht-head { }
.wv-ht-title { font-size: 12px; font-weight: 700; color: #ddd; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wv-ht-title:hover { color: var(--red); }
.wv-ht-tag { font-size: 10px; color: #777; margin-top: 1px; }

/* sidebar bonus box */
.wv-bonus-box--sidebar { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }

/* ── COMMENT WIDGET (lcw) — bigwinboard exact ── */
.commentwidgetbox { margin: 8px 0; }
.commentwidgetbox ul { list-style: none; margin: 0; padding: 7px 0 0; }
.commentwidgetbox .lc-loading, .commentwidgetbox .lc-empty { color: #999; font-size: 14px; padding: 12px 8px; list-style: none; }
/* toggle tabs */
.commentwidgetbox .lc-toggle { display: flex; gap: 6px; margin: 0 0 6px; }
.commentwidgetbox .lc-tab { appearance: none; border: 1px solid #000; background: #000; color: #ddd; font-weight: 700; padding: 6px 10px; border-radius: 6px; cursor: pointer; transition: background .2s, color .2s; }
.commentwidgetbox .lc-tab:not(.lc-tab--active):hover { background: #2e2e2e; }
.commentwidgetbox .lc-tab--active { background: #fff; color: #000; border-color: #000; }
/* card */
.commentwidgetbox .lc-li-style { display: grid; grid-template-columns: 42px 1fr; gap: 10px; align-items: center; background: #222; border-radius: 8px; padding: 8px; margin-bottom: 6px; color: #c4c4c4; width: 100%; box-sizing: border-box; line-height: 1.3; box-shadow: 0 4px 10px rgba(0,0,0,.5); transition: transform .2s, background-color .3s, box-shadow .25s; }
.commentwidgetbox .lc-li-style:hover { background: #313131; transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0,0,0,.6); }
/* avatar */
.commentwidgetbox .lc-image-style { width: 42px; height: 42px; border-radius: 6px; display: block; object-fit: cover; }
/* body */
.commentwidgetbox .lc-body { min-width: 0; display: flex; flex-direction: column; gap: 0; }
.commentwidgetbox .lc-body.lc-has-score { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto auto; column-gap: 10px; align-items: center; }
.commentwidgetbox .lc-body.lc-has-score .lc-row { grid-column: 1; }
.commentwidgetbox .lc-body.lc-has-score .lc-rating { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
/* rows */
.commentwidgetbox .lc-row { display: flex; align-items: center; gap: 6px; min-width: 0; }
.commentwidgetbox .lc-row--meta { font-size: 12px; color: #cfcfcf; }
/* author */
.commentwidgetbox .lc-author { display: inline-flex; align-items: center; gap: 0; font-weight: 700; color: #fff; text-decoration: none; white-space: nowrap; }
/* post title */
.commentwidgetbox .lc-post { font-weight: 700; color: #fff; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.commentwidgetbox .lc-post:hover { text-decoration: underline; }
/* excerpt */
.commentwidgetbox .lc-excerpt { color: #dfdfdf; font-size: 13px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; min-width: 0; flex: 1; margin: 0; }
/* rating chip */
.commentwidgetbox .lc-rating { display: inline-flex; align-items: center; justify-content: center; padding: 4px 10px; font-size: 16px; font-weight: 800; border-radius: 8px; color: #fff; background: var(--gold); }
.commentwidgetbox .review-rating-box--red { background: #ff6874; }
.commentwidgetbox .review-rating-box--amber { background: #f39c12; }
.commentwidgetbox .review-rating-box--green { background: #27ae60; color: #fff; }
/* pill badges */
.commentwidgetbox .lc-pill { display: inline-flex; align-items: center; padding: 1px 5px; font-size: 10px; font-weight: 800; border-radius: 14px; text-transform: uppercase; letter-spacing: .4px; line-height: 1; color: #fff; }
.commentwidgetbox .lc-pill--review { background: #00d4ff; }
.commentwidgetbox .lc-pill--user-review { background: #27ae60; color: #fff; }
.commentwidgetbox .lc-pill--news { background: #f39c12; }
/* legend */
.commentwidgetbox .lc-legend { margin: 6px 0 0; padding: 6px 0 0; border-top: 1px solid rgba(255,255,255,.06); font-size: 12px; color: #cfcfcf; display: flex; align-items: center; }

/* ── TOURNAMENT WIDGET — bigwinboard exact ── */
.wv-tournament-widget-body { background: #1a1a1a; border-radius: 8px; padding: 6px 14px 12px; border: 1px solid rgba(255,255,255,.08); box-sizing: border-box; }
.wv-tournament-widget-tabs { display: flex; gap: 0; margin: -4px 0 12px; border-bottom: 1px solid rgba(255,255,255,.1); }
.wv-tournament-widget-tab { flex: 0 0 auto; padding: 8px 14px 10px; font-size: .875rem; font-weight: 600; color: rgba(255,255,255,.6); background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; transition: color .15s, border-color .15s; display: inline-flex; align-items: center; gap: 6px; }
.wv-tournament-widget-tab:hover { color: rgba(255,255,255,.85); }
.wv-tournament-widget-tab-active { color: rgba(255,200,100,.95); border-bottom-color: rgba(255,200,100,.9); }
.wv-tournament-widget-panel { display: none; }
.wv-tournament-widget-panel.wv-tournament-widget-panel-visible { display: block; }
.wv-tournament-widget-item { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.06); }
.wv-tournament-widget-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.wv-tournament-widget-live-icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #22c55e; font-size: 1.1rem; }
.wv-tournament-widget-upcoming-icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.45); font-size: 1.1rem; }
.wv-tournament-widget-thumb { flex-shrink: 0; width: 80px; aspect-ratio: 16/9; border-radius: 6px; overflow: hidden; background: rgba(255,255,255,.06); }
.wv-tournament-widget-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.wv-tournament-widget-thumb a { display: block; width: 100%; height: 100%; }
.wv-tournament-widget-content { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; border-left: 1px solid rgba(255,255,255,.06); padding-left: 10px; }
.wv-tournament-widget-link { display: block; font-size: .95rem; font-weight: 600; color: #fff; text-decoration: none; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wv-tournament-widget-link:hover { color: #fff; text-decoration: underline; }
.wv-tournament-widget-prize-pool { font-size: .8125rem; color: rgba(255,255,255,.7); line-height: 1.25; }
.wv-tournament-widget-timer { font-size: .8125rem; color: rgba(255,255,255,.65); font-variant-numeric: tabular-nums; line-height: 1.25; }
.wv-tournament-widget-item-live .wv-tournament-widget-timer { color: rgba(69,193,77,.9); }
.wv-tournament-widget-item-upcoming .wv-tournament-widget-timer { color: rgba(203,86,86,.9); }

/* ── LEADERBOARD WIDGET ── */
.wv-gamification-lb-tabs { display: flex; list-style: none; gap: 4px; margin-bottom: 10px; }
.wv-gamification-lb-tab { font-size: 11px; color: #888; padding: 3px 10px; border-radius: 12px; border: 1px solid var(--border); cursor: pointer; transition: .15s; background: rgba(255,255,255,.04); }
.wv-gamification-lb-tab.wv-gamification-lb-active, .wv-gamification-lb-tab:hover { background: var(--red); border-color: var(--red); color: #fff; }
.wv-gamification-lb-list { list-style: none; counter-reset: lb; }
.wv-gamification-lb-item { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--border); font-size: 12px; }
.wv-gamification-lb-item:last-child { border-bottom: none; }
.wv-lb-rank { font-size: 13px; font-weight: 900; color: rgba(255,255,255,.2); min-width: 18px; text-align: center; flex-shrink: 0; }
.wv-gamification-lb-item:nth-child(1) .wv-lb-rank { color: #f4d03f; }
.wv-gamification-lb-item:nth-child(2) .wv-lb-rank { color: #bdc3c7; }
.wv-gamification-lb-item:nth-child(3) .wv-lb-rank { color: #e59866; }
.wv-lb-name { flex: 1; color: #ccc; font-weight: 600; }
.wv-lb-score { font-size: 11px; flex-shrink: 0; }
/* ── LATEST DEMOS WIDGET (drw) ── */
.uw-title-sep { color: var(--border); margin: 0 4px; }
.uw-title-link { font-size: 11px; color: var(--red); font-weight: 600; }
.uw-title-link:hover { color: var(--red-h); }
.dq-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.dq-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: border-color .2s, transform .2s; }
.dq-card:hover { border-color: rgba(221,51,51,.3); transform: translateY(-2px); }
.dq-thumbwrap { display: block; position: relative; padding-top: 58%; overflow: hidden; }
.dq-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.dq-card:hover .dq-thumb { transform: scale(1.04); }
.dq-meta { display: flex; align-items: center; gap: 8px; padding: 8px 10px; }
.dq-score { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 3px; font-size: 13px; font-weight: 900; color: #fff; flex-shrink: 0; }
.dq-rating-box--green { background: var(--green); }
.dq-rating-box--amber { background: var(--amber); }
.dq-rating-box--red   { background: var(--red); }
.dq-rating-box--na    { background: var(--grey); }
.dq-text { flex: 1; min-width: 0; }
.dq-title { font-size: 11px; font-weight: 700; color: #ddd; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dq-title:hover { color: var(--red); }
.dq-tag { font-size: 10px; color: #666; display: block; margin-top: 1px; }

/* ── USER SCORES WIDGET (urw) — same grid as drw ── */
.uv-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.uv-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: border-color .2s, transform .2s; }
.uv-card:hover { border-color: rgba(221,51,51,.3); transform: translateY(-2px); }
.uv-thumbwrap { display: block; position: relative; padding-top: 58%; overflow: hidden; }
.uv-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.uv-card:hover .uv-thumb { transform: scale(1.04); }
.uv-meta { display: flex; align-items: center; gap: 8px; padding: 8px 10px; }
.uv-score { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 3px; font-size: 13px; font-weight: 900; color: #fff; flex-shrink: 0; }
.uv-rating-box--green { background: var(--green); }
.uv-rating-box--amber { background: var(--amber); }
.uv-rating-box--red   { background: var(--red); }
.uv-rating-box--na    { background: var(--grey); }
.uv-text { flex: 1; min-width: 0; }
.uv-title { font-size: 11px; font-weight: 700; color: #ddd; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uv-title:hover { color: var(--red); }
.uv-tag { font-size: 10px; color: #666; display: block; margin-top: 1px; }

/* ── LATEST RELEASES WIDGET (nrw) — same grid as drw/urw ── */
.np-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.np-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: border-color .2s, transform .2s; }
.np-card:hover { border-color: rgba(221,51,51,.3); transform: translateY(-2px); }
.np-thumbwrap { display: block; position: relative; padding-top: 58%; overflow: hidden; }
.np-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.np-card:hover .np-thumb { transform: scale(1.04); }
.np-meta { display: flex; align-items: center; gap: 8px; padding: 8px 10px; }
.np-score { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 3px; font-size: 13px; font-weight: 900; color: #fff; flex-shrink: 0; }
.np-rating-box--green { background: var(--green); }
.np-rating-box--amber { background: var(--amber); }
.np-rating-box--red   { background: var(--red); }
.np-rating-box--na    { background: var(--grey); }
.np-text { flex: 1; min-width: 0; }
.np-title { font-size: 11px; font-weight: 700; color: #ddd; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.np-title:hover { color: var(--red); }
.np-tag { font-size: 10px; color: #666; display: block; margin-top: 1px; }
.np-date { font-size: 10px; color: #555; display: block; margin-top: 1px; }

.section-heading { font-size: 20px; font-weight: 900; color: var(--gold); margin-bottom: 16px; padding-bottom: 10px; border-bottom: 1px solid rgba(201,168,76,0.3); display: inline-block; }
.wv-rw-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.wv-rw-viewall { font-size: 13px; color: var(--red); }

/* ── FILTER BAR ── */
.wv-filter-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px; }
.wv-filter-label { font-size: 12px; color: #777; }
.wv-filter-btn { font-size: 12px; padding: 4px 12px; border-radius: 20px; color: #aaa; border: 1px solid var(--border); transition: .2s; }
.wv-filter-btn:hover,.wv-filter-btn.active { background: var(--red); border-color: var(--red); color: #fff; }

/* ── LIST PAGE LAYOUT ── */
.wv-list-header { margin-bottom: 20px; }
.wv-list-title { font-size: 26px; font-weight: 900; color: #fff; margin-bottom: 8px; }
.wv-list-desc { font-size: 14px; color: #888; }
.wv-list-layout { display: grid; grid-template-columns: 1fr 280px; gap: 24px; align-items: start; }
.wv-list-main { min-width: 0; overflow: hidden; }

/* bwb-rw-item extended for list page */
.wv-rw-rank { font-size: 22px; font-weight: 900; color: rgba(255,255,255,.12); width: 32px; flex-shrink: 0; text-align: center; }
.wv-rw-provider { font-size: 11px; color: var(--red); font-weight: 600; }
.wv-rw-rtp { font-size: 11px; color: var(--amber); font-weight: 600; }
.wv-rw-meta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.wv-play-cta--sm { font-size: 12px; padding: 6px 14px; border-radius: 20px; background: linear-gradient(135deg, #c9a84c, #a07830); color: #1a1200; font-weight: 800; margin-top: 8px; display: inline-block; }
.wv-play-cta--sm:hover { background: linear-gradient(135deg, #e8c96a, #c9a84c); color: #1a1200; }

/* ── PAGINATION ── */
.wv-pagination { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 24px; justify-content: center; }
.wv-page-btn { background: var(--bg-card); border: 1px solid var(--border); color: #aaa; padding: 7px 14px; border-radius: 4px; font-size: 13px; transition: .2s; }
.wv-page-btn:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* ── SIDEBAR ── */
.wv-sidebar { position: sticky; top: 70px; display: flex; flex-direction: column; gap: 16px; }
.wv-sidebar-widget { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; }
.wv-widget-title { font-size: 13px; font-weight: 800; color: #fff; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.wv-sidebar-list { list-style: none; }
.wv-sidebar-item { display: flex; align-items: center; gap: 9px; padding: 7px 0; border-bottom: 1px solid var(--border); }
.wv-sidebar-item:last-child { border-bottom: none; }
.wv-sidebar-item img { width: 44px; height: 28px; object-fit: cover; border-radius: 3px; flex-shrink: 0; }
.wv-sidebar-item a { font-size: 12px; color: #ccc; font-weight: 600; }
.wv-sidebar-item a:hover { color: var(--red); }
.wv-tag-cloud { display: flex; flex-wrap: wrap; gap: 5px; }
.wv-tag { background: rgba(255,255,255,.05); border: 1px solid var(--border); color: #bbb; font-size: 11px; padding: 3px 9px; border-radius: 3px; transition: .2s; }
.wv-tag:hover { background: var(--red); border-color: var(--red); color: #fff; }
.wv-bonus-box--sidebar { padding: 14px; }

/* ── SHOW PAGE LAYOUT ── */
.wv-show-layout { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }
.wv-show-main { min-width: 0; overflow: hidden; }

/* review box top */
.wv-review-box-top { border-radius: var(--radius); min-height: 240px; background-size: cover; background-position: center; background-color: #1a1a2e; margin-bottom: 22px; }
.wv-review-box-overlay { min-height: 240px; background: linear-gradient(to right, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 100%); border-radius: var(--radius); display: flex; align-items: flex-end; }
.wv-review-box-content { width: 100%; padding: 28px 24px; display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 16px; }
.wv-review-box-left { display: flex; flex-direction: column; justify-content: flex-end; flex: 1; min-width: 0; }
.wv-review-title { font-size: 26px; font-weight: 900; color: #fff; margin-bottom: 10px; text-shadow: 0 2px 8px rgba(0,0,0,.8); }
.wv-review-box-right { display: flex; flex-direction: column; gap: 10px; align-items: flex-end; flex-shrink: 0; }
.wv-score-badge { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px; text-align: center; min-width: 70px; }
.wv-score--critic { border-top: 3px solid var(--green); }
.wv-score--user   { border-top: 3px solid var(--amber); }
.wv-score-val { font-size: 28px; font-weight: 900; color: #fff; line-height: 1; }
.wv-score-label { font-size: 10px; color: #888; margin-top: 4px; }

/* gsw stats */
.wv-gsw-wrap { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; margin-bottom: 22px; }
.wv-gsw-title { font-size: 14px; font-weight: 800; color: #fff; margin-bottom: 12px; }
.wv-gsw-list { list-style: none; display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 4px; overflow: hidden; }
.wv-gsw-list li { background: var(--bg-card); padding: 10px 12px; display: flex; flex-direction: column; gap: 3px; }
.wv-gsw-key { font-size: 10px; color: #777; text-transform: uppercase; letter-spacing: .5px; }
.wv-gsw-val { font-size: 14px; font-weight: 700; color: #fff; }

/* score summary */
.wv-score-summary { display: flex; flex-direction: column; gap: 8px; }
.wv-score-row { display: flex; align-items: center; justify-content: space-between; }
.wv-score-row span:first-child { font-size: 13px; color: #aaa; }
.wv-score-row .wv-se { color: #4ade80; font-weight: 700; background: none; }
.wv-score-row .wv-sg { color: #60a5fa; font-weight: 700; background: none; }
.wv-score-row .wv-sa { color: #fbbf24; font-weight: 700; background: none; }

/* keyword suggest box */
.wv-kws-wrap { margin-top: 18px; padding: 14px; background: var(--bg-card); border-radius: var(--radius); border: 1px solid var(--border); }
.wv-kws-wrap h3 { font-size: 14px; color: #aaa; margin-bottom: 8px; }
.wv-kws-wrap ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.wv-kws-wrap a { color: var(--gold); font-size: 13px; line-height: 1.6; }

/* in-content CTA + comments */
.wv-incontent-cta { margin: 22px 0; }
.wv-comments-section { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; margin-top: 22px; }
.wv-comments-title { font-size: 15px; font-weight: 800; color: #fff; margin-bottom: 14px; }
.wv-comments-list { display: flex; flex-direction: column; gap: 12px; }
.wv-cmt { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 8px; padding: 12px; }
.wv-cmm { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 13px; }
.wv-cmm strong { color: #fff; font-size: 14px; }
.wv-cmm .wv-se, .wv-cmm .wv-sg, .wv-cmm .wv-sa { padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 700; color: #fff; }
.wv-cmd { color: #888; font-size: 12px; }
.wv-cmt p { color: #ccc; font-size: 13px; line-height: 1.5; margin: 0; }

/* play widget */
.wv-play-widget { text-align: center; }
.wv-play-cta--full { display: block; background: linear-gradient(135deg, #c9a84c, #a07830); color: #1a1200; font-weight: 800; font-size: 15px; padding: 13px; border-radius: 30px; text-align: center; box-shadow: 0 4px 16px rgba(201,168,76,0.35); }
.wv-play-cta--full:hover { background: linear-gradient(135deg, #e8c96a, #c9a84c); color: #1a1200; }

/* bonus box redesign for new HTML structure */
.wv-bonus-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.wv-bonus-box { background: var(--bg-card); border: 1px solid var(--border); border-left: 3px solid var(--bwb-bt-accent, var(--red)); border-radius: var(--radius); padding: 16px; position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 10px; }
.wv-bonus-logo img { width: 52px; height: 52px; object-fit: contain; border-radius: 4px; }
.wv-bonus-name { font-size: 15px; font-weight: 800; color: #fff; }
.wv-bonus-offer { font-size: 14px; color: #ddd; }
.wv-bonus-offer strong { color: var(--bwb-bt-accent, var(--red)); }
.wv-bonus-terms { font-size: 11px; color: #666; }
.wv-bonus-cta { background: linear-gradient(135deg, #c9a84c, #a07830); color: #1a1200; padding: 11px 0; border-radius: 30px; text-align: center; font-weight: 800; font-size: 14px; margin-top: auto; display: block; box-shadow: 0 3px 12px rgba(201,168,76,0.3); }
.wv-bonus-cta:hover { background: linear-gradient(135deg, #e8c96a, #c9a84c); color: #1a1200; }

/* breadcrumb */
.wv-breadcrumb { display: flex; align-items: center; gap: 5px; font-size: 12px; color: #666; margin-bottom: 16px; flex-wrap: wrap; }
.wv-breadcrumb a { color: #777; }
.wv-breadcrumb a:hover { color: var(--red); }

/* ── FOOTER (bigwinboard exact structure) ── */
.mq-footer { background: linear-gradient(180deg, #0a0c18 0%, #060810 100%); border-top: 1px solid rgba(201,168,76,0.2); font-size: 13px; color: #fff; padding: 25px 0 0; }
.mq-footer a, .mq-footer a:hover { color: #f7f7f7; }
/* float-based row/col — must match bigwinboard's mh-row + mh-col-1-2 */
.mq-row { display: block; }
.mq-row::after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix::after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.mq-col-1-2 { float: left; width: 48.75%; overflow: hidden; }
.mq-col-1-2:first-child { margin-left: 0; }
.mq-col-1-2 + .mq-col-1-2 { margin-left: 2.5%; }
.mq-footer-widget { margin-bottom: 25px; overflow: hidden; }
#footertitletxt { font-size: 20px; font-weight: bold; color: #eb004f; text-align: center; margin-bottom: 8px; }
a.navzlink { margin: 2px 6px; word-wrap: normal; display: inline-block; color: #ccc; font-size: 13px; transition: color .15s; }
a.navzlink:hover { color: #fff; text-decoration: underline; }
/* copyright bar */
.mq-copyright-wrap { background: #181a1b; border-top: 1px solid rgba(255,255,255,.1); padding: 10px 0; }
.mq-copyright { font-size: 12px; color: #999; }
.mq-copyright a, .mq-copyright a:hover { color: #fff; }

/* hamburger button */
.mq-hamburger { display: none; background: none; border: none; cursor: pointer; padding: 6px; flex-direction: column; gap: 5px; }
.mq-hamburger span { display: block; width: 24px; height: 2px; background: var(--gold); border-radius: 2px; transition: .25s; }

/* ══════════════════════════════════════
   RESPONSIVE — Tablet ≤900px
══════════════════════════════════════ */
/* scroll-to-top button */
#scroll-top {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px;
  align-items: center;
  justify-content: center;
  z-index: 999;
  transition: background .2s, transform .2s;
}
#scroll-top:hover { background: var(--red-h, #ff4d5a); transform: translateY(-2px); }

@media (max-width: 900px) {
  /* Header nav */
  .mq-navigation { display: none; }
  .mq-navigation.mq-nav--open { display: flex; flex-direction: column; position: absolute; top: 58px; left: 0; right: 0; background: linear-gradient(180deg,#0d1020,#111422); border-top: 1px solid rgba(201,168,76,.25); border-bottom: 1px solid rgba(201,168,76,.15); padding: 8px 0; z-index: 200; box-shadow: 0 8px 24px rgba(0,0,0,.6); }
  .mq-navigation.mq-nav--open ul { flex-direction: column; }
  .mq-navigation.mq-nav--open ul li a { padding: 12px 20px; font-size: 14px; display: block; border-bottom: 1px solid rgba(255,255,255,.04); }
  .mq-hamburger { display: flex; }

  /* Layout grids → 2 col */
  .dq-grid { grid-template-columns: repeat(2,1fr); }
  .uv-grid { grid-template-columns: repeat(2,1fr); }
  .np-grid { grid-template-columns: repeat(2,1fr); }
  .rx-grid { grid-template-columns: repeat(3,1fr); }
  .rx-bottom { grid-template-columns: repeat(2,1fr); }
  .rx-wrap { grid-template-columns: 1fr; }
  /* hero layout tablet */
  .rx-top { grid-template-columns: 1fr 1fr; }
  .rx-bottom-row { grid-template-columns: repeat(2,1fr); }
  .rx-side3 { flex-direction: row; overflow-x: auto; gap: 10px; }
  .rx-hero { grid-row: auto; }
  .tusw-grid { grid-template-columns: 1fr; }
  .tusw-col--left { border-right: none; padding-right: 0; border-bottom: 1px solid var(--border); padding-bottom: 10px; margin-bottom: 10px; }

  /* Page layouts → single col */
  .mq-home-columns { grid-template-columns: 1fr; }
  .mq-widget-col-1.mq-sidebar { position: static; }
  .wv-list-layout { grid-template-columns: 1fr; }
  .wv-show-layout { grid-template-columns: 1fr; }
  .wv-sidebar { position: static; }

  /* Footer */
  .mq-col-1-2 { float: none; width: 100%; margin-left: 0 !important; }
  .mq-footer-cols { grid-template-columns: repeat(2,1fr); }
  .wv-footer-cols { grid-template-columns: repeat(2,1fr); }

  /* Cards */
  .wv-gsw-list { grid-template-columns: repeat(2,1fr); }
  .wv-bonus-row { grid-template-columns: 1fr; }

  /* Review box — tablet */
  .wv-review-box-overlay { min-height: 200px; }
  .wv-review-box-content { flex-direction: column; align-items: flex-start; padding: 20px 18px; gap: 14px; }
  .wv-review-box-right { flex-direction: row; align-items: center; gap: 10px; width: 100%; }
  .wv-review-title { font-size: 22px; }

  /* List page items */
  .wv-rw-item { flex-wrap: wrap; gap: 10px; }
}

/* ══════════════════════════════════════
   RESPONSIVE — Mobile ≤600px
══════════════════════════════════════ */
@media (max-width: 600px) {
  /* Body spacing */
  body { padding-top: 58px; }

  /* Header — keep logo + hamburger only */
  .wv-auth-menu-item { display: none; }

  /* Hero section */
  .rx-grid { grid-template-columns: repeat(2,1fr); gap: 8px; }
  .rx-wrap { display: flex; flex-direction: column; }
  /* hero layout mobile */
  .rx-top { grid-template-columns: 1fr; }
  .rx-side-col { flex-direction: row; overflow-x: auto; }
  .rx-card--side { min-width: 140px; }
  .rx-bottom-row { grid-template-columns: repeat(2,1fr); }
  .rx-hero-thumbwrap { height: 200px; overflow: hidden; }
  .rx-hero-thumb { width: 100%; height: 200px; object-fit: cover; }
  .rx-hero-text { padding: 14px 14px 16px; }
  .rx-hero-title { font-size: 16px; }
  .rx-excerpt { font-size: 13px; }
  .rx-side3 { flex-direction: column; gap: 0; }
  .rx-side { border-top: 1px solid rgba(201,168,76,.08); }
  .rx-bottom { grid-template-columns: repeat(2,1fr); gap: 8px; }

  /* Trending slots */
  .tusw-grid--two-col { grid-template-columns: 1fr; }
  .tt-toggle { gap: 6px; }
  .tt-tab { font-size: 12px; padding: 6px 10px; }

  /* List widgets — keep 2 col on mobile */
  .dq-grid { grid-template-columns: repeat(2,1fr); gap: 8px; }
  .uv-grid { grid-template-columns: repeat(2,1fr); gap: 8px; }
  .np-grid { grid-template-columns: repeat(2,1fr); gap: 8px; }

  /* List page ranking items */
  .wv-rw-list { display: flex; flex-direction: column; gap: 10px; }
  .wv-rw-item { display: grid; grid-template-columns: 100px 1fr; grid-template-rows: auto auto; gap: 8px 12px; align-items: start; padding: 12px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; border-bottom: 1px solid var(--border); }
  .wv-rw-rank { display: none; }
  .wv-rw-thumb { width: 100px; height: 68px; grid-row: 1 / 3; border-radius: 6px; overflow: hidden; }
  .wv-rw-thumb img { width: 100px; height: 68px; object-fit: cover; }
  .wv-rw-main { grid-column: 2; }
  .wv-rw-title { font-size: 14px; white-space: normal; line-height: 1.3; }
  .wv-rw-info { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 11px; color: #888; margin-top: 3px; }
  .wv-rw-meta { font-size: 10px; margin-top: 4px; }
  .wv-rw-trend { display: none; }
  .wv-rw-scores { grid-column: 2; flex-direction: row; align-items: center; gap: 8px; min-width: 0; }
  .wv-rw-badge { min-width: 38px; padding: 4px 8px; font-size: 13px; border-radius: 4px; }
  .wv-rw-badge-label { display: none; }
  .wv-play-cta--sm { margin-top: 0; font-size: 11px; padding: 6px 14px; flex: 1; text-align: center; white-space: nowrap; }

  /* Filter bar */
  .wv-filter-bar { gap: 6px; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 8px 12px; }
  .wv-filter-bar::-webkit-scrollbar { display: none; }
  .wv-filter-btn { font-size: 12px; padding: 5px 12px; flex-shrink: 0; }

  /* Show page — review box */
  .wv-review-box-top { min-height: 0; background-color: #0d1020; }
  .wv-review-box-overlay { min-height: 0; background: linear-gradient(to bottom, rgba(11,14,26,.3) 0%, rgba(11,14,26,.75) 100%); padding: 20px 14px 20px; }
  .wv-review-box-content { padding: 0; flex-direction: column; align-items: flex-start; gap: 12px; }
  .wv-review-box-left { width: 100%; }
  .wv-review-title { font-size: 18px; margin-bottom: 8px; }
  .wv-play-cta--hero { display: flex !important; width: 100%; justify-content: center; font-size: 14px; padding: 10px 18px; box-sizing: border-box; }
  .wv-review-box-right { flex-direction: row; justify-content: flex-start; width: 100%; gap: 10px; }
  .wv-score-badge { min-width: 0; flex: 1; padding: 8px 10px; }
  .wv-score-val { font-size: 22px; }

  /* Show page — game stats */
  .wv-gsw-list { grid-template-columns: repeat(2,1fr); }

  /* Show page — score summary */
  .wv-score-summary { gap: 6px; }

  /* Sidebar → hidden on mobile show/list pages */
  .wv-show-layout .wv-sidebar,
  .wv-list-layout .wv-sidebar { display: none; }

  /* Bonus boxes → single col */
  .wv-bonus-row { grid-template-columns: 1fr; gap: 12px; }
  .wv-bonus-box { padding: 14px; }

  /* Tag cloud */
  .wv-tag { font-size: 11px; padding: 4px 10px; }

  /* Sidebar widgets on index — show limited */
  .mq-home-sidebar .mq-widget:nth-child(n+3) { display: none; }

  /* Footer */
  .mq-footer-cols { grid-template-columns: 1fr; }
  .mq-col-1-2 { width: 100%; float: none; margin-left: 0 !important; }
  #footertitletxt { font-size: 13px; }
  .navzlink { font-size: 12px; margin: 3px 4px; }
  .mq-copyright { font-size: 11px; text-align: center; }

  /* Scroll top button */
  #scroll-top { width: 36px; height: 36px; bottom: 16px; right: 16px; font-size: 16px; }
}

/* ══════════════════════════════════════
   RESPONSIVE — Small Mobile ≤400px
══════════════════════════════════════ */
@media (max-width: 400px) {
  .site-logo-text { font-size: 15px; max-width: 150px; }
  .rx-bottom { grid-template-columns: repeat(2,1fr); gap: 6px; }
  .dq-grid, .uv-grid, .np-grid { grid-template-columns: 1fr; gap: 6px; }
  .wv-gsw-list { grid-template-columns: 1fr 1fr; }
  .wv-score-val { font-size: 20px; }
  .wv-review-title { font-size: 16px; }
  .wv-filter-btn { font-size: 11px; padding: 4px 8px; }
}


/* ══════════════════════════════════════════════════════════════
   BNAV MOBILE — bwb theme
══════════════════════════════════════════════════════════════ */
.wv-bnav { display: none; }

@media (max-width: 960px) {
  .wv-bnav {
    display: flex !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
    padding: 0 0 env(safe-area-inset-bottom, 0px) !important;
    align-items: center !important;
    justify-content: space-around !important;
    gap: 0 !important;
    background: rgba(8,10,20,0.96) !important;
    border-top: 1px solid rgba(201,168,76,0.22) !important;
    border-radius: 0 !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.5) !important;
    z-index: 9999 !important;
  }
  .wv-bnav-link {
    flex: 1;
    min-width: 44px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    border-radius: 0;
    color: rgba(255,255,255,0.52);
    font-weight: 700;
    font-size: 9px;
    transition: background .15s, color .15s;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none;
    padding: 0 2px;
    cursor: pointer;
  }
  .wv-bnav-ico { font-size: 18px; line-height: 1; }
  .wv-bnav-txt {
    font-size: 9px; line-height: 1;
    white-space: nowrap; overflow: hidden;
    text-overflow: ellipsis; max-width: 100%;
  }
  .wv-bnav-link:hover,
  .wv-bnav-link.active {
    color: #fff;
    background: rgba(255,255,255,0.08);
  }
  .wv-bnav-link--cta {
    flex: 1.2;
    color: #fff !important;
    background: linear-gradient(135deg,#c9a84c,#e8c96a) !important;
    border-radius: 0;
    box-shadow: none;
    font-size: 9px;
  }
  .wv-bnav-link--cta:active { opacity: 0.85; }

  body {
    padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 390px) {
  .wv-bnav-ico { font-size: 16px !important; }
  .wv-bnav-txt { font-size: 8px !important; }
}



/* ══════════════════════════════════════════════════════════════
   FOOTER MOBILE DEEP — bwb / mh-footer
══════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {
  /* Collapse float columns */
  .mq-col-1-2 {
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .mq-footer {
    padding: 20px 14px 16px !important;
  }
  /* Widget titles smaller */
  #footertitletxt {
    font-size: 12px !important;
    margin-bottom: 8px !important;
  }
  /* Links: horizontal wrap pills */
  .navzlink {
    display: inline-block !important;
    font-size: 11.5px !important;
    padding: 3px 10px !important;
    margin: 3px !important;
    background: rgba(255,255,255,0.06) !important;
    border-radius: 5px !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
  }
  /* Copyright */
  .mq-copyright {
    font-size: 11px !important;
    text-align: center !important;
    padding: 10px 14px !important;
  }
}

@media (max-width: 390px) {
  .mq-footer { padding: 16px 12px 12px !important; }
  .navzlink { font-size: 11px !important; padding: 2px 8px !important; }
}

/* — */

/* ── List hero header ── */
.wv-list-hd { background: linear-gradient(135deg, #1a0010 0%, #0d0010 50%, #10001a 100%); border: 1px solid rgba(221,51,51,.18); border-radius: var(--radius); padding: 32px 28px; margin-bottom: 20px; }
.wv-list-hd-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.wv-list-hd-left { flex: 1; min-width: 0; }
.wv-list-hd-tag { display: inline-block; font-size: 11px; font-weight: 700; color: var(--red); background: rgba(221,51,51,.12); border: 1px solid rgba(221,51,51,.25); border-radius: 20px; padding: 3px 12px; margin-bottom: 10px; text-transform: uppercase; letter-spacing: .5px; }
.wv-list-hd-title { font-size: 28px; font-weight: 900; color: #fff; margin-bottom: 8px; line-height: 1.2; }
.wv-list-hd-desc { font-size: 13px; color: #888; line-height: 1.6; }
.wv-list-hd-stats { display: flex; align-items: center; gap: 0; flex-shrink: 0; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 14px 20px; }
.wv-list-hd-stat { text-align: center; padding: 0 18px; }
.wv-list-hd-stat-val { display: block; font-size: 22px; font-weight: 900; color: var(--amber); line-height: 1.1; }
.wv-list-hd-stat-lbl { display: block; font-size: 10px; color: #777; margin-top: 3px; text-transform: uppercase; letter-spacing: .5px; }
.wv-list-hd-stat-div { width: 1px; height: 36px; background: rgba(255,255,255,.1); }

/* ── Improved rw-item card: larger thumb + overlay + description ── */
.wv-rw-thumb { position: relative; flex-shrink: 0; width: 160px; height: 100px; border-radius: 6px; overflow: hidden; display: block; }
.wv-rw-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.wv-rw-item:hover .wv-rw-thumb img { transform: scale(1.06); }
.wv-rw-thumb-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .2s; }
.wv-rw-item:hover .wv-rw-thumb-overlay { opacity: 1; }
.wv-rw-thumb-play { font-size: 22px; color: #fff; text-shadow: 0 2px 8px rgba(0,0,0,.6); }
.wv-rw-item-top { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.wv-rw-rtp-badge { font-size: 11px; color: #27ae60; font-weight: 600; background: rgba(39,174,96,.12); border: 1px solid rgba(39,174,96,.25); border-radius: 10px; padding: 2px 8px; }
.wv-rw-info { font-size: 12px; color: #888; line-height: 1.55; margin-top: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wv-rw-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; gap: 8px; }
.wv-rw-date { font-size: 11px; color: #555; }
.wv-rw-readmore { font-size: 12px; color: var(--red); font-weight: 600; white-space: nowrap; }
.wv-rw-readmore:hover { color: #fff; }

/* ── List SEO box ── */
.wv-list-seo-box { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px 20px; margin-top: 24px; }
.wv-list-seo-title { font-size: 14px; font-weight: 800; color: #ccc; margin-bottom: 8px; }
.wv-list-seo-text { font-size: 12px; color: #777; line-height: 1.7; margin: 0; }

/* ── Sidebar CTA block ── */
.wv-sb-cta-block { text-align: center; background: linear-gradient(135deg, #1a0005, #150018); border: 1px solid rgba(221,51,51,.2) !important; }
.wv-sb-cta-icon { font-size: 32px; margin-bottom: 8px; }
.wv-sb-cta-title { font-size: 16px; font-weight: 800; color: #fff; margin-bottom: 4px; }
.wv-sb-cta-desc { font-size: 12px; color: #888; margin-bottom: 14px; }

/* ── Show page: game hero ── */
.wv-game-hd { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin-bottom: 22px; }
.wv-game-hd-body { display: flex; gap: 24px; padding: 24px 24px 20px; }
.wv-game-hd-cover { width: 240px; height: 170px; flex-shrink: 0; border-radius: var(--radius); overflow: hidden; position: relative; }
.wv-game-hd-cover img { width: 100%; height: 100%; object-fit: cover; }
.wv-game-hd-cover-badges { position: absolute; top: 8px; left: 8px; display: flex; gap: 5px; }
.wv-game-hd-badge { font-size: 10px; font-weight: 800; padding: 3px 8px; border-radius: 4px; }
.wv-game-hd-badge--hot { background: var(--red); color: #fff; }
.wv-game-hd-badge--free { background: #27ae60; color: #fff; }
.wv-game-hd-info { flex: 1; min-width: 0; }
.wv-game-hd-cat { font-size: 12px; color: #888; margin-bottom: 8px; }
.wv-game-hd-title { font-size: 1.6rem; font-weight: 700; color: #fff; margin-bottom: 12px; line-height: 1.25; }
.wv-game-hd-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.wv-game-hd-score-wrap { display: flex; align-items: baseline; gap: 4px; }
.wv-score-big { font-size: 1.9rem; font-weight: 800; color: var(--gold); line-height: 1; }
.wv-score-sub { font-size: 13px; color: #888; }
.wv-score-stars { font-size: 13px; color: var(--gold); margin-left: 4px; }
.wv-provider-tag { background: rgba(201,168,76,0.15); border: 1px solid rgba(201,168,76,0.3); color: var(--gold); font-size: 12px; font-weight: 600; padding: 4px 11px; border-radius: 6px; }
.wv-badge-rtp { background: rgba(39,174,96,0.15); border: 1px solid rgba(39,174,96,0.3); color: #27ae60; font-size: 12px; font-weight: 700; padding: 4px 11px; border-radius: 6px; }
.wv-game-hd-desc { font-size: 13.5px; color: #999; line-height: 1.6; margin-bottom: 16px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wv-game-hd-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.wv-play-cta--hero { display: inline-flex; align-items: center; gap: 6px; padding: 10px 22px; border-radius: 9px; font-size: 13.5px; font-weight: 700; text-decoration: none; cursor: pointer; box-sizing: border-box; background: linear-gradient(135deg, #c9a84c, #a07830); color: #fff; box-shadow: 0 6px 20px rgba(201,168,76,0.30); border: 1px solid transparent; transition: opacity .15s, transform .15s; }
.wv-play-cta--hero:hover { opacity: .9; transform: translateY(-1px); }
.wv-game-hd-btn-ghost { display: inline-flex; align-items: center; gap: 6px; padding: 10px 22px; border-radius: 9px; font-size: 13.5px; font-weight: 700; text-decoration: none; cursor: pointer; box-sizing: border-box; background: rgba(255,255,255,0.06); border: 1px solid var(--border); color: #ccc; transition: opacity .15s, transform .15s; }
.wv-game-hd-btn-ghost:hover { background: rgba(255,255,255,0.10); color: #fff; }

/* ── Show page: quick stat strip ── */
.wv-game-hd-strip { display: flex; align-items: center; background: rgba(255,255,255,.03); border-top: 1px solid var(--border); padding: 12px 20px; gap: 0; overflow-x: auto; }
.wv-game-hd-strip-item { text-align: center; flex: 1; padding: 0 16px; min-width: 0; }
.wv-ghs-lbl { display: block; font-size: 10px; color: #666; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 3px; white-space: nowrap; }
.wv-ghs-val { display: block; font-size: 15px; font-weight: 800; color: #fff; white-space: nowrap; }
.wv-ghs-val--green { color: #27ae60; }
.wv-ghs-val--gold { color: var(--amber); }
.wv-ghs-val--red { color: var(--red); }
.wv-game-hd-strip-div { width: 1px; height: 32px; background: rgba(255,255,255,.08); flex-shrink: 0; }

/* ── Show page: mobile-only CTA (hidden desktop) ── */
.wv-show-mobile-cta { display: none; margin-bottom: 20px; }
.wv-show-mobile-cta-btn { display: block; width: 100%; text-align: center; background: linear-gradient(135deg, #c9a84c, #a07830); color: #1a1200; font-weight: 900; font-size: 15px; padding: 14px 20px; border-radius: 30px; box-sizing: border-box; }

/* ── Show page: related articles list ── */
.wv-related-section { margin-bottom: 22px; }
.wv-related-title { font-size: 15px; font-weight: 800; color: #fff; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.wv-related-list { display: flex; flex-direction: column; gap: 0; }
.wv-related-item { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.wv-related-item:last-child { border-bottom: none; }
.wv-related-item img { width: 64px; height: 48px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.wv-related-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.wv-related-item-title { font-size: 13px; color: #ccc; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wv-related-item:hover .wv-related-item-title { color: var(--red); }
.wv-related-item-date { font-size: 11px; color: #555; }

/* ── Quick info table in sidebar ── */
.wv-quick-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.wv-quick-table tr { border-bottom: 1px solid var(--border); }
.wv-quick-table tr:last-child { border-bottom: none; }
.wv-quick-table td { padding: 7px 4px; color: #888; }
.wv-quick-table td:first-child { color: #666; }
.wv-quick-table td.green { color: #27ae60; font-weight: 700; }
.wv-quick-table td.gold { color: var(--amber); font-weight: 700; }
.wv-quick-table td.accent { color: var(--red); font-weight: 700; }

/* ── Tag intro block ── */
.wv-tag-intro { background: var(--bg-card); border: 1px solid var(--border); border-left: 3px solid var(--red); border-radius: var(--radius); padding: 16px 20px; margin-bottom: 20px; }
.wv-tag-intro-title { font-size: 14px; color: var(--amber); font-weight: 800; margin-bottom: 8px; }
.wv-tag-intro-desc { font-size: 13px; color: #888; line-height: 1.75; margin: 0; }
.wv-tag-intro-desc a { color: var(--amber); }
.wv-tag-intro-desc a:hover { text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════
   MOBILE — 900px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .wv-list-hd { padding: 22px 18px; }
  .wv-list-hd-title { font-size: 22px; }
  .wv-list-hd-stats { padding: 10px 14px; }
  .wv-list-hd-stat { padding: 0 12px; }
  .wv-list-hd-stat-val { font-size: 18px; }
  .wv-game-hd-cover { width: 200px; height: 142px; }
  .wv-game-hd-body { gap: 18px; padding: 18px; }
  .wv-game-hd-strip-item { padding: 0 10px; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE — 600px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {
  /* List hero */
  .wv-list-hd { padding: 18px 14px; }
  .wv-list-hd-inner { flex-direction: column; gap: 14px; align-items: flex-start; }
  .wv-list-hd-title { font-size: 18px; }
  .wv-list-hd-stats { width: 100%; box-sizing: border-box; justify-content: space-around; padding: 10px 0; }
  .wv-list-hd-stat { padding: 0 8px; }
  .wv-list-hd-stat-val { font-size: 16px; }

  /* rw-item: compact 2-col card */
  .wv-rw-item { display: grid; grid-template-columns: 110px 1fr; grid-template-rows: auto auto; gap: 0 10px; align-items: start; padding: 12px 0; }
  .wv-rw-rank { display: none; }
  .wv-rw-thumb { width: 110px; height: 72px; grid-row: 1 / 3; }
  .wv-rw-main { grid-column: 2; grid-row: 1; min-width: 0; }
  .wv-rw-scores { grid-column: 2; grid-row: 2; flex-direction: row; align-items: center; gap: 8px; margin-top: 6px; min-width: 0; }
  .wv-rw-badge { font-size: 13px; padding: 4px 8px; min-width: 36px; }
  .wv-rw-badge-label { font-size: 9px; }
  .wv-play-cta--sm { flex: 1; text-align: center; margin-top: 0; font-size: 11px; padding: 5px 10px; }

  /* Game hero on show page: stack vertically */
  .wv-game-hd-body { flex-direction: column; padding: 14px; gap: 14px; }
  .wv-game-hd-cover { width: 100%; height: auto; max-width: 300px; margin: 0 auto; }
  .wv-game-hd-cover img { height: auto; }
  .wv-game-hd-title { font-size: 1.2rem; }
  .wv-score-big { font-size: 1.5rem; }
  .wv-game-hd-actions { flex-direction: column; }
  .wv-play-cta--hero { display: flex; width: 100%; justify-content: center; }
  .wv-game-hd-btn-ghost { display: flex; width: 100%; justify-content: center; }
  .wv-game-hd-strip { padding: 10px 10px; gap: 0; }
  .wv-game-hd-strip-item { padding: 0 6px; }
  .wv-ghs-val { font-size: 13px; }
  .wv-ghs-lbl { font-size: 9px; }

  /* Mobile-only CTA: show on mobile */
  .wv-show-mobile-cta { display: block; }

  /* Tag intro */
  .wv-tag-intro { padding: 12px 14px; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE — 400px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 400px) {
  .wv-list-hd-title { font-size: 16px; }
  .wv-rw-thumb { width: 90px; height: 60px; }
  .wv-rw-item { grid-template-columns: 90px 1fr; }
  .wv-ghs-lbl { display: none; }
}