:root{--tqp3-bg:#10141b;--tqp3-row:#151b25;--tqp3-row2:#1a2230;--tqp3-line:#232d3f;--tqp3-txt:#e6ebf4;--tqp3-dim:#93a1b8;--tqp3-grn:#4b16c5;--tqp3-red:#ea3943;--tqp3-yel:#f3ba2f;--tqp3-btn:#4b16c5}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--tqp3-bg);color:var(--tqp3-txt);font:15.5px/1.65 "Barlow",sans-serif}
.tqp3-wrap{max-width:1100px;margin:0 auto;padding:0 20px}
a{color:var(--tqp3-grn)}
.tqp3-league{background:#0b0e14;border-bottom:1px solid var(--tqp3-line);font-size:12px;color:var(--tqp3-dim);overflow:hidden;white-space:nowrap}
.tqp3-league .tqp3-wrap{display:flex;gap:26px;padding:7px 20px}
.tqp3-league b{color:var(--tqp3-yel)}
.tqp3-head{position:sticky;top:0;z-index:9;background:#0d1118;border-bottom:1px solid var(--tqp3-line)}
.tqp3-head .tqp3-wrap{display:flex;align-items:center;justify-content:space-between;height:62px;gap:16px}
.tqp3-logo{font-family:"Oswald",sans-serif;font-size:23px;text-transform:uppercase;letter-spacing:1px;color:var(--tqp3-txt);text-decoration:none}
.tqp3-logo b{color:var(--tqp3-grn)}
.tqp3-nav{display:flex;gap:4px}
.tqp3-nav a{color:var(--tqp3-dim);text-decoration:none;font-size:13px;text-transform:uppercase;letter-spacing:.6px;padding:7px 11px;border-radius:6px}
.tqp3-nav a:hover{background:var(--tqp3-row2);color:var(--tqp3-txt)}
.tqp3-cta{background:var(--tqp3-grn);color:#06281b;font-weight:800;text-transform:uppercase;font-size:13px;padding:10px 20px;border-radius:6px;text-decoration:none;font-family:"Oswald",sans-serif;letter-spacing:.6px}
.tqp3-hero{padding:54px 0 26px;border-bottom:1px solid var(--tqp3-line);background:linear-gradient(180deg,#131926,#10141b)}
.tqp3-live{display:inline-flex;align-items:center;gap:8px;background:rgba(234,57,67,.12);border:1px solid rgba(234,57,67,.5);color:#ff8f95;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:6px 13px;border-radius:5px}
.tqp3-live i{width:8px;height:8px;border-radius:50%;background:var(--tqp3-red);animation:tqp3-pulse 1.2s infinite}
@keyframes tqp3-pulse{50%{opacity:.35}}
.tqp3-hero h1{font-family:"Oswald",sans-serif;text-transform:uppercase;font-size:clamp(30px,4.8vw,48px);line-height:1.08;margin:16px 0 10px;letter-spacing:.5px}
.tqp3-hero h1 em{font-style:normal;color:var(--tqp3-grn)}
.tqp3-lead{color:var(--tqp3-dim)}
.tqp3-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--tqp3-line);border:1px solid var(--tqp3-line);border-radius:10px;overflow:hidden;margin:30px 0 0}
.tqp3-board div{background:var(--tqp3-row);padding:14px 16px}
.tqp3-board b{font-family:"Oswald",sans-serif;font-size:22px;color:var(--tqp3-grn);display:block}
.tqp3-board span{font-size:11.5px;text-transform:uppercase;letter-spacing:1px;color:var(--tqp3-dim)}
section{padding:34px 0 6px}
.tqp3-sechead{display:flex;align-items:center;gap:12px;border-left:4px solid var(--tqp3-grn);padding-left:14px;margin-bottom:14px}
section h2{font-family:"Oswald",sans-serif;text-transform:uppercase;font-size:clamp(21px,2.8vw,28px);margin:0;letter-spacing:.5px}
.tqp3-sectag{font-size:11px;color:var(--tqp3-yel);border:1px solid rgba(243,186,47,.45);padding:3px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:1px}
section h3{font-family:"Oswald",sans-serif;text-transform:uppercase;font-size:16px;color:#c6d2e4}
.tqp3-tbl-wrap{overflow-x:auto;margin:14px 0;border:1px solid var(--tqp3-line);border-radius:10px}
table{border-collapse:collapse;width:100%;font-size:14px}
caption{text-align:left;padding:10px 14px;color:var(--tqp3-dim);font-size:12.5px;text-transform:uppercase;letter-spacing:.8px}
th{background:#0d1118;color:var(--tqp3-dim);text-transform:uppercase;font-size:12px;letter-spacing:.8px;padding:10px 14px;text-align:left}
td{padding:10px 14px;border-top:1px solid var(--tqp3-line)}
tbody tr:nth-child(odd) td{background:var(--tqp3-row)}
tbody tr:nth-child(even) td{background:var(--tqp3-row2)}
td:first-child{font-weight:700}
ul,ol{padding-left:22px}li{margin:7px 0}
ul li::marker{color:var(--tqp3-grn)}
.tqp3-note{border:1px solid rgba(243,186,47,.4);background:rgba(243,186,47,.07);color:#ffe9ad;border-radius:8px;padding:13px 17px;margin:16px 0;font-size:14px}
.tqp3-faqrow{border:1px solid var(--tqp3-line);border-radius:8px;background:var(--tqp3-row);margin:9px 0}
.tqp3-faqrow summary{cursor:pointer;padding:13px 17px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:10px}
.tqp3-faqrow summary::after{content:"▾";color:var(--tqp3-grn)}
.tqp3-faqrow[open] summary::after{content:"▴"}
.tqp3-faqrow div{padding:0 17px 14px;color:var(--tqp3-dim)}
footer{border-top:1px solid var(--tqp3-line);margin-top:48px;padding:26px 0;color:var(--tqp3-dim);font-size:13px}
@media(max-width:820px){.tqp3-nav{display:none}}

/* tqp3 button classes (added to match listing-wrapper markup) */
.tqp3-btn{display:inline-block;text-decoration:none;font-weight:700;border-radius:6px;padding:12px 24px;font-size:13px;text-align:center;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.6px;cursor:pointer;border:none}
.tqp3-btn-p{background:linear-gradient(90deg,var(--tqp3-grn),var(--tqp3-yel));color:#06281b}
.tqp3-btn-g{border:1px solid var(--tqp3-line);color:var(--tqp3-txt);background:rgba(230,235,244,.04)}

/* listing */
.listing-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}


/* Контейнер карточки */
.listing {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: #1f1630;
  border: 1px solid #a196bc2e;
  border-radius: 14px;
  padding: 20px 24px;
}

.info-section {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 240px;
}

.logo-box {
  width: 70px;
  height: 70px;
  background-color: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.logo-box img {
  max-width: 80%;
  max-height: 80%;
  object-fit: contain;
}

.details {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.badge {
  background-color: #97278e;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.name {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
}


.rating-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.stars {
  color: #ffc107;
  font-size: 14px;
  letter-spacing: 1px;
}

.rating-value {
  font-size: 13px;
  font-weight: 600;
  color: #22d3ee;
}


.bonus-section {
  flex: 1;
  border: 1px solid #a196bc2e;
  border-radius: 8px;
  padding: 14px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 4px;
  align-self: stretch;
}

.bonus-title {
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 6px;
}

.bonus-text {
  font-size: 16px;
  font-weight: bold;
  color: #df2c3d;
}

/* Секция Кнопок */
.buttons-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 170px;
}

@media (max-width: 768px) {
  .listing {
    flex-direction: column;
    align-items: stretch;
  }

  .buttons-section {
    width: 100%;
  }
}

button.tqp3-btn {
  text-align: center;
  border: 1px solid #a196bc2e;
  color: #fff;
  background-color: #1f1630;
}