/* valyutakurs.uz — 2-dizayn (ega 1027/1067): namuna sayt uslubi — oq header, gorizontal menyu, kulrang ish maydoni, Manrope */
:root {
  --asosiy: #0B3C5D; --asosiy-och: #eff4fa; --fon: #fff; --maydon: #F4F7FB; --karta: #fff; --qator: #F6F8FB;
  --matn: #29343d; --sust: #526b7a; --chiziq: #e0e6eb; --yashil: #13b65a; --yashil-fon: #36c76c; --qizil: #ff6692;
  --qizil-matn: #e5304f; --kok: #2f6fe0; --oltin: #F8C20A; --soya: 0 2px 6px rgba(37, 83, 185, .06);
  --r: 12px; --sarlavha-fon: #fff;
}
:root[data-mavzu="tun"] {
  --asosiy-och: #1f2a3d; --fon: #1a2537; --maydon: #111c2d; --karta: #1a2537; --qator: #202d43; --matn: #e8edf3;
  --sust: #9aaab8; --chiziq: #313e54; --soya: none; --asosiy: #46a6ee; --sarlavha-fon: #1a2537; --kok: #6ea8ff;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fon); color: var(--matn); font-family: Manrope, system-ui, sans-serif; font-size: 15px; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
button, input, select { font-family: inherit; font-size: inherit; color: inherit; }
h1, h2, h3, p { margin: 0; }
.idish { width: 100%; max-width: 1170px; margin: 0 auto; padding: 0 15px; }

/* Header */
.tepa { background: var(--fon); border-bottom: 1px solid var(--chiziq); }
.tepa-ichi { display: flex; align-items: center; gap: 12px; min-height: 70px; }
.logo { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 20px; color: var(--asosiy); letter-spacing: -.2px; }
.logo b { color: #00b8d9; font-weight: 800; }
.logo-belgi { width: 40px; height: 40px; border-radius: 10px; background: var(--asosiy); color: #fff; display: grid; place-items: center; }
:root[data-mavzu="tun"] .logo-belgi { background: #0B3C5D; }
.logo-belgi svg { width: 22px; height: 22px; stroke-width: 2.2; }
.tepa-ong { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.ikon-tugma { width: 40px; height: 40px; border: 0; background: transparent; border-radius: 50%; display: grid; place-items: center; cursor: pointer; color: var(--sust); }
.ikon-tugma:hover { background: var(--asosiy-och); color: var(--asosiy); }
.ikon-tugma svg { width: 22px; height: 22px; }
.ikon-tugma .quyosh, :root[data-mavzu="tun"] .ikon-tugma .oy { display: none; }
:root[data-mavzu="tun"] .ikon-tugma .quyosh { display: block; }
.til-tanlov { display: flex; padding: 3px; border: 1px solid var(--chiziq); border-radius: 999px; background: var(--fon); }
.til-tanlov a { padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--sust); }
.til-tanlov a.faol { background: var(--asosiy-och); color: var(--asosiy); box-shadow: 0 1px 3px rgba(0, 0, 0, .08); }
.bot-tugma { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 8px; background: var(--asosiy-och); color: var(--asosiy); font-weight: 700; font-size: 14px; }
.bot-tugma:hover { background: var(--asosiy); color: #fff; }
.menyu-tugma { display: none; }

/* Gorizontal menyu */
.menyu { background: var(--fon); }
.menyu-ichi { display: flex; gap: 6px; padding-top: 16px; padding-bottom: 22px; }
.menyu a { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border-radius: 8px; color: var(--matn); font-size: 14px; font-weight: 500; }
.menyu a:hover { color: var(--asosiy); }
.menyu a.faol { background: var(--asosiy); color: #fff; box-shadow: 0 8px 18px -6px rgba(11, 60, 93, .55); }
:root[data-mavzu="tun"] .menyu a.faol { background: #0B3C5D; }
.menyu-til { display: none; }
.parda { display: none; }

/* Ish maydoni */
.asosiy { background: var(--maydon); border-radius: 22px; margin: 0 15px; padding: 30px 0 40px; min-height: 60vh; }
.asosiy > .idish { display: flex; flex-direction: column; gap: 30px; }
.sarlavha-karta { background: var(--sarlavha-fon); border-radius: var(--r); box-shadow: var(--soya); padding: 15px 30px; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; }
.sarlavha-karta h1 { font-size: 18px; font-weight: 600; color: var(--matn); }
.yol { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--sust); flex: none; }
.yol svg { width: 20px; height: 20px; stroke-width: 1.5; }
.yol-oraliq:hover { color: var(--asosiy); }
.yol-nishon { background: var(--asosiy-och); color: var(--asosiy); padding: 3px 10px; border-radius: 6px; font-size: 12px; font-weight: 500; }
.karta { background: var(--karta); border-radius: var(--r); box-shadow: var(--soya); }
.karta-bosh { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 24px; border-bottom: 1px solid var(--chiziq); flex-wrap: wrap; }
.karta-sarlavha { font-size: 18px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.karta-tana { padding: 24px; }
.sana-nishon { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--sust); }
.sana-nishon svg { width: 15px; height: 15px; }
.izoh { font-size: 13px; color: var(--sust); }
.izoh a { color: var(--asosiy); font-weight: 600; }
.bosh-holat { padding: 30px 24px; text-align: center; color: var(--sust); }
.belgi.eski { color: #b7791f; font-weight: 700; font-size: 12px; }

/* Filtr */
.filtr { padding: 26px 24px; display: grid; grid-template-columns: auto auto 1fr; gap: 30px; align-items: center; }
.filtr .mb-karta { justify-self: end; }
.filtr-nom { font-size: 14px; color: var(--sust); margin-bottom: 8px; font-weight: 500; }
.valyuta-tanlov { position: relative; display: flex; align-items: center; }
.tanlov-belgi { position: absolute; left: 16px; font-weight: 700; color: var(--asosiy); pointer-events: none; }
.valyuta-tanlov select { appearance: none; -webkit-appearance: none; min-width: 230px; padding: 10px 40px 10px 42px; border: 1px solid var(--chiziq); border-radius: 8px; background: var(--fon) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m7 10 5 5 5-5z' fill='%23526b7a'/%3E%3C/svg%3E") no-repeat right 12px center / 18px; font-weight: 600; cursor: pointer; }
.valyuta-tanlov select:focus { outline: 2px solid var(--asosiy); outline-offset: 1px; }
.filtr .valyuta-segment { display: none; }
.segment { display: flex; padding: 4px; background: var(--asosiy-och); border-radius: 10px; gap: 4px; }
.segment a, .segment button { flex: 1; text-align: center; padding: 8px 12px; border: 0; background: transparent; border-radius: 8px; color: var(--sust); font-weight: 600; cursor: pointer; }
.segment .faol { background: var(--fon); color: var(--asosiy); box-shadow: 0 1px 4px rgba(0, 0, 0, .08); }
.manba-tanlov { display: flex; gap: 10px; flex-wrap: wrap; }
.manba-tanlov a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border: 1px solid var(--chiziq); border-radius: 6px; font-size: 16px; font-weight: 500; color: var(--matn); background: var(--fon); }
.manba-tanlov a:hover { border-color: var(--asosiy); }
.manba-tanlov a.faol { background: var(--asosiy); border-color: var(--asosiy); color: #fff; }
:root[data-mavzu="tun"] .manba-tanlov a.faol { background: #0B3C5D; border-color: #0B3C5D; }
.manba-tanlov .qisqa { display: none; }
.mb-karta { border-left: 1px solid var(--chiziq); padding-left: 24px; display: flex; flex-direction: column; gap: 4px; }
.mb-nom { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; }
.mb-belgi { width: 30px; height: 30px; border-radius: 50%; background: #fff5d6; color: #c79400; display: grid; place-items: center; }
.mb-belgi svg { width: 16px; height: 16px; }
.mb-kurs { font-size: 15px; font-weight: 600; white-space: nowrap; }
.ozg { font-size: 12px; font-weight: 600; margin-left: 4px; }
.ozg.yuq { color: var(--yashil); } .ozg.pas { color: var(--qizil-matn); }
.mb-vaqt { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--sust); }
.mb-vaqt svg { width: 14px; height: 14px; }

/* Saralash va bank qatorlari */
.royxat-karta { padding-bottom: 30px; }
.saralash { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; border-bottom: 1px solid var(--chiziq); margin-bottom: 30px; flex-wrap: wrap; }
.saralash-nom { display: flex; align-items: center; gap: 8px; font-size: 20px; font-weight: 500; color: var(--asosiy); }
.saralash-tugmalar { display: flex; }
.saralash-tugmalar button { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border: 1px solid var(--asosiy); background: var(--fon); color: var(--asosiy); font-size: 13px; font-weight: 500; cursor: pointer; margin-left: -1px; }
.saralash-tugmalar button:first-child { border-radius: 6px 0 0 6px; margin-left: 0; }
.saralash-tugmalar button:last-child { border-radius: 0 6px 6px 0; }
.saralash-tugmalar button.faol, .saralash-tugmalar button:hover { background: var(--asosiy); color: #fff; }
:root[data-mavzu="tun"] .saralash-tugmalar button { border-color: var(--chiziq); }
.saralash-tugmalar svg { width: 16px; height: 16px; }
.royxat-bosh { display: none; }
.banklar { display: flex; flex-direction: column; gap: 28px; padding: 0 30px; }
.bank { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; gap: 16px; background: var(--qator); border-radius: 10px; padding: 16px; box-shadow: 0 6px 10px -6px rgba(16, 24, 40, .12); }
.bank.eski { opacity: .72; }
.bank-bosh { display: flex; align-items: center; gap: 16px; min-width: 0; }
.bank-logo { width: 100px; height: 100px; border-radius: 10px; background: #fff; display: grid; place-items: center; flex: none; font-weight: 800; font-size: 34px; color: #fff; overflow: hidden; }
.bank-logo:not(.rasm) { background: var(--r, var(--asosiy)); }
.bank-logo img { width: 64%; height: 64%; object-fit: contain; }
.bank-logo.kichik { width: 60px; height: 60px; font-size: 22px; border: 1px solid var(--chiziq); }
.bank-logo.katta { width: 84px; height: 84px; font-size: 30px; border: 1px solid var(--chiziq); }
.bank-nom { min-width: 0; }
.bank-nom h2 { font-size: 18px; font-weight: 600; line-height: 1.3; }
.bank-nom h2 a:hover { color: var(--asosiy); }
.bank-nom p { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: var(--sust); margin-top: 4px; }
.bank-nom p svg { width: 14px; height: 14px; }
.kurs-q { text-align: center; }
.kurs { font-size: 24px; font-weight: 500; white-space: nowrap; }
.kurs small { font-size: 16px; color: var(--sust); }
.kurs.eng-yashil { color: var(--yashil-fon); }
.kurs.eng-yashil small { color: var(--yashil-fon); }
.kurs-nom { font-size: 16px; color: var(--sust); margin-top: 6px; }
.nishon { display: inline-flex; align-items: center; gap: 2px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; color: #fff; vertical-align: middle; }
.nishon.yuq { background: var(--yashil-fon); } .nishon.pas { background: var(--qizil); }
.hisob-tugma { display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--asosiy); border-radius: 6px; background: transparent; color: var(--asosiy); font-weight: 500; font-size: 16px; cursor: pointer; }
.hisob-tugma:hover { background: var(--asosiy); color: #fff; }
.hisob-tugma svg { width: 16px; height: 16px; }
.royxat-karta > .izoh { padding: 20px 30px 0; }

/* Markaziy bank */
.mb-panjara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.mb-v { border: 1px solid var(--chiziq); border-radius: 10px; background: var(--qator); padding: 16px; }
.mb-v-bosh { display: flex; justify-content: space-between; align-items: center; }
.mb-v-bosh h3 { font-size: 16px; font-weight: 500; }
.mb-v-kurs { font-size: 21px; font-weight: 600; margin-top: 10px; }
.mb-v-kurs small { font-size: 14px; color: var(--sust); font-weight: 500; }
.mb-v-nom { font-size: 12px; color: var(--sust); }
.jadval-o { overflow-x: auto; }
.jadval { width: 100%; border-collapse: collapse; font-size: 15px; }
.jadval th, .jadval td { padding: 14px 24px; text-align: left; border-bottom: 1px solid var(--chiziq); }
.jadval thead th { background: var(--asosiy-och); font-weight: 600; font-size: 14px; border-bottom: 1px solid #c9d3dc; }
.jadval tbody th { font-weight: 500; }
.jadval td { color: var(--sust); }
.jadval.yoliq tbody tr:nth-child(odd) { background: var(--asosiy-och); }
.jadval .ong { text-align: right; }
.jadval .markaz { text-align: center; }

/* Oltin */
.oltin-o { border: 1px solid var(--chiziq); border-radius: 14px; box-shadow: var(--soya); }
.jadval.oltin th, .jadval.oltin td { border: 0; border-bottom: 1px solid var(--chiziq); padding: 18px 16px; vertical-align: middle; }
.jadval.oltin thead th { background: var(--fon); font-size: 13px; letter-spacing: .5px; text-transform: uppercase; font-weight: 600; border-right: 1px solid var(--chiziq); }
.jadval.oltin th small, .jadval.oltin td small { display: block; font-size: 11px; text-transform: none; font-weight: 500; letter-spacing: 0; margin-top: 4px; }
.jadval.oltin th small.qator { display: inline; }
.jadval.oltin tbody th { border-right: 1px solid var(--chiziq); }
.gramm { display: inline-block; padding: 8px 16px; border-radius: 6px; background: linear-gradient(135deg, #ffd84d, #f5a300); color: #fff; font-weight: 700; box-shadow: 0 4px 10px -4px rgba(245, 163, 0, .7); white-space: nowrap; }
.jadval.oltin td b { font-size: 20px; font-weight: 600; letter-spacing: .3px; }
.jadval.oltin td.yashil b { color: var(--yashil); } .jadval.oltin td.yashil small { color: var(--sust); }
.jadval.oltin td.kok { background: rgba(80, 110, 140, .1); border-right: 1px solid var(--chiziq); } .jadval.oltin td.kok b, .jadval.oltin td.kok small { color: var(--kok); }
.jadval.oltin td.qizil { background: rgba(255, 102, 146, .1); } .jadval.oltin td.qizil b { color: var(--qizil-matn); } .jadval.oltin td.qizil small { color: var(--qizil); }

/* Banklar */
.qidiruv-karta { padding: 30px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.qidiruv { position: relative; display: flex; align-items: center; width: 100%; max-width: 250px; }
.qidiruv svg { position: absolute; left: 14px; width: 20px; height: 20px; }
.qidiruv input { width: 100%; padding: 10px 14px 10px 46px; border: 1px solid var(--chiziq); border-radius: 6px; background: var(--fon); }
.qidiruv input:focus { outline: 2px solid var(--asosiy); outline-offset: 1px; }
.asosiy-tugma { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 6px; background: var(--asosiy); color: #fff; font-weight: 600; font-size: 14px; border: 0; cursor: pointer; }
:root[data-mavzu="tun"] .asosiy-tugma { background: #0B3C5D; }
.chiziq-tugma { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 6px; border: 1px solid var(--asosiy); color: var(--asosiy); font-weight: 500; font-size: 14px; }
.toliq { width: 100%; }
.banklar-jadval td { vertical-align: middle; }
.banklar-jadval thead th { background: transparent; border-bottom: 1px solid var(--chiziq); padding-top: 4px; }
.bank-qator { display: flex; align-items: center; gap: 16px; }
.bank-qator b { display: block; font-weight: 600; color: var(--matn); }
.bank-qator small { display: block; font-size: 12px; color: var(--sust); max-width: 300px; }
.banklar-jadval .manzil { font-size: 14px; max-width: 420px; }
.banklar-jadval .manzil svg { display: none; }
.amal { white-space: nowrap; }
.batafsil { display: none; }
.kichik-tugma { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; border: 1px solid var(--asosiy); border-radius: 6px; color: var(--asosiy); font-size: 13px; font-weight: 500; }
.kichik-tugma svg { width: 14px; height: 14px; }
.kichik-tugma .qisqa { display: none; }
.kichik-tugma:hover { background: var(--asosiy); color: #fff; }

/* Bank sahifasi */
.ikki-ustun { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 30px; align-items: start; }
.ustun-asosiy { display: flex; flex-direction: column; gap: 30px; }
.bank-tanishuv { padding: 30px; display: flex; align-items: center; gap: 16px; }
.bank-tanishuv h2 { font-size: 20px; font-weight: 500; }
.bank-tanishuv p { font-size: 14px; color: var(--sust); margin-top: 4px; }
.kichik-vaqt { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--sust); margin-top: 4px; }
.kichik-vaqt svg { width: 13px; height: 13px; }
.kurs-katak { font-size: 18px; }
.kurs-katak small { font-size: 14px; }
.ustun-yon { padding: 30px; display: flex; flex-direction: column; gap: 12px; }
.ustun-yon .karta-sarlavha { margin-bottom: 8px; }
.malumot-jadval th, .malumot-jadval td { padding: 14px 20px; font-size: 14px; }
.malumot-jadval tr:nth-child(odd) { background: var(--asosiy-och); }
.malumot-jadval th { width: 44%; }

/* Pastki qism */
.pastki { margin: 0 15px; padding: 36px 0 30px; background: var(--fon); }
.pastki-tepa { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 0 15px 24px; border-bottom: 1px solid var(--chiziq); }
.pastki-tepa > span { font-weight: 600; color: var(--sust); }
.ijtimoiy { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--asosiy-och); color: var(--asosiy); }
.ijtimoiy:hover { background: var(--asosiy); color: #fff; }
.pastki-havolalar { margin-left: auto; display: flex; gap: 18px; flex-wrap: wrap; font-size: 14px; color: var(--sust); }
.pastki-havolalar a:hover { color: var(--asosiy); }
.pastki-izoh { text-align: center; font-size: 14px; color: var(--sust); padding-top: 24px; }

/* Sozlamalar */
.sozlama-tugma { position: fixed; right: 20px; top: 58%; width: 58px; height: 58px; border-radius: 50%; border: 0; background: var(--qizil); color: #fff; display: grid; place-items: center; cursor: pointer; box-shadow: 0 6px 16px -4px rgba(255, 102, 146, .7); z-index: 30; }
.sozlama-tugma svg { width: 24px; height: 24px; animation: aylan 6s linear infinite; }
@keyframes aylan { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .sozlama-tugma svg { animation: none; } }
.sozlama { position: fixed; top: 0; right: 0; bottom: 0; width: 300px; max-width: 86vw; background: var(--karta); z-index: 50; box-shadow: -10px 0 30px rgba(0, 0, 0, .12); padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.sozlama[hidden] { display: none; }
.sozlama-bosh { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.sozlama-bosh h2 { font-size: 18px; font-weight: 700; }
.sozlama-nom { font-weight: 600; font-size: 14px; color: var(--sust); }
.sozlama-tanlov { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sozlama-tanlov.ustun { grid-template-columns: 1fr; }
.sozlama-tanlov button, .sozlama-tanlov a { padding: 10px 12px; border: 1px solid var(--chiziq); border-radius: 8px; background: var(--fon); text-align: left; cursor: pointer; font-weight: 600; font-size: 14px; }
.sozlama-tanlov .faol { border-color: var(--asosiy); color: var(--asosiy); background: var(--asosiy-och); }

/* Hisoblash oynasi */
.oyna { position: fixed; inset: 0; background: rgba(10, 20, 30, .45); display: grid; place-items: center; z-index: 60; padding: 16px; }
.oyna[hidden] { display: none; }
.oyna-ichi { background: var(--karta); border-radius: 14px; padding: 22px; width: 100%; max-width: 400px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 20px 40px rgba(0, 0, 0, .2); }
.oyna-bosh { display: flex; align-items: center; justify-content: space-between; }
.oyna-bosh h3 { font-size: 18px; }
.oyna-maydon { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--sust); }
.oyna-maydon input { padding: 12px 14px; border: 1px solid var(--chiziq); border-radius: 8px; font-size: 18px; font-weight: 600; background: var(--fon); color: var(--matn); }
.oyna-kurs { font-size: 13px; color: var(--sust); }
.oyna-natija { font-size: 26px; font-weight: 700; color: var(--asosiy); }
.oyna-yop { padding: 12px; border: 0; border-radius: 8px; background: var(--asosiy); color: #fff; font-weight: 700; cursor: pointer; }

/* Planshet */
@media (max-width: 1100px) {
  .filtr { grid-template-columns: 1fr 1fr; }
  .filtr .mb-karta { justify-self: stretch; }
  .mb-karta { grid-column: 1 / -1; border-left: 0; padding-left: 0; border-top: 1px solid var(--chiziq); padding-top: 16px; }
  .ikki-ustun { grid-template-columns: 1fr; }
  .mb-panjara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bank { grid-template-columns: minmax(0, 1fr) auto auto; }
  .bank-bosh { grid-column: 1 / -1; }
  .bank-logo { width: 72px; height: 72px; font-size: 26px; }
}

/* Telefon */
@media (max-width: 760px) {
  body { font-size: 14px; }
  .tepa { border-bottom: 0; }
  .tepa-ichi { min-height: 64px; justify-content: space-between; }
  .menyu-tugma { display: grid; }
  .logo { position: absolute; left: 50%; transform: translateX(-50%); font-size: 18px; }
  .tepa-ichi { position: relative; }
  .til-tanlov, .bot-tugma { display: none; }
  .menyu { position: fixed; top: 0; left: 0; bottom: 0; width: 270px; max-width: 82vw; transform: translateX(-100%); transition: transform .2s; z-index: 50; box-shadow: 10px 0 30px rgba(0, 0, 0, .12); overflow-y: auto; }
  body.menyu-ochiq .menyu { transform: none; }
  body.menyu-ochiq .parda { display: block; position: fixed; inset: 0; background: rgba(10, 20, 30, .4); z-index: 40; }
  .menyu-ichi { flex-direction: column; padding: 24px 16px; }
  .menyu-til { display: flex; flex-direction: column; gap: 4px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--chiziq); }
  .menyu-til a { padding: 8px 16px; font-size: 14px; }
  .menyu-til a.faol { background: var(--asosiy-och); color: var(--asosiy); box-shadow: none; }
  .asosiy { margin: 0; border-radius: 0; padding: 10px 0 30px; }
  .asosiy > .idish { gap: 16px; padding: 0 16px; }
  .sarlavha-karta { flex-direction: column; align-items: flex-start; padding: 16px; gap: 12px; }
  .sarlavha-karta h1 { font-size: 18px; }
  .filtr { display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding: 0; background: transparent; box-shadow: none; }
  .filtr-bolim, .mb-karta { background: var(--karta); border-radius: var(--r); box-shadow: var(--soya); padding: 16px; }
  .mb-karta { border: 0; }
  .valyuta-tanlov { display: none; }
  .filtr .valyuta-segment { display: flex; }
  .filtr .mb-karta { justify-self: stretch; }
  .valyuta-segment a { padding: 10px; font-size: 16px; }
  .manba-tanlov { display: flex; padding: 4px; background: var(--asosiy-och); border-radius: 10px; gap: 4px; flex-wrap: nowrap; }
  .manba-tanlov a { flex: 1; flex-direction: column; gap: 4px; padding: 8px 4px; border: 0; background: transparent; font-size: 11px; font-weight: 700; color: var(--sust); }
  .manba-tanlov a.faol { background: var(--fon); color: var(--asosiy); box-shadow: 0 1px 4px rgba(0, 0, 0, .08); }
  :root[data-mavzu="tun"] .manba-tanlov a.faol { background: var(--karta); border: 0; }
  .manba-tanlov .uzun { display: none; } .manba-tanlov .qisqa { display: inline; }
  .mb-kurs { font-size: 16px; white-space: normal; }
  .royxat-karta { padding: 16px 16px 20px; }
  .saralash { padding: 0 0 16px; margin-bottom: 0; border: 0; }
  .saralash-nom { display: none; }
  .saralash-tugmalar { width: 100%; gap: 6px; }
  .saralash-tugmalar button { flex: 1; justify-content: center; border-radius: 6px !important; margin: 0; padding: 8px 4px; font-size: 13px; }
  .royxat-bosh { display: grid; grid-template-columns: minmax(0, 1fr) 76px 64px; gap: 6px; background: var(--asosiy-och); padding: 8px 6px; font-size: 13px; font-weight: 600; border-radius: 4px 4px 0 0; }
  .royxat-bosh span + span { text-align: right; }
  .banklar { gap: 0; padding: 0; }
  .bank { grid-template-columns: minmax(0, 1fr) 76px 64px; gap: 6px; padding: 8px 6px; background: transparent; border-radius: 0; box-shadow: none; border-bottom: 1px solid var(--chiziq); cursor: pointer; }
  .bank-bosh { grid-column: auto; gap: 8px; }
  .bank-logo { width: 22px; height: 22px; font-size: 11px; border-radius: 4px; }
  .bank-logo img { width: 100%; height: 100%; }
  .bank-nom h2 { font-size: 13px; font-weight: 600; }
  .bank-nom p { font-size: 12px; margin-top: 0; }
  .bank-nom p svg, .vaqt-yorliq { display: none; }
  .kurs-q { text-align: right; }
  .kurs { font-size: 13px; font-weight: 700; }
  .kurs small, .kurs .nishon, .kurs-nom, .hisob-tugma { display: none; }
  .mb-panjara { grid-template-columns: 1fr; gap: 10px; }
  .karta-bosh, .karta-tana { padding: 16px; }
  .karta-sarlavha { font-size: 16px; }
  .jadval th, .jadval td { padding: 12px 14px; font-size: 14px; }
  .jadval.oltin { min-width: 640px; }
  .qidiruv-karta { padding: 30px 30px; flex-direction: column; }
  .qidiruv { max-width: none; }
  .banklar-jadval thead { display: none; }
  .banklar-jadval, .banklar-jadval tbody { display: block; }
  .banklar-jadval tr { display: flex; flex-direction: column; gap: 12px; padding: 16px; margin-bottom: 20px; border-radius: 10px; box-shadow: 0 2px 10px rgba(16, 24, 40, .08); background: var(--karta); }
  .banklar-jadval td { display: block; padding: 0; border: 0; }
  .banklar-jadval .manzil { display: flex; gap: 6px; color: var(--sust); }
  .banklar-jadval .manzil svg { display: block; color: var(--qizil); width: 16px; height: 16px; margin-top: 2px; }
  .amal { display: flex !important; justify-content: space-between; align-items: center; }
  .batafsil { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--asosiy); }
  .kichik-tugma .uzun { display: none; } .kichik-tugma .qisqa { display: inline; }
  .ikki-ustun, .ustun-asosiy { gap: 16px; }
  .bank-tanishuv, .ustun-yon { padding: 20px; }
  .pastki { margin: 0; }
  .pastki-havolalar { margin-left: 0; width: 100%; }
  .sozlama-tugma { width: 52px; height: 52px; right: 12px; }
}
.mb-nishon { background: var(--asosiy-och); color: var(--asosiy); padding: 3px 10px; border-radius: 6px; font-size: 14px; font-weight: 600; white-space: nowrap; }