/* =====================================================================
   Bukmekerlar Reytingi — V3 «Minimal ishonch» · umumiy stil (br3.css)
   Bitta fayl butun sayt uchun. Klasslar: .br3-* (to'qnashuvsiz).
   Har bir sahifa responsive: 64rem (planshet) va 48rem (telefon).
   ===================================================================== */
:root{
  --br3-navy-900:#0B2239; --br3-navy-800:#0E2A47; --br3-navy-700:#16365A;
  --br3-text:#33414F; --br3-muted:#5A6B7B; --br3-faint:#7A8898;
  --br3-page:#F5F8FB; --br3-card:#FFFFFF;
  --br3-border:#E4EAF1; --br3-border-soft:#E8EDF3; --br3-divider:#EEF2F6;
  --br3-emerald:#0E8A57; --br3-emerald-strong:#0E6E47; --br3-emerald-bright:#46CC8E; --br3-emerald-soft:#E7F6EF;
  --br3-gold:#E2A52C; --br3-gold-hover:#C99522; --br3-gold-soft:#FCF7E9; --br3-gold-line:#EBDBAE; --br3-gold-ink:#A9781A;
  --br3-score:#15803D; --br3-risk:#C0362C; --br3-risk-soft:#FBEDE9;
  --br3-font-display:'Sora',system-ui,sans-serif;
  --br3-font-text:'Hanken Grotesk',system-ui,sans-serif;
  --br3-r-card:16px; --br3-r-btn:11px;
  --br3-shadow-card:inset 0 0 0 1px #E8EDF3,0 6px 16px rgba(11,34,57,.05);
  --br3-shadow-featured:inset 0 0 0 1px #ECD79A,0 1px 3px rgba(11,34,57,.06),0 18px 40px rgba(176,125,20,.10);
  --br3-shadow-cta:0 10px 22px rgba(226,165,44,.30);
}
/* ТЗ-280 §11.1 coexistence gate: the five site-wide element resets are scoped
   to body.br3-on so brv2 (not-yet-migrated) surfaces are untouched. The class is
   added to every brv2-chrome route once the header/footer migrate (§11.3), which
   makes these resets global exactly when br3 owns the chrome — as the design
   intends. Do NOT drop the gate before the final brv2 removal phase. */
body.br3-on *{box-sizing:border-box}
body.br3-on{margin:0;padding:0;background:var(--br3-page);color:var(--br3-text);font:16px/1.55 var(--br3-font-text);-webkit-font-smoothing:antialiased}
body.br3-on a{text-decoration:none;color:inherit}
body.br3-on img{display:block;max-width:100%}
.br3-wrap{max-width:1216px;margin:0 auto;padding:0 32px}
.br3-num{font-variant-numeric:tabular-nums}
.br3-kick{font:700 11.5px var(--br3-font-display);letter-spacing:.09em;text-transform:uppercase;color:var(--br3-emerald-bright)}
main .br3-kick,.br3-sec .br3-kick{color:var(--br3-emerald-strong)}

/* ---------- Header ---------- */
.br3-header{background:var(--br3-navy-800);position:relative;z-index:50}
.br3-header__in{display:flex;align-items:center;gap:24px;height:72px}
.br3-brand{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.br3-brand svg{display:block;border-radius:11px}
.br3-brand b{font:800 16px var(--br3-font-display);color:#fff;letter-spacing:-.01em}
.br3-brand b span{color:var(--br3-emerald-bright)}
.br3-nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.br3-nav a{display:inline-flex;align-items:center;height:38px;padding:0 13px;border-radius:9px;color:#C7D6E6;font:600 14px var(--br3-font-display)}
.br3-nav a:hover{color:#fff;background:rgba(255,255,255,.07)}
.br3-nav a[aria-current]{color:#fff;background:rgba(70,204,142,.15)}
.br3-age{display:inline-flex;align-items:center;height:30px;padding:0 11px;border-radius:8px;border:1px solid rgba(255,255,255,.2);color:#9DB2C6;font:700 12px var(--br3-font-display);flex:0 0 auto}
.br3-burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;background:none;border:0;color:#fff;margin-left:auto;cursor:pointer}
/* mobil menyu overlay */
.br3-menu{display:none;position:fixed;inset:0;z-index:60;background:var(--br3-navy-800);padding:14px 16px;overflow:auto}
.br3-menu.is-open{display:block}
.br3-menu__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.br3-menu__close{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:rgba(255,255,255,.08);border:0;color:#fff;cursor:pointer}
.br3-menu nav{display:flex;flex-direction:column;gap:2px}
.br3-menu nav a{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:0 16px;border-radius:13px;color:#E2EAF2;font:600 16px var(--br3-font-display)}
.br3-menu nav a[aria-current]{background:rgba(70,204,142,.15);color:#fff;font-weight:700}
.br3-menu__foot{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:16px;color:#6E839A;font-size:11.5px}
.br3-menu__foot .br3-age{color:#E08C84;border-color:rgba(192,54,44,.4)}

/* ---------- Sahifa hero (ichki sahifalar) ---------- */
.br3-crumbs{background:var(--br3-navy-800)}
.br3-crumbs__in{display:flex;align-items:center;gap:8px;height:46px;font-size:12.5px;color:#9DB2C6}
body.br3-on .br3-crumbs a{color:#9DB2C6}
.br3-crumbs a:hover{color:#fff}
.br3-crumbs i{font-style:normal;color:#4C6178}
.br3-crumbs b{color:#fff;font-weight:700;font-family:var(--br3-font-display)}
.br3-crumbs .br3-age{margin-left:auto;height:26px;font-size:11px}
.br3-phero{padding:34px 0 6px}
.br3-phero h1{font:800 clamp(26px,3vw,34px)/1.12 var(--br3-font-display);letter-spacing:-.018em;color:var(--br3-navy-900);margin:8px 0 0;text-wrap:balance}
.br3-phero p{font-size:15.5px;line-height:1.6;color:var(--br3-muted);margin:10px 0 0;max-width:700px;text-wrap:pretty}

/* ---------- Tugmalar ---------- */
.br3-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 18px;border-radius:var(--br3-r-btn);font:700 14px var(--br3-font-display);cursor:pointer;border:0;transition:background .15s,box-shadow .15s}
.br3-btn svg{flex:0 0 auto}
.br3-btn--go{background:var(--br3-gold);color:#2A2207}
.br3-btn--go:hover{background:var(--br3-gold-hover)}
.br3-btn--go.is-hero{box-shadow:var(--br3-shadow-cta)}
.br3-btn--rev{background:transparent;color:var(--br3-navy-800);box-shadow:inset 0 0 0 1.5px #D5DEE7}
.br3-btn--rev:hover{box-shadow:inset 0 0 0 1.5px #AFC0CF}
.br3-btn--ghostw{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}
.br3-btn--ghostw:hover{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.br3-btn--more{width:100%;height:52px;background:#fff;color:var(--br3-emerald-strong);box-shadow:inset 0 0 0 1.5px #CBE0D6}
.br3-btn--more:hover{box-shadow:inset 0 0 0 1.5px var(--br3-emerald)}
@media (prefers-reduced-motion:reduce){.br3-btn{transition:none}}

/* ---------- Logo slot (haqiqiy PNG/SVG uchun) ---------- */
.br3-logo{position:relative;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #E7EDF3;border-radius:13px;overflow:hidden;flex:0 0 auto;width:56px;height:56px}
.br3-logo::after{content:"";position:absolute;left:24%;right:24%;bottom:6px;height:3px;border-radius:2px;background:var(--book-accent,var(--br3-emerald))}
.br3-logo img{width:78%;height:60%;object-fit:contain}
.br3-logo .br3-mono{font:800 var(--mono-size,15px) var(--br3-font-display);color:var(--book-accent,var(--br3-emerald))}

/* ---------- Ball halqasi ---------- */
.br3-ring{position:relative;width:56px;height:56px;flex:0 0 auto}
.br3-ring text{font:800 16px var(--br3-font-display)}
.br3-ring--lg{width:72px;height:72px}
.br3-ring--lg text{font-size:15px}

/* ---------- Chiplar / sortbar ---------- */
.br3-sortbar{position:sticky;top:0;z-index:30;margin-top:18px;background:rgba(245,248,251,.92);backdrop-filter:blur(8px);border-top:1px solid var(--br3-border-soft);border-bottom:1px solid var(--br3-border-soft)}
.br3-sortbar__in{display:flex;align-items:center;gap:8px;padding:12px 0;overflow-x:auto;scrollbar-width:none}
.br3-sortbar__in::-webkit-scrollbar{display:none}
.br3-chip{flex:0 0 auto;display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:10px;border:1px solid #D9E3EC;background:#fff;color:var(--br3-text);font:600 13.5px var(--br3-font-display);cursor:pointer}
.br3-chip[aria-pressed="true"]{background:var(--br3-emerald);border-color:var(--br3-emerald);color:#fff;font-weight:700}
.br3-sortbar__upd{margin-left:auto;flex:0 0 auto;font:500 12.5px var(--br3-font-text);color:var(--br3-faint);display:inline-flex;align-items:center;gap:6px}
.br3-chiprow{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}

/* ---------- Reyting qatorlari (bosh sahifa) ---------- */
.br3-list{display:flex;flex-direction:column;gap:14px;padding:26px 0 0}
.br3-row{display:grid;grid-template-columns:44px 64px minmax(0,1fr) 66px 172px 118px 218px;gap:18px;align-items:center;background:var(--br3-card);border-radius:var(--br3-r-card);box-shadow:var(--br3-shadow-card);padding:18px 22px}
.br3-row--top{box-shadow:var(--br3-shadow-featured);border-top:3px solid var(--br3-gold)}
.br3-rank{font:800 15px var(--br3-font-display);color:var(--br3-faint);text-align:center}
.br3-row--top .br3-rank{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:var(--br3-gold);color:#2A2207;margin:0 auto}
.br3-id{min-width:0}
.br3-id__name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.br3-id__name b{font:800 18px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-id__checked{display:inline-flex;align-items:center;gap:5px;font:500 12px var(--br3-font-text);color:var(--br3-faint)}
.br3-id__why{display:flex;align-items:center;gap:7px;font:500 13.5px var(--br3-font-text);color:var(--br3-muted);margin-top:5px;overflow-wrap:anywhere}
.br3-id__why svg{color:var(--br3-emerald);flex:0 0 auto}
.br3-fact b{display:block;font:600 10px var(--br3-font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--br3-faint);margin-bottom:3px}
.br3-fact--bonus b{color:var(--br3-gold-ink)}
.br3-fact strong{font:800 16.5px var(--br3-font-display);color:var(--br3-navy-900);white-space:nowrap}
.br3-fact span{font:600 15px var(--br3-font-text);color:var(--br3-score)}
.br3-row__act{display:flex;gap:8px;justify-content:flex-end}
.br3-row__act .br3-btn--go{flex:1;max-width:132px}
.br3-more{margin-top:16px}
.br3-note{font:400 12.5px/1.55 var(--br3-font-text);color:var(--br3-faint);margin:16px 0 0;text-wrap:pretty}
body.br3-on .br3-note a{color:var(--br3-emerald-strong);font-weight:600}

/* ---------- Seksiya ---------- */
.br3-sec{padding:44px 0 8px}
.br3-sec__head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px}
.br3-sec h2{font:800 26px var(--br3-font-display);letter-spacing:-.015em;color:var(--br3-navy-900);margin:8px 0 0}
.br3-sec__link{font:600 14px var(--br3-font-text);color:var(--br3-emerald-strong);flex:0 0 auto}

/* ---------- Karta (umumiy oq karta) ---------- */
.br3-card{background:var(--br3-card);border-radius:var(--br3-r-card);box-shadow:var(--br3-shadow-card)}

/* ---------- Bonus kartalari ---------- */
.br3-bonuses{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.br3-btile{display:flex;align-items:center;gap:13px;background:#fff;border-radius:14px;box-shadow:var(--br3-shadow-card);padding:15px 17px}
.br3-btile .br3-logo{width:44px;height:44px;border-radius:11px}
.br3-btile__t{min-width:0;flex:1}
.br3-btile__t b{display:block;font:700 14px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-btile__t span{font:600 13px var(--br3-font-text);color:var(--br3-gold-ink);white-space:nowrap}
.br3-btile a{flex:0 0 auto;display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:9px;background:var(--br3-gold);color:#2A2207;font:700 12.5px var(--br3-font-display)}
.br3-btile a:hover{background:var(--br3-gold-hover)}
/* katta bonus kartasi (/bonuses/) */
.br3-bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:18px}
.br3-bcard{background:#fff;border-radius:var(--br3-r-card);box-shadow:var(--br3-shadow-card);overflow:hidden}
.br3-bcard--top{box-shadow:var(--br3-shadow-featured);border-top:3px solid var(--br3-gold)}
.br3-bcard__head{display:flex;align-items:center;gap:11px;padding:15px 18px;border-bottom:1px solid #F0E7C9;background:var(--br3-gold-soft)}
.br3-bcard__head .br3-logo{width:38px;height:38px;border-radius:10px}
.br3-bcard__head b{display:block;font:800 16px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-bcard__head small{font:600 11px var(--br3-font-text);color:var(--br3-faint)}
.br3-bcard--top .br3-bcard__head small{color:var(--br3-gold-ink)}
.br3-bcard__wager{margin-left:auto;font:700 12px var(--br3-font-display);color:var(--br3-gold-ink)}
.br3-bcard__body{padding:18px}
.br3-bcard__kick{font:600 11px var(--br3-font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--br3-gold-ink)}
.br3-bcard__amt{font:800 22px var(--br3-font-display);color:var(--br3-navy-900);margin-top:3px}
.br3-bcard__meta{display:flex;gap:8px;margin-top:14px}
.br3-bcard__meta .br3-mt{flex:1;text-align:center}
.br3-mt{background:#FBFCFE;border:1px solid var(--br3-border-soft);border-radius:11px;padding:9px 12px}
.br3-mt b{display:block;font:600 10px var(--br3-font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--br3-faint);margin-bottom:3px}
.br3-mt span{font:700 14px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-bcard .br3-btn{width:100%;margin-top:14px}

/* ---------- Qadamlar (3 step) ---------- */
.br3-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-top:14px}
.br3-step{background:#fff;border-radius:14px;box-shadow:var(--br3-shadow-card);padding:20px}
.br3-step i{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:var(--br3-emerald-soft);color:var(--br3-emerald-strong);font:800 14px var(--br3-font-display);font-style:normal}
.br3-step i.is-gold{background:#FBF4DE;color:var(--br3-gold-ink)}
.br3-step h3{font:700 15px var(--br3-font-display);color:var(--br3-navy-900);margin:12px 0 0}
.br3-step p{font:400 13.5px/1.55 var(--br3-font-text);color:var(--br3-muted);margin:6px 0 0;text-wrap:pretty}

/* ---------- Jadval (solishtirish / to'lovlar / test-lab) ---------- */
.br3-tblwrap{position:relative;background:#fff;border-radius:var(--br3-r-card);box-shadow:var(--br3-shadow-card);overflow:hidden}
.br3-tblscroll{overflow-x:auto;scrollbar-width:thin}
.br3-tbl{border-collapse:separate;border-spacing:0;width:100%;font:400 14px var(--br3-font-text);color:var(--br3-text)}
.br3-tbl th,.br3-tbl td{padding:13px 14px;text-align:center;border-bottom:1px solid var(--br3-divider);white-space:nowrap}
.br3-tbl thead th{background:var(--br3-navy-800);color:#fff;font:700 12.5px var(--br3-font-display);border-bottom:0}
.br3-tbl thead th.is-lead{color:#fff}
.br3-tbl tbody tr:last-child td{border-bottom:0}
.br3-tbl .is-lead{text-align:left;font:700 14px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-tbl td.is-lead .br3-logo{width:34px;height:34px;border-radius:9px}
.br3-tbl .is-cellrow{display:flex;align-items:center;gap:10px}
.br3-tbl .is-best{background:#FDFBF4}
.br3-tbl thead th.is-best{background:var(--br3-navy-700)}
.br3-tbl .is-good{color:var(--br3-score);font-weight:700}
.br3-tbl .is-score{font:800 15px var(--br3-font-display);color:var(--br3-score)}
.br3-tblhint{display:none;align-items:center;gap:7px;margin:12px 0 0;background:#F5F8FB;border:1px solid var(--br3-border-soft);border-radius:9px;padding:7px 11px;font:600 11.5px var(--br3-font-text);color:var(--br3-muted);width:max-content}
.br3-tblfade{position:absolute;top:0;right:0;bottom:0;width:28px;background:linear-gradient(90deg,rgba(255,255,255,0),#fff);pointer-events:none;display:none}
/* sticky birinchi ustun (mobil) */
@media (max-width:64rem){
  .br3-tbl .is-sticky{position:sticky;left:0;z-index:2;background:#fff;box-shadow:2px 0 0 var(--br3-divider)}
  .br3-tbl thead .is-sticky{background:var(--br3-navy-800)}
  .br3-tblhint{display:inline-flex}
  .br3-tblfade{display:block}
}

/* ---------- Sharh sahifasi ---------- */
.br3-rhero{background:linear-gradient(168deg,var(--br3-navy-700),var(--br3-navy-900));color:#fff;padding:30px 0 34px}
.br3-rhero__grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:36px;align-items:start}
.br3-rhero .br3-logo{width:64px;height:64px;border-radius:15px;border-color:rgba(255,255,255,.14)}
.br3-rhero__name{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.br3-rhero__name h1{font:800 30px var(--br3-font-display);letter-spacing:-.015em;margin:0;color:#fff}
.br3-badge-top{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:7px;background:var(--br3-gold);color:#2A2207;font:700 10.5px var(--br3-font-display)}
.br3-rhero__meta{display:inline-flex;align-items:center;gap:5px;font:500 12.5px var(--br3-font-text);color:#9DB2C6}
.br3-rhero__verdict{font:400 16px/1.6 var(--br3-font-text);color:#AFC1D3;margin:14px 0 0;max-width:560px;text-wrap:pretty}
.br3-rhero__panel{background:#fff;border-radius:18px;padding:20px;color:var(--br3-text);box-shadow:0 24px 50px rgba(4,14,26,.35)}
.br3-rhero__score{display:flex;align-items:center;gap:14px}
.br3-rhero__score b{font:800 15px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-rhero__score small{display:block;font:500 12px var(--br3-font-text);color:var(--br3-faint);margin-top:2px}
.br3-bonusbox{display:block;background:var(--br3-gold-soft);border:1px solid var(--br3-gold-line);border-radius:12px;padding:12px 15px;margin-top:14px}
.br3-bonusbox b{display:block;font:600 10px var(--br3-font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--br3-gold-ink)}
.br3-bonusbox strong{font:800 19px var(--br3-font-display);color:var(--br3-navy-900)}
/* baholash barlari */
.br3-bars{display:flex;flex-direction:column;gap:13px}
.br3-bar__t{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.br3-bar__t span{font:600 13.5px var(--br3-font-text);color:var(--br3-muted)}
.br3-bar__t b{font:800 14px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-bar__track{height:7px;border-radius:5px;background:var(--br3-divider);overflow:hidden}
.br3-bar__fill{height:100%;border-radius:5px;background:var(--br3-emerald)}
.br3-bar__fill.is-gold{background:var(--br3-gold)}
/* plus/minus */
.br3-pmz{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.br3-pm{padding:20px 22px}
.br3-pm h3{display:flex;align-items:center;gap:8px;font:700 15px var(--br3-font-display);margin:0 0 12px}
.br3-pm--plus h3{color:var(--br3-emerald-strong)}
.br3-pm--minus h3{color:#A23A30}
.br3-pm ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.br3-pm li{display:flex;gap:9px;font:400 14px/1.45 var(--br3-font-text);color:var(--br3-text)}
.br3-pm li svg{flex:0 0 auto;margin-top:2px}
/* tez faktlar */
.br3-qf{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-top:16px}
/* tahririyat / RG boklari */
.br3-edbox{display:flex;align-items:center;gap:10px;padding:16px 18px;background:#fff;border-radius:13px;box-shadow:var(--br3-shadow-card)}
.br3-edbox svg{flex:0 0 auto;border-radius:8px}
.br3-edbox b{display:block;font:700 13px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-edbox small{font:400 12px var(--br3-font-text);color:var(--br3-faint)}

/* ---------- Metodologiya ---------- */
.br3-scale{display:flex;flex-direction:column;gap:9px}
.br3-scale div{display:flex;align-items:center;gap:10px;font:400 13.5px var(--br3-font-text)}
.br3-scale i{display:inline-flex;align-items:center;justify-content:center;width:54px;height:26px;border-radius:7px;font:800 12px var(--br3-font-display);font-style:normal}
.br3-scale .is-g{background:#EAF7EF;color:var(--br3-score)}
.br3-scale .is-y{background:var(--br3-gold-soft);color:var(--br3-gold-ink)}
.br3-scale .is-r{background:var(--br3-risk-soft);color:var(--br3-risk)}

/* ---------- Sharhlar indeksi ---------- */
.br3-rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:18px}
.br3-rcard{background:#fff;border-radius:var(--br3-r-card);box-shadow:var(--br3-shadow-card);padding:20px}
.br3-rcard--top{box-shadow:var(--br3-shadow-featured);border-top:3px solid var(--br3-gold)}
.br3-rcard__head{display:flex;align-items:center;gap:12px}
.br3-rcard__head .br3-logo{width:50px;height:50px}
.br3-rcard__head>div{flex:1;min-width:0}
.br3-rcard__head b{font:800 18px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-rcard__head small{display:block;font:500 12px var(--br3-font-text);color:var(--br3-faint);margin-top:2px}
.br3-rcard__why{display:flex;gap:7px;align-items:center;font:500 13.5px var(--br3-font-text);color:var(--br3-muted);margin-top:12px}
.br3-rcard__why svg{color:var(--br3-emerald);flex:0 0 auto}
.br3-rcard .br3-mt{margin-top:12px;text-align:center}
.br3-rcard .br3-mt.is-gold{background:var(--br3-gold-soft);border-color:var(--br3-gold-line)}
.br3-rcard__act{display:flex;gap:8px;margin-top:12px}
.br3-rcard__act .br3-btn--go{flex:1}

/* ---------- Maqola ---------- */
.br3-article{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:34px;padding:24px 0 34px}
.br3-art h2{font:800 24px var(--br3-font-display);letter-spacing:-.01em;color:var(--br3-navy-900);margin:28px 0 12px}
.br3-art p{font:400 16.5px/1.75 var(--br3-font-text);color:var(--br3-text);margin:0 0 14px;text-wrap:pretty}
body.br3-on .br3-art a{color:var(--br3-emerald-strong);font-weight:600}
.br3-artmeta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--br3-faint);font-size:13px;margin-top:14px}
.br3-artmeta span{display:inline-flex;align-items:center;gap:6px}
.br3-artmeta i{width:4px;height:4px;border-radius:50%;background:#CBD5E1;font-style:normal}
.br3-cover{height:280px;border-radius:18px;background:linear-gradient(150deg,var(--br3-navy-700),var(--br3-navy-900));display:flex;align-items:center;justify-content:center;position:relative;margin-top:16px}
.br3-cover small{position:absolute;bottom:12px;right:14px;color:#7E93A9;font-size:11px}
.br3-toc{background:#F5F8FB;border:1px solid var(--br3-border-soft);border-radius:14px;padding:18px 20px;margin:22px 0}
.br3-toc b{display:block;font:700 12px var(--br3-font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--br3-faint);margin-bottom:11px}
.br3-toc a{display:block;font:600 14px var(--br3-font-text);color:var(--br3-emerald-strong);padding:4px 0}
.br3-callout{display:flex;gap:13px;background:var(--br3-gold-soft);border:1px solid var(--br3-gold-line);border-radius:14px;padding:18px 20px;margin:22px 0}
.br3-callout svg{flex:0 0 auto;margin-top:2px}
.br3-callout b{display:block;font:700 14.5px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-callout p{font-size:14.5px!important;line-height:1.6!important;margin:4px 0 0!important;color:var(--br3-muted)!important}
.br3-inlinecta{border:1px solid var(--br3-border-soft);border-radius:14px;padding:6px 20px;margin:20px 0;background:#fff}
.br3-inlinecta>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0}
.br3-inlinecta>div+div{border-top:1px solid var(--br3-divider)}
.br3-inlinecta .is-l{display:flex;align-items:center;gap:11px;font:700 15px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-inlinecta .br3-logo{width:36px;height:36px;border-radius:9px}
.br3-aside{display:flex;flex-direction:column;gap:14px;position:sticky;top:74px;align-self:start}
.br3-pick{background:linear-gradient(165deg,#143A60,var(--br3-navy-900));border-radius:16px;padding:20px;color:#fff}
.br3-pick small{font:600 10.5px var(--br3-font-display);letter-spacing:.07em;text-transform:uppercase;color:#9DB2C6}
.br3-pick__row{display:flex;align-items:center;gap:11px;margin-top:11px}
.br3-pick__row .br3-logo{width:42px;height:42px;border-color:rgba(255,255,255,.16)}
.br3-pick__row b{display:block;font:800 16px var(--br3-font-display);color:#fff}
.br3-pick__row i{font:700 11px var(--br3-font-text);color:var(--br3-emerald-bright);font-style:normal}
.br3-pick .br3-btn{width:100%;margin-top:14px}
.br3-rel{background:#fff;border:1px solid var(--br3-border-soft);border-radius:16px;padding:18px 20px}
.br3-rel b{display:block;font:700 13px var(--br3-font-display);color:var(--br3-navy-900);margin-bottom:11px}
.br3-rel a{display:block;font:600 13.5px/1.4 var(--br3-font-text);color:var(--br3-emerald-strong);padding:5px 0}

/* ---------- FAQ ---------- */
.br3-faq{display:flex;flex-direction:column;gap:10px;max-width:820px}
.br3-faq details{background:#fff;border-radius:13px;box-shadow:var(--br3-shadow-card);padding:0 20px}
.br3-faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:8px 0;cursor:pointer;list-style:none;font:700 15px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-faq summary::-webkit-details-marker{display:none}
.br3-faq summary::after{content:"";width:9px;height:9px;border-right:2.5px solid var(--br3-emerald);border-bottom:2.5px solid var(--br3-emerald);transform:rotate(45deg);transition:transform .15s;flex:0 0 auto;margin-right:4px}
.br3-faq details[open] summary::after{transform:rotate(-135deg)}
.br3-faq details p{margin:0;padding:0 0 16px;font:400 14.5px/1.65 var(--br3-font-text);color:var(--br3-muted);text-wrap:pretty}
.br3-faq details p a{color:var(--br3-emerald-strong);font-weight:600}

/* ---------- Futer ---------- */
.br3-footer{background:var(--br3-navy-900);margin-top:52px;padding:34px 0 30px;color:#8FA3B8}
.br3-footer__in{display:flex;flex-direction:column;gap:20px}
.br3-footer__row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.br3-footer__row nav{display:flex;gap:18px;flex-wrap:wrap;margin-left:auto}
.br3-footer__row nav a{font:600 13.5px var(--br3-font-text);color:#AFC1D3}
.br3-footer__row nav a:hover{color:#fff}
.br3-footer p{margin:0;font:400 12.5px/1.6 var(--br3-font-text);color:#6E839A;max-width:760px;text-wrap:pretty}
.br3-footer hr{border:0;border-top:1px solid rgba(255,255,255,.09);margin:0}

/* ---------- Sticky mobil CTA ---------- */
.br3-sticky{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;align-items:center;gap:11px;padding:9px 12px calc(9px + env(safe-area-inset-bottom));background:var(--br3-navy-800);box-shadow:0 -8px 24px rgba(4,14,26,.28);transform:translateY(110%);transition:transform .2s}
.br3-sticky.is-on{transform:none}
.br3-sticky .br3-logo{width:38px;height:38px;border-radius:10px}
.br3-sticky__t{flex:1;min-width:0}
.br3-sticky__t b{display:block;font:800 14px var(--br3-font-display);color:#fff}
.br3-sticky__t b i{font-style:normal;color:var(--br3-emerald-bright)}
.br3-sticky__t span{font:600 11px var(--br3-font-text);color:#9DB2C6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.br3-sticky .br3-btn--go{height:44px;flex:0 0 auto}
@media (prefers-reduced-motion:reduce){.br3-sticky{transition:none}}

/* =====================================================================
   HERO (bosh sahifa)
   ===================================================================== */
.br3-hero{background:linear-gradient(168deg,var(--br3-navy-700) 0%,var(--br3-navy-900) 78%);padding:44px 0 46px;color:#fff}
.br3-hero__in{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:44px;align-items:center}
.br3-hero h1{font:800 clamp(30px,3.2vw,42px)/1.1 var(--br3-font-display);letter-spacing:-.02em;margin:12px 0 0;text-wrap:balance}
.br3-hero p{font-size:16.5px;line-height:1.6;color:#AFC1D3;margin:14px 0 0;max-width:480px;text-wrap:pretty}
.br3-trust{display:flex;gap:22px;flex-wrap:wrap;margin-top:24px}
.br3-trust span{display:inline-flex;align-items:center;gap:8px;font:600 13.5px var(--br3-font-text);color:#C7D6E6}
.br3-trust svg{color:var(--br3-emerald-bright);flex:0 0 auto}
.br3-lead{background:#fff;border-radius:20px;padding:22px;color:var(--br3-text);box-shadow:0 30px 60px rgba(4,14,26,.35);position:relative}
.br3-lead::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;border-radius:20px 20px 0 0;background:var(--br3-gold)}
.br3-lead__top{display:flex;align-items:center;gap:13px}
.br3-lead__name{font:800 21px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-lead__meta{display:inline-flex;align-items:center;gap:5px;font:500 12px var(--br3-font-text);color:var(--br3-faint);margin-top:3px}
.br3-lead__cta{display:flex;gap:9px;margin-top:14px}

/* =====================================================================
   BR real-data adaptations (ТЗ-280 §11.4) — ADDITIVE ONLY.
   The V3 mockup used short placeholder values (a fixed bonus sum, a fixed
   payout time). Live data instead carries honest status *phrases* (often
   multi-word, e.g. "operator e'lon qilmagan") plus an editorial red-flag
   line. These rules let
   real data breathe without altering the accepted V3 look — nothing above is
   overridden, only long-phrase wrapping, an anchor-chip active state and the
   honesty red-flag line are introduced.
   ===================================================================== */
.br3-chip.is-active{background:var(--br3-emerald);border-color:var(--br3-emerald);color:#fff;font-weight:700}
.br3-fact--phrase strong,.br3-fact--phrase span{white-space:normal;font-size:13.5px;line-height:1.35;overflow-wrap:anywhere}
.br3-btile__t span.br3-btile__phrase{white-space:normal;line-height:1.35;overflow-wrap:anywhere}
.br3-id__risk{display:flex;align-items:flex-start;gap:7px;font:500 12.5px/1.45 var(--br3-font-text);color:var(--br3-risk);margin-top:5px;overflow-wrap:anywhere}
.br3-id__risk svg{color:var(--br3-risk);flex:0 0 auto;margin-top:2px}

/* =====================================================================
   BR review page real-data adaptations (ТЗ-280 §11.5) — ADDITIVE ONLY.
   New br3-* classes used only by the review template. Nothing above is
   overridden; these carry the decision layer and the evidence cards
   (checked_facts / evidence_sections / claim_limits) with honest, often
   multi-word status phrases. brv2.css untouched.
   ===================================================================== */
.br3-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.br3-rhero__id{display:flex;align-items:center;gap:14px}
.br3-rhero__cta{display:flex;gap:9px;margin-top:14px}
.br3-rhero__cta .br3-btn{flex:1}
/* long honest phrases inside compact tiles */
.br3-qf .br3-mt{display:flex;flex-direction:column;gap:3px}
.br3-mt--phrase span{white-space:normal;line-height:1.35;font-size:13px;overflow-wrap:anywhere}
/* white prose cards (qisqa xulosa, KYC) */
.br3-prose{padding:22px 24px}
.br3-prose p{font:400 15px/1.7 var(--br3-font-text);color:var(--br3-text);margin:0 0 12px;text-wrap:pretty}
.br3-prose p:last-child{margin-bottom:0}
/* trust/info prose cards also carry mixed lists + inline links + code */
.br3-prose ul,.br3-prose ol{margin:0 0 12px;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.br3-prose ul:last-child,.br3-prose ol:last-child{margin-bottom:0}
.br3-prose li{font:400 14.5px/1.6 var(--br3-font-text);color:var(--br3-text);text-wrap:pretty}
body.br3-on .br3-prose a{color:var(--br3-emerald-strong);font-weight:600}
.br3-prose code{font:600 13px ui-monospace,SFMono-Regular,Menlo,monospace;background:#F1F5F9;color:var(--br3-navy-800);padding:2px 6px;border-radius:6px;overflow-wrap:anywhere}
.br3-prose h2{font:800 18px var(--br3-font-display);color:var(--br3-navy-900);margin:0 0 10px}
.br3-prose__p{font:400 15px/1.7 var(--br3-font-text);color:var(--br3-text);margin:14px 0 0;text-wrap:pretty}
.br3-kyclist{list-style:none;margin:12px 0;padding:0;display:flex;flex-direction:column;gap:9px}
.br3-kyclist li{display:flex;gap:9px;align-items:flex-start;font:400 14.5px/1.5 var(--br3-font-text);color:var(--br3-text)}
.br3-kyclist li svg{flex:0 0 auto;margin-top:2px}
/* bonus card */
.br3-bonuscard{padding:22px 24px;box-shadow:var(--br3-shadow-featured);border-top:3px solid var(--br3-gold)}
.br3-bonuscard__top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.br3-bonuscard .br3-bcard__amt{overflow-wrap:anywhere;max-width:640px}
.br3-bonuscard .br3-bcard__meta{max-width:560px;flex-wrap:wrap}
/* tezkor xulosa recap */
.br3-qv{padding:4px 24px}
.br3-qv__row{display:flex;gap:18px;justify-content:space-between;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--br3-divider)}
.br3-qv__row:last-child{border-bottom:0}
.br3-qv__row span{flex:0 0 32%;font:600 13.5px var(--br3-font-text);color:var(--br3-muted)}
.br3-qv__row strong{flex:1;font:600 14.5px/1.45 var(--br3-font-text);color:var(--br3-navy-900);text-align:right;text-wrap:pretty}
/* batafsil tahlil cards */
.br3-analysis{display:flex;flex-direction:column;gap:14px}
.br3-acard{padding:20px 24px}
.br3-acard__kick{display:inline-block;font:700 10.5px var(--br3-font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--br3-emerald-strong);background:var(--br3-emerald-soft);padding:4px 9px;border-radius:7px}
.br3-acard h3{font:800 18px var(--br3-font-display);letter-spacing:-.01em;color:var(--br3-navy-900);margin:12px 0 0;text-wrap:balance}
.br3-acard p{font:400 15px/1.7 var(--br3-font-text);color:var(--br3-text);margin:9px 0 0;text-wrap:pretty}
.br3-acard ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.br3-acard li{display:flex;gap:9px;align-items:flex-start;font:400 14px/1.5 var(--br3-font-text);color:var(--br3-text)}
.br3-acard li svg{flex:0 0 auto;margin-top:2px}
/* check groups + claim limits */
.br3-cgroups{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.br3-cgroup{padding:18px 20px}
.br3-cgroup b{display:block;font:700 13px var(--br3-font-display);color:var(--br3-emerald-strong);margin-bottom:8px}
.br3-cgroup p{font:400 13.5px/1.55 var(--br3-font-text);color:var(--br3-muted);margin:0}
.br3-cgroup p+p{margin-top:7px}
.br3-callout--list{align-items:flex-start}
.br3-callout--list ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:7px}
.br3-callout--list li{font:400 14px/1.55 var(--br3-font-text);color:var(--br3-muted);text-wrap:pretty}
/* text-heavy comparison tables (e.g. /bonuses/): honest phrases are multi-word,
   so this variant wraps + left-aligns cells instead of the default nowrap. The
   .br3-tblscroll wrapper still gives a scrollable, sticky-lead table on mobile. */
.br3-tbl--wrap th,.br3-tbl--wrap td{white-space:normal;text-align:left;vertical-align:top}
.br3-tbl--wrap tbody td{font:400 13.5px/1.5 var(--br3-font-text);color:var(--br3-muted)}
.br3-tbl--wrap .is-lead{font:700 14px var(--br3-font-display);color:var(--br3-navy-900)}
.br3-tbl--wrap .is-lead a{color:var(--br3-emerald-strong)}
.br3-tbl--wrap tbody .is-note{color:var(--br3-risk)}
/* generic two-up card grid for the trust/info pages (methodology, test-lab,
   about, contacts, privacy, responsible-gambling); one column on tablet/phone. */
.br3-duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.br3-methgrid{display:grid;grid-template-columns:1.25fr .75fr;gap:14px}
@media (max-width:64rem){
  .br3-cgroups{grid-template-columns:1fr}
  .br3-duo,.br3-methgrid{grid-template-columns:1fr}
}
@media (max-width:48rem){
  .br3-rhero__name h1{font-size:24px}
  .br3-qv__row{flex-direction:column;gap:3px}
  .br3-qv__row span{flex:none}
  .br3-qv__row strong{text-align:left}
  .br3-acard,.br3-prose,.br3-bonuscard,.br3-qv{padding-left:18px;padding-right:18px}
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:64rem){
  .br3-wrap{padding:0 20px}
  .br3-hero__in{grid-template-columns:1fr;gap:28px}
  .br3-lead{max-width:480px}
  .br3-row{grid-template-columns:38px 56px minmax(0,1fr) 60px;grid-template-areas:"rank logo id ring" "facts facts facts facts" "act act act act"}
  .br3-rank{grid-area:rank}.br3-row .br3-logo{grid-area:logo;width:52px;height:52px}.br3-id{grid-area:id}.br3-row>.br3-ring{grid-area:ring;width:52px;height:52px}
  .br3-row__facts{grid-area:facts;display:flex;gap:10px}
  .br3-row__facts .br3-fact{flex:1;background:#FBFCFE;border:1px solid var(--br3-border-soft);border-radius:11px;padding:9px 12px}
  .br3-fact--bonus{background:var(--br3-gold-soft)!important;border-color:var(--br3-gold-line)!important}
  .br3-row__act{grid-area:act}
  .br3-row__act .br3-btn--go{max-width:none}
  .br3-bonuses,.br3-bgrid,.br3-rgrid,.br3-steps{grid-template-columns:1fr 1fr}
  .br3-qf{grid-template-columns:1fr 1fr}
  .br3-rhero__grid{grid-template-columns:1fr;gap:22px}
  .br3-article{grid-template-columns:1fr}
  .br3-aside{position:static}
}
@media (min-width:64.01rem){
  .br3-row__facts{display:contents}
  .br3-fact--bonus{background:var(--br3-gold-soft);border:1px solid var(--br3-gold-line);border-radius:11px;padding:10px 14px}
}
@media (max-width:48rem){
  .br3-nav,.br3-header .br3-age{display:none}
  .br3-burger{display:inline-flex}
  .br3-hero{padding:30px 0 34px}
  .br3-hero p{font-size:15px}
  .br3-trust{gap:12px 18px;margin-top:18px}
  .br3-trust span{font-size:12.5px}
  .br3-lead{padding:18px;max-width:none}
  .br3-btn{height:48px}
  .br3-row{padding:15px 16px;gap:12px}
  .br3-row__act .br3-btn{flex:1}
  .br3-sec{padding:36px 0 8px}
  .br3-sec h2{font-size:22px}
  .br3-phero h1{font-size:26px}
  .br3-bonuses,.br3-bgrid,.br3-rgrid,.br3-steps,.br3-pmz,.br3-qf{grid-template-columns:1fr}
  .br3-pmz{gap:0}
  .br3-pm--minus{border-top:1px solid var(--br3-divider)}
  .br3-sticky.br3-sticky--use{display:flex}
  body.br3-has-sticky{padding-bottom:72px}
  .br3-footer__row nav{margin-left:0}
  .br3-cover{height:200px}
}
@media (max-width:30rem){
  /* Narrow phones: lift the brand name + "Tekshirildi" chip into the top strip
     beside the logo, filling the empty gap that used to sit left of the score
     ring. The longer "why"/"risk" sentences drop to full-width rows below where
     they have room to breathe (they were squeezed to ~1-2 words per line when
     the whole id block shared the top strip). .br3-id spreads its children onto
     the row grid via display:contents, so no markup change is needed. */
  .br3-row{
    grid-template-columns:auto 52px minmax(0,1fr) 52px;
    grid-template-areas:none;
  }
  .br3-id{display:contents}
  .br3-rank{grid-column:1;grid-row:1}
  .br3-row>.br3-logo{grid-column:2;grid-row:1}
  .br3-id__name{grid-column:3;grid-row:1;align-self:center}
  .br3-row>.br3-ring{grid-column:4;grid-row:1;justify-self:end}
  .br3-id__why{grid-column:1 / -1;grid-row:auto;margin-top:0}
  .br3-id__risk{grid-column:1 / -1;grid-row:auto;margin-top:0}
  .br3-row__facts{grid-column:1 / -1;grid-row:auto}
  .br3-row__act{grid-column:1 / -1;grid-row:auto}
}

/* =====================================================================
   SPEC-04 — additive "Asosiy bonuslar" list + honest note inside #bonus.
   Append-only; reuses existing br3 tokens; no existing selector modified.
   ===================================================================== */
.br3-bonuslist{margin-top:14px;padding:20px 24px}
.br3-bonuslist__title{font:800 18px var(--br3-font-display);letter-spacing:-.01em;color:var(--br3-navy-900);margin:0;text-wrap:balance}
.br3-bonuslist__items{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.br3-bonusitem{background:#FBFCFE;border:1px solid var(--br3-border-soft);border-radius:12px;padding:14px 16px}
.br3-bonusitem__head{display:flex;align-items:baseline;justify-content:space-between;gap:6px 14px;flex-wrap:wrap}
.br3-bonusitem__head strong{font:700 15px var(--br3-font-display);color:var(--br3-navy-900);text-wrap:balance;overflow-wrap:anywhere}
.br3-bonusitem__src{font:600 11.5px var(--br3-font-text);color:var(--br3-faint)}
.br3-bonusitem__val{font:400 14.5px/1.6 var(--br3-font-text);color:var(--br3-text);margin:6px 0 0;text-wrap:pretty;overflow-wrap:anywhere}
.br3-bonusitem__terms{font:400 12.5px/1.55 var(--br3-font-text);color:var(--br3-muted);margin:6px 0 0;text-wrap:pretty}
.br3-bonusnote{margin:14px 0 0}
@media (max-width:48rem){
  .br3-bonuslist{padding-left:18px;padding-right:18px}
}
