/* ═══════════════════════════════════════════════════════════
   ASOS — ranglar, shrift, tugma va maydonlar.

   ⛔ 2026-09-08: bezak olib tashlandi (egasining qarori).
   Ilgari ko'k gradient fon, shaffof «shisha» kartalar, gradientli
   va soyali tugmalar bor edi. Endi sodda: oq varaq,
   yupqa kulrang chiziq, tekis ko'k tugma.

   ⛔ Bezak ketdi, O'LCHAM QOLDI: `--tap` 52px — barmoq o'lchovi
   (2.1). Bozorda qo'l qo'pol va shoshilgan; tugma kichraytirilmaydi.

   ⛔ Ekranga xos stil bu yerda yozilmaydi (CLAUDE.md 1):
      login.css · shell.css · plan.css
   ═══════════════════════════════════════════════════════════ */

:root {
  /* Varaq va sirt */
  /* ⛔ VARAQ OQ (egasi, 2026-10-01, R1 «Tavsiya» = a: «nimaga dizayn juda
     xira, mutniy, seriy?»; sabab va surat — `dizayn/rang/`). Kulrang varaq,
     undan to'qroq maydon va maydon rangidagi tugmalar — «kulrang ustida
     kulrang» edi. Oq kartalar endi soya bilan ajraladi. */
  /* ⛔ 2026-10-02 — VARAQ YANA KULRANG, KARTA OQ (egasi, Samsung videosi:
     «panellar ajratilmagan, fon bilan qo‘shilib ketgan»; namuna `dizayn/fon/`,
     «Tavsiya» = A+B). Oq varaqda oq karta faqat 5–8 % soya bilan ajralardi —
     telefon ekranida u ko‘rinmaydi. Tasdiqlangan bosh sahifa namunasi
     ham shunday: kulrang varaq, oq blok.
     ⛔ 10-01 dagi «xira» muammosi QAYTMAYDI: u kulrang varaq + undan TO‘Q
     maydon + kulrang tugma zanjiri edi. Maydon endi varaqdan OCHROQ
     (`--field` fonda oqroq, kartada kulrangroq ko‘rinadi), tugmalar ko‘k. */
  /* ⛔ 2026-10-04 — VARAQ TO‘QROQ (egasi, POS ekrani 1024 px, surat va
     video: «panellar ajratilmagan, alohida bo‘rttirib chiqarilmagan fonda;
     lyuboy narsa fondan alohida bo‘lib turishi kerak»; «Butun tizimda ⭐»).
     Arzon POS ekranida `#e9edf3` va oq karta (1,18:1) bitta rangga qo‘shilib
     ketardi. `#dde3ec` — 1,29:1; shu bilan `--muted` ham to‘qlashdi (varaqda
     4,51 → 4,85, me'yor 4,5), ramka o‘rtasi va soya — pastda. */
  --page:#dde3ec; --glass:#fff;
  /* Matn */
  /* ⛔ `--muted` #8a9099 dan #656c76 ga (UI/UX tahlil O1, 2026-09-30):
     eskisi oq fonda 3,2:1, kulrang varaqda 2,95:1 edi — me'yor 4,5:1.
     Bozorda telefon quyosh ostida: izoh, «0 ta chek», sana — o'qilmasdi.
     Yangisi: oq 5,3:1 · varaq 4,86:1. 2026-10-04: `#5a616b` — oq 6,26 · varaq (`#dde3ec`) 4,85.
     ⛔ 2026-10-07 — `#3f4650`, HAMMA FONDA ≥ 7:1 (WCAG AAA): oq 9,5 · varaq 7,4 ·
     maydon 8,7 · zebra 9,0 (egasi, Katalog surati: «barcha joyda lyuboy matn orqa
     fondan ajralib turish kerak, yo‘lini qil»). Iyerarxiya — rang emas, o‘lcham
     va qalinlik: `--ink` baribir to‘qroq. Qo'riqchi: `test_design_code.py` */
  --ink:#1f2329; --muted:#3f4650;
  /* Chiziq */
  --line:#e6e8eb;
  /* ⛔ MAYDON FONI — TO'LDIRILGAN (egasi, 2026-09-19).

     Maydon oq emas: och kulrang quti, ramkasiz va soyasiz. Farq kichik ko'rinadi, lekin ekranning
     umumiy ta'mi shundan chiqadi — oq varaqda oq maydon faqat
     soya bilan ajraladi va u «ko'tarilgan» bo'lib ko'rinadi;
     to'ldirilgan maydon esa varaqning ICHIGA o'yilgan. */
  /* ⛔ TO'Q KULRANG, `--page` DAN AJRALADIGAN.
     Birinchi urinishimda `#f1f3f6` qo'ydim — u OQ varaqda ajraladi,
     bizda esa sahifa KULRANG (`--page:#f4f5f7`) va maydon fonda YO'QOLDI:
     «Hozirgi parol» qutisi ko'rinmay qoldi. Rang emas — KONTRAST
     tanlanadi. */
  /* ⛔ 2026-10-01: varaq OQ bo'ldi — maydon yana och kulrang
     (`#f2f4f7`): oq varaqda ajraladi, «loy» ko'rinmaydi (dizayn/rang/). */
  --field:#f2f4f7; --field-on:#fff;
  /* Yagona urg'u rangi */
  --mid:#2f6fed; --soft:#eaf1fe;
  /* ⛔ KO‘K YOZUV — alohida token (egasi, 2026-10-03, «1 A»: «to‘q ko‘k fonga ko‘k
     shrift ko‘zni og‘ritadi»). Kunda `--mid` bilan bir xil ko‘k; tunda OQ —
     ko‘k faqat tugma, belgi va tanlangan menyuda qoladi (QARORLAR 5.1 #46). */
  --link:#2f6fed;
  /* ⛔ Eski nomlar saqlandi — boshqa fayllar ularga tayanadi */
  --deep:#fff; --bright:#2f6fed;
  /* Holat */
  --danger:#dc3c39; --ok:#12996b; --warn:#b26a00;
  /* ⛔ Savat narxi — to'q sariq. Qora emas: kassir narxni darhol
     ajratsin va u tahrirlanishi mumkinligi ko'rinib tursin. */
  --price:#f5871f;
  /* ⛔ YUMSHOQ FONLAR — holat belgisining orqasi (2026-10-01, tun uchun
     tokenga chiqdi: ilgari 3 faylda qattiq yozilgan edi va tunda oq
     dog‘ bo‘lib qolardi) */
  --tint-ok:#e3f6ee; --tint-bad:#fdecec; --tint-warn:#fff3e0;
  --tint-violet:#efedff; --violet:#5a4de0;
  /* Ochiladigan menyu — kartadan och kulrang farqli (shell.css) */
  --menu:#f1f2f4;
  /* Kulrang quti (jadval yo‘li, bosilgan qator, kichik belgi), o‘chiq tugma,
     almashtirgich izi — tun uchun tokenga chiqdi (2026-10-01) */
  --zebra:#f7f8fa; --well:#f2f4f7; --press:#e8ebf0;
  --off-bg:#e8ebf0; --off-ink:#98a0ab; --go-off:#a8c2f8; --track:#d7dbe2;
  /* O'lcham */
  --tap:52px; --tap-lg:52px;
  /* ⛔ Yo'lak toraydi: kompyuterda yozuv yo'q */
  --rail:60px; --gap:12px;

  /* ⛔ KARTOCHKA — RAMKASIZ (egasi, 2026-09-13).
   *
   * Oq sirt, yumshoq soya va kattaroq radius. Ramkali kartochka jadvalga o'xshaydi, soyali
   * kartochka esa sirtga o'xshaydi — farq shunda.
   *
   * ⛔ 2026-09-08 da «katta soyalar olib tashlandi» deb yozilgan
   * edi. O'sha qaror NOTO'G'RI edi: soya kerak, faqat u KATTA emas,
   * yumshoq. */
  --card-r:16px;

  /* ⛔ SOYA — UCH POG'ONA, BITTA MANBA (2026-09-16, egasi:
     «shrift va soyalarni ham UI chiroyli qilgin»).
   *
   * ⛔ RANG NEYTRAL EMAS, KO'KIMTIR: `rgba(28,42,74,…)`.
   * Ilgari `rgba(20,24,31,…)` — deyarli qora — turardi va oq
   * kartochka och kulrang varaqdan AJRALMASDI: soya «kir»
   * bo'lib ko'rinardi, ko'tarilgandek emas. Ko'kimtir soya
   * fonning o'z rangi bilan bir oilada bo'ladi.
   *
   * ⛔ HAR POG'ONA IKKI QATLAM: ingichka «tegish» soyasi
   * (1px, chekkani belgilaydi) va yumshoq «muhit» soyasi
   * (kattaroq blur, balandlikni beradi). Bitta qatlam bilan
   * soya yo yo'qdek, yo iflosdek chiqadi.
   *
   * ⛔ Pog'onani ARALASHTIRMANG: maydon kartochka bilan bir
   * og'irlikda tursa ierarxiya yo'qoladi. */
  --sh-1:0 1px 2px rgba(28,42,74,.06), 0 2px 6px rgba(28,42,74,.05);
  /* ⛔ 2026-10-04: karta soyasi kuchliroq (POS ekrani) — 5/8 % xira ekranda yo‘qolardi */
  --sh-2:0 1px 2px rgba(28,42,74,.10), 0 6px 18px rgba(28,42,74,.13);
  /* Ustidan ochiladigani: oyna, ochiladigan ro'yxat */
  --sh-3:0 2px 6px rgba(28,42,74,.08), 0 18px 48px rgba(28,42,74,.16);
  /* ⛔ Pastki panel (telefonda menyu va sana tugmasi) — soya YUQORIGA:
     panel ekran tagiga yopishgan, ostida sirt yo'q (2026-10-02) */
  --sh-up:0 -6px 20px rgba(28,42,74,.07);
  /* ⛔ Almashtirgich tugmachasi — pog'onaga KIRMAYDI: u 18px va
     o'z uyasi ICHIDA turadi, sirt emas. Pog'ona soyasi unda
     tugmachani yo'qotib yuborardi. Lekin O'ZGARUVCHI: soya
     CSS ichida bir martalik yozilmasin (DIZAYN.md 1.6). */
  --sh-knob:0 1px 2px rgba(28,42,74,.30);
  /* ⛔ Eski nomlar — yigirmata faylda ishlatiladi, saqlandi */
  --card-sh:var(--sh-2); --ctl-sh:var(--sh-1);

  /* ⛔ FOKUS HALQASI — BITTA joyda. Ilgari ikki faylda ikkita
     BOSHQA ko'k turardi: `rgba(30,95,208,.16)` va `.15`.
     Ikkalasi ham `--mid` (#2f6fed = 47,111,237) EMAS edi, ya'ni
     halqa brend rangidan biroz boshqacha bo'lib chiqardi. */
  --ring:0 0 0 3px rgba(47,111,237,.18);

  /* ⛔ SHRIFT O'LCHAMI — POG'ONA, TASODIF EMAS.
   *
   * Loyihada 19 xil o'lcham yig'ilgan edi: 13 va 13.5, 14 va
   * 14.5, 11 va 11.5 yonma-yon turardi. Yarim piksel farqni
   * ko'z «boshqa o'lcham» deb emas, «qiyshiq» deb o'qiydi —
   * matn tartibsiz ko'rinishining sababi shu edi.
   *
   * Pog'ona ENG KO'P ISHLATILGAN o'lchamlardan yig'ildi, ya'ni
   * ekranlarning ko'pi qayta chizilmadi.
   *
   * `tests/test_design_code.py` yangi o'lchamni ushlaydi. */
  --t-1:12px;    /* belgi, yorliq yonidagi son      */
  --t-2:13px;    /* jim izoh, jadval sarlavhasi     */
  --t-3:15px;    /* asosiy matn, tugma, maydon      */
  --t-4:16px;    /* ta'kid                          */
  --t-5:18px;    /* blok sarlavhasi                 */
  --t-6:26px;    /* katta son: jami, qoldiq         */
  --t-7:32px;    /* ekran sarlavhasi                */
  --nk-big:40px; /* kartadagi asosiy raqam (`nk-big`, `mc-big`) */

  /* ⛔ QALINLIK — TO'RT POG'ONA, BITTA JOYDA (egasi, 2026-09-27).
   * «Bizni shrifti arzonchi shriftga o'xshaydi, … bold qimmat taft beradi».
   * Yonma-yon surat chizildi (hozirgi · qalinroq) → egasi «A». Farq
   * shriftda emas, QALINLIKDA.
   *
   * ⛔ Xom son yozilmaydi — faqat shu nomlar (`test_design_text.py`).
   * «Biroz ingichkaroq» desa — shu to'rt qator, 23 fayl emas.
   * ⛔ Mayda yozuv (--t-1, --t-2) `--w-bold` olmaydi: 12–13 px da 700
   * qalin emas, QORA — ilgari «eng ko'pi 600» qoidasi shundan edi. */
  --w-text:500;  /* oddiy matn                      */
  --w-mid:600;   /* tugma, yorliq, holat, mayda ta'kid */
  --w-bold:700;  /* nom, summa, blok sarlavhasi     */
  --w-head:800;  /* ekran sarlavhasi, katta son     */

  /* ⛔ 2026-09-27: POG'ONA BIR QADAM KO'TARILDI (egasi: «shrift hajmi ham»).
   * Asosiy matn 14 va sarlavhalar 22–28 edi — ekran «mayda» ko'rinardi. `--t-2`
   * (jim izoh, 108 joyda) tegilmadi: u ataylab past ovozli. */

  /* ⛔ POG'ONANING O'ZIDA HAM YARIM PIKSEL BO'LMAYDI.
   *
   * Birinchi yozganimda sakkiz pog'ona edi va ikkitasi
   * `12.5px` bilan `13px` — ya'ni men tuzatayotgan xatoni
   * pog'onaning ICHIGA qaytadan kiritgandim. Buni men emas,
   * o'zim yozgan test topdi. Ikkalasi bittaga qo'shildi va
   * kattarog'i tanlandi: bozorda kichraytirish hech qachon
   * to'g'ri yo'nalish emas (DIZAYN.md 5.1). */

  /* ⛔ BELGI VA RAQAM POG'ONAGA KIRMAYDI va bu ataylab.
     `font-size:30px` bo'sh savatdagi `||||||` chizmasi, `24px`
     esa ✕ tugmasi — ular MATN emas, SHAKL. Ularni pog'onaga
     tiqish chizmaning o'lchamini buzardi. */

  /* ⛔ QATOR BALANDLIGI ROLGA QARAB.
   *
   * `body` da 1.5 turadi va u ABZAS uchun to'g'ri. Lekin
   * sarlavha 28px × 1.5 = 42px quti bo'lib, so'zning ostida
   * va ustida bo'sh joy qolardi — suratda sarlavha «osilib»
   * ko'rinardi. Katta matnga 1.5 kerak emas: harflar o'zi
   * baland.
   *
   * ⛔ Bu DIZAYN.md 1.4 ni BEKOR QILMAYDI. U yerdagi qoida
   * `body` haqida va o'z kuchida: 1.5 siz OQIYDIGAN matn
   * o'yilgan ko'rinadi. Bu esa sarlavha haqida. */
  --lh-tight:1.2;
}

/* ⛔ SHRIFT TURGA QARAB (DIZAYN 5.11; egasi «A», 2026-10-01 — maket
   `dizayn/neokarta/shrift-taklif-*.png`). «Ekran» — masshtabdan KEYINGI CSS
   kengligi. Telefonda katta raqam va sarlavhalar kichrayadi (joy kam), asosiy
   matn va tugma o‘zgarmaydi (o‘qish, bosish, iOS 16px); keng ekranda (≥ 1800,
   90 % va kichik masshtab) mayda matn +1 px. Ekran fayli xom px yozmaydi —
   telefon yamoqlari shu yerga ko‘chdi. Qo‘riqchi: `test_font_scale_screen`. */
/* ⛔ TUN — BUTUN ILOVA (egasi, 2026-10-01, BA2 «1a 2b»; namuna
   `dizayn/bosh-animatsiya/` D). Tanlov — `js/theme.js`: Tun · Kun · Avto,
   Avto qurilmaning tungi rejimiga ergashadi; `data-theme` sahifa
   chizilishidan OLDIN qo‘yiladi (`index.html`), oq chaqnash bo‘lmasin.
   ⛔ Faqat TOKENLAR almashadi: rangni tokendan olgan har ekran o‘zi
   tunga o‘tadi. Faylga qattiq yozilgan rang (`#fff`) o‘tmaydi — u zona-zona
   tokenga ko‘chiriladi (QARORLAR 5.1). Chek qog‘ozi oq qoladi (soyali DOM). */
:root[data-theme="tun"]{
  color-scheme:dark;
  /* ⛔ 2026-10-02 — FON DEYARLI QORA, KARTA OCHROQ (egasi: «yo fon juda to‘q,
     yo panel juda to‘q — biri farqli bo‘lsin»; 2-pog‘ona, `dizayn/fon/`).
     Ilgari `#0b1020` / `#141b31` — ekranda bir xil to‘q ko‘k edi. */
  --page:#05070d; --glass:#2a3556;
  /* ⛔ 2026-10-07: `#98a3c0` → `#c3cadd` — karta (`--glass`) ustida 4,8 → 7,35:1 */
  --ink:#e8ecf8; --muted:#c3cadd;
  /* Chiziq kartadan OCHROQ: karta ochroq bo‘lgach eski `#26304d` undan
     to‘qroq qolib, ajratuvchi chiziq yo‘qolardi */
  --line:#3a4670;
  --field:#1c2540; --field-on:#232d4d;
  --mid:#4f8cff; --soft:#1a2a52;
  --link:#e8ecf8;
  --deep:#0b1020; --bright:#4f8cff;
  --danger:#f87171; --ok:#34d399; --warn:#fbbf24;
  --price:#fb923c;
  --tint-ok:#123a2f; --tint-bad:#3d1d24; --tint-warn:#3b2c12;
  --tint-violet:#2a2550; --violet:#a99cff;
  /* Ochiladigan menyu kartadan ham OCHROQ — mazmun ustida turadi */
  --menu:#34406a;
  --zebra:#171f37; --well:#1c2540; --press:#26304d;
  --off-bg:#222b45; --off-ink:#6f7a99; --go-off:#2a3352; --track:#34405f;
  --sh-1:0 1px 2px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.25);
  --sh-2:0 1px 2px rgba(0,0,0,.35), 0 10px 28px rgba(0,0,0,.35);
  --sh-3:0 2px 6px rgba(0,0,0,.4), 0 18px 48px rgba(0,0,0,.55);
  --sh-up:0 -6px 20px rgba(0,0,0,.35);
  --sh-knob:0 1px 2px rgba(0,0,0,.6);
  --ring:0 0 0 3px rgba(79,140,255,.35);
}
/* ⛔ KARTA RAMKASI — 1 px GRADIENT, BUTUN TIZIM (egasi, 2026-10-01: R3 —
   «barcha tizimga … gradientli ingichka ramka bilan o‘rash kerak»; tunda —
   D namunasining NEONI: «neon gradient qilganding, menga o‘sha yoqqandi»).
   Burchaklarda ko‘k, o‘rtada kulrang (tunda — nur va xira chiziq).
   ⛔ Soyaga qo‘shib bo‘lmaydi (soya gradient bo‘lmaydi) — har karta O‘Z
   faylida yozadi (`base.css` boshqa ekran sinfini bezamaydi, `TestClassNames`):
       border:1px solid transparent;
       background:linear-gradient(var(--glass),var(--glass)) padding-box,
                  var(--card-edge) border-box var(--glass);
   Qo‘riqchi: `test_design_colors::TestCardEdge` — `--card-sh` / `--sh-2`
   li har karta ramkani ham oladi. Ramkasiz qoladi: ko‘k hero karta,
   oynalar (`.sheet`), chek qog‘ozi. */
/* ⛔ 2026-10-02 (B): ramkaning O‘RTASI ham ko‘rinsin — ilgari kunda `#dfe4ec`,
   tunda 7 % oq edi va ramka faqat burchakda bilinardi (egasi: «ramkasi
   borligi ham bilinmayapti»). */
/* ⛔ 2026-10-04: o‘rtasi `#c8d0dd` → `#aab6c8` — oq kartada 1,55 → 2,07:1, POS ekranida
   ramka ko‘rinsin (egasi: «fondan alohida bo‘lib tursin») */
:root{--card-edge:linear-gradient(135deg,#6f98f5 0%,#aab6c8 28%,#aab6c8 72%,#86a8f7 100%)}
:root[data-theme="tun"]{--card-edge:linear-gradient(135deg,rgba(95,168,255,1) 0%,rgba(255,255,255,.22) 30%,rgba(255,255,255,.22) 70%,rgba(34,211,238,.9) 100%)}
/* ⛔ TUN — NEON (D namunasi): fonda ko‘k nur, asosiy tugma va katta raqam
   yog‘du beradi. Faqat bezak — tuzilish va o‘lcham o‘zgarmaydi. */
:root[data-theme="tun"] body{
  /* nur 85 % dan 30 % ga: kuchli nur fonni karta rangiga yaqinlashtirardi */
  background:radial-gradient(1200px 640px at 75% -10%,rgba(29,58,138,.30) 0%,transparent 60%),var(--page);
}
:root{--glow:0 0 0 transparent;--glow-go:var(--ctl-sh)}
:root[data-theme="tun"]{--glow:0 0 34px rgba(79,140,255,.35);--glow-go:0 0 22px rgba(79,140,255,.45)}
:root[data-theme="tun"] .go:not(:disabled){box-shadow:var(--glow-go)}
@media (max-width:560px){:root{--t-6:22px;--t-7:26px;--nk-big:32px}}
@media (min-width:561px) and (max-width:1099px){:root{--t-6:26px;--t-7:30px;--nk-big:36px}}
@media (min-width:1100px){:root{--t-6:28px;--t-7:32px;--nk-big:40px}}
@media (min-width:1800px){:root{--t-1:13px;--t-2:14px;--t-3:16px;--t-4:17px}}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
/* ⛔ SENSOR (egasi, 2026-09-19: «butun ekranni sensorga mosla —
   POS ekran, sensorli noutbuk, planshet»). `touch-action:
   manipulation` ikki marta bosishda kattalashtirishni va 300 ms
   kechikishni o‘chiradi: kassir «＋» ni tez-tez bossa ekran
   sakramasin. Tugma matni belgilanmaydi — uzoq bosilganda
   nusxa olish menyusi chiqmasin. */
button,a,input,select,textarea,[role=button]{touch-action:manipulation}
button{user-select:none;-webkit-user-select:none}
/* ⛔ IKONKA — `icons.js` (Lucide). Rang matndan (`currentColor`):
   qizil tugmada qizil, o‘chiq tugmada o‘chiq. `flex:none` — tor
   qatorda ikonka siqilib yo‘qolmasin, matn qisqarsin. `.ic-lead` —
   matndan oldin turgan ikonka («Yangi filial» oldidagi «+»). */
.ic{flex:none;vertical-align:middle}
.ic-lead{margin-right:6px;vertical-align:-4px}
/* ⛔ SHRIFT — MONTSERRAT, O'Z SERVERIMIZDA (egasi, 2026-09-27: «bizni ham
   shunaqa chiroyli shrift va shrift hajmi»).

   Bizda Inter edi — toza, lekin «ofis» ko'rinishi. Uch bepul nomzod
   yonma-yon chizildi (Manrope, Onest, Montserrat): tanlangani Montserrat.

   ⛔ Google Fonts EMAS — `frontend/fonts/`: bozorda internet sekin va
   uziladi, begona saytga so'rov esa sahifani kutdiradi. Uch bo'lak
   (lotin, lotin-kengaytma, kirill) — brauzer faqat keraklisini oladi;
   `ʻ` (U+02BB) lotin bo'lagida: «Oʻgʻiloy» bir shriftda chiqsin.
   OFL litsenziyasi — `fonts/OFL.txt`. */
@font-face{font-family:Montserrat;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/montserrat-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Montserrat;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/montserrat-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Montserrat;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/montserrat-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* ⛔ LOGOTIP SHRIFTI — faqat «neokassa» yozuvi (egasi, 2026-10-04: avtobusdagi
   POSCO surati, «A sal bold»). Faqat lotin harflari — yozuv o‘zgarmas, 13 KB.
   Matn va summalar Montserrat da qoladi: yumaloq shriftda raqam sekin o‘qiladi */
@font-face{font-family:Comfortaa;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/comfortaa-latin.woff2) format('woff2');unicode-range:U+0000-00FF}
:root{--f-logo:Comfortaa,Montserrat,system-ui,sans-serif;--logo-ink:.04em}

html,body{height:100%}
/* ⛔ MATN O‘ZBOSHIMCHA KATTALASHMAYDI (egasining videosi, 2026-10-08, «Valyuta va
   to‘lovlar»). iPhone Safari «kompyuter ko‘rinishi»da va yonboshlaganda UZUN
   matnli bloklarni (izoh, tavsif) o‘zi kattalashtiradi, qisqa yozuvlarni
   (sarlavha, yorliq) — yo‘q: izoh sarlavhadan katta chiqardi. O‘lcham faqat
   `--t-*` dan. Barmoq bilan kattalashtirish (zoom) bunga bog‘liq emas, ishlaydi. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* ⛔ PAROL — TIZIM SHRIFTIDA (egasining surati, 2026-09-28: iPhone da
   nuqtalar o‘rnida «▯▯▯»). iPhone brauzeri yashirish belgisini shrift
   oilasining BIRINCHI faylidan oladi — bizda u kirill qismi va unda «•»
   yo‘q. Tizim shriftida belgi doim bor; yozuvning o‘zi ko‘rinmaydi,
   ya'ni Montserrat bu yerda hech narsa bermaydi. */
input[type="password"]{font-family:system-ui,-apple-system,sans-serif}
body{
  font-family:Montserrat,system-ui,sans-serif;color:var(--ink);
  /* ⛔ Bularsiz matn ekranda O'YILGAN ko'rinadi: harflar qalin,
     qatorlar zich. Egasi buni «dag'al» deb ataydi va sabab rangda
     emas — shu ikki qatorda. */
  line-height:1.5;-webkit-font-smoothing:antialiased;
  background:var(--page);overflow:hidden;font-size:var(--t-3);
  font-weight:var(--w-text);
}
/* ⛔ Brauzerning `bolder` i ota-onaga nisbiy: 600 li joyda <b> 900 bo'lardi */
b,strong{font-weight:var(--w-bold)}

/* ⛔ Sarlavha ham asosiy shriftda: ikkinchi shrift oilasi olib
   tashlandi. Sabab ikkita — ko'rinish soddaroq, va sekin
   internetda yuklanadigan fayl ikki barobar kam. */
h1{font-size:var(--t-6);font-weight:var(--w-head);letter-spacing:-.02em;
  line-height:var(--lh-tight);margin-bottom:18px}

/* ⛔ KATTA SON UCHUN UMUMIY QOIDA YOZILMADI — VA BU DARS.
 *
 * Avval bu yerda `.rep-big,.due-box b,.count-row .cnt,…` degan
 * qator turardi: yettita ekranning sinfini `base.css` dan
 * ushlab olgandim. Ikkita qo'riqchi darhol qizardi
 * (`test_bare_layout_class_does_not_leak`,
 * `test_no_new_cross_file_class`) va ular HAQ edi — sinf
 * o'zi ta'riflangan faylda yashaydi (DIZAYN.md 3).
 *
 * Katta sonning qator balandligi kerak bo'lsa, u O'Z faylida
 * yoziladi. Umumiy qoida qulay ko'rinardi, lekin u bitta
 * ekranni o'zgartirganda qolgan oltitasini jimgina
 * o'zgartiradigan qoida edi. */

/* ⛔ BELGI VA BOSHQARUV O'LCHAMI POG'ONADAN TASHQARIDA.
 *
 * `16px` uchta boshqa sababga ko'ra qoladi va uchalasi ham
 * ta'm emas:
 *
 *   maydon   iOS 16px dan KICHIK maydonga bosilganda sahifani
 *            o'zi kattalashtiradi va kassir «sakrab ketdi» deb
 *            o'ylardi (`login.css`, `plan.css` dagi sana)
 *   belgi    ⚙, ＋, … — bular matn emas, SHAKL
 *   raqam    sanalgan miqdor: qatordagi eng muhim son
 *
 * Shuning uchun `test_font_sizes_have_no_half_pixel_twins`
 * o'lchamni emas, YAQIN JUFTLIKNI qidiradi. */

/* ⛔ Yorliqlar BOSH HARFDA emas: «CHAKANA» emas, «Chakana».
   Bosh harf kengroq joy egallaydi va aralash yozuvda (kirill +
   lotin) o'qishni sekinlashtiradi. */
label{display:block;font-size:var(--t-2);font-weight:var(--w-text);letter-spacing:0;
  color:var(--muted);margin-bottom:6px}
.field{margin-bottom:14px}
.wrap{position:relative;display:flex;align-items:center}

/* ⛔ TO'LDIRILGAN, soyasiz (egasi, 2026-09-19).
 *
 * 2026-09-13 da bu yerda «ramka emas, soya» deb yozilgandi va
 * maydon oq + soyali edi. Endi maydon och kulrang va soyasiz: u varaqdan KO'TARILMAYDI, ichiga
 * o'yiladi. Soya kartochkada qoladi — u haqiqatan alohida sirt. */
/* ⛔ 16px — POG‘ONA EMAS (2026-09-29). `--t-3` ga ulangan edi va pog‘ona
   16 → 14 → 15 bo‘lganda maydon ham kichraydi: iPhone bosilganda sahifani
   o‘zi kattalashtirib, ekran chetdan chiqib ketardi (egasining surati).
   `TestFieldsDoNotZoom` qo‘riqlaydi. */
input,select{width:100%;height:var(--tap);padding:0 14px;
  background:var(--field);border:0;box-shadow:none;border-radius:10px;
  font-family:inherit;
  font-size:16px;font-weight:var(--w-text);font-variant-numeric:tabular-nums;
  letter-spacing:0;color:var(--ink);outline:none;
  transition:background .12s,box-shadow .12s}
/* ⛔ Yozilayotgan maydon OQARADI: to'ldirilgan maydonlar orasida
   qaysi biri faol ekani faqat halqadan bilinardi. */
input:focus,select:focus{background:var(--field-on);box-shadow:var(--ring)}
/* Namuna yozuv — matndan OCH qoladi (yozilgan bilan adashmasin), lekin
   maydon fonida o'qiladi: #a8aeb8 da 1,9:1 edi, #7a818c da 3,4:1 (O1) */
input::placeholder{color:#5f6670;font-weight:var(--w-text)}
.hint{margin-top:6px;font-size:var(--t-2);color:var(--muted);min-height:16px}

/* ⛔ Asosiy tugma tekis: gradient, 3D soya va bosilganda pastga
   tushish olib tashlandi. Balandligi o'zgarmadi. */
.go{width:100%;height:var(--tap-lg);margin-top:4px;border:none;border-radius:10px;
  background:var(--mid);color:#fff;font-family:inherit;font-size:var(--t-3);
  font-weight:var(--w-mid);letter-spacing:0;cursor:pointer;transition:background .12s}
.go:active:not(:disabled){background:#2a61d2}
.go:disabled{cursor:not-allowed;background:var(--go-off);color:#fff}
/* ⛔ XAVFLI AMAL — TO‘LIQ QIZIL (egasi, 2026-10-04, «A»). Yetti tasdiq
   tugmasi (`sale_more` chekni bekor qilish, `expense_card`, `writeoff`,
   `inventory_close`, `advance_refund`, savatni bo‘shatish, chiqish)
   `danger` sinfi bilan yozilgan edi, lekin umumiy qoida yo‘q edi — ular
   KO‘K chiqardi; faqat smena daftari (`.sp .go.danger`) qizil edi.
   `button.` — `.xp-nk .go` kabi ekran rangidan kuchli bo‘lsin.
   O‘chiq — o‘sha qizil, xira: «xavfli, lekin hali bosilmaydi». */
button.go.danger{background:var(--danger)}
button.go.danger:active:not(:disabled){background:var(--danger);filter:brightness(.9)}
button.go.danger:disabled{background:var(--danger);opacity:.45}
/* ⛔ O'CHIQ TUGMA — OCH KO'K (`--go-off`), kulrang emas (R1 = a, 2026-10-01):
   ekrandagi eng katta tugma kulrang tasma bo'lib turardi. */

.msg{margin-top:12px;padding:11px 13px;border-radius:10px;font-size:var(--t-3);
  line-height:1.45;display:none}
.msg.show{display:block}
.msg.err{background:var(--tint-bad);color:var(--danger)}
.msg.ok{background:var(--tint-ok);color:var(--ok)}
/* ⛔ Yaxshi holat ham RANG bilan aytilsin: «faol» kulrang
   yozuvda turganda kassir uni o'qimay o'tib ketardi
   (`.hint.bad` allaqachon qizil). */
/* ⛔ `hidden` HAR DOIM KUCHLI. Bu tuzoqqa TO‘RT marta tushildi:
   `.nav-btn`, `.pane.secondary`, `.gap`, `.note-field` — har
   safar alohida qoida yozildi, dars umumlashtirilmadi. To‘rtinchisi
   2026-09-08 da chiqdi: `.two{display:grid}` (debt.css) tasdiq
   tugmalarini `hidden` bo‘lsa ham ko‘rsatib turdi, ya‘ni "bekor
   qilish" ikki bosishga aylanmasdi.

   Sinf selektori atribut selektoridan kuchli, shuning uchun
   `!important` — bu yerda u to‘g‘ri vosita: yashiringan element
   HECH QACHON ko‘rinmasligi kerak. Yuqoridagi alohida qoidalar
   endi ortiqcha, lekin zarar qilmaydi. */
[hidden]{display:none!important}

/* ⛔ «BEKOR» — HAR YERDA BIR XIL (egasi, 2026-10-04, surat va «A»):
   oynani hech narsa o‘zgartirmasdan yopadigan «Bekor» / «Yo‘q» — oq
   tugma, qizil chiziq va qizil yozuv. Xavfli amalning o‘zi («Chekni bekor
   qilish», «Ha, bo‘shatilsin») — TO‘LIQ qizil (`button.go.danger`, yuqorida):
   tasdiq oynasida ikkalasi yonma-yon turadi va kassir xavflisini
   rangidan ajratadi.

   `!important` — `[hidden]` dagi sabab bilan: tugma o‘n xil oynada
   o‘n xil asos sinfda (`.ghost`, `.oc`, `.kc-btn`, `.sed-link`), har
   biri o‘z fayli va konteksti bilan rang beradi (`.sale-acts .ghost`).
   «Bekor» HAR DOIM qizil bo‘lishi kerak — kontekst uni yutmasin.
   Chiziq `border` emas, ichki soya: tugma balandligi o‘zgarmaydi.
   Ro‘yxat va qo‘riqchi — `TestCancelButton` (test_conventions_screen). */
.cancel-btn{color:var(--danger)!important;background:var(--glass)!important;
  box-shadow:inset 0 0 0 1.5px var(--danger)!important}
.cancel-btn:hover:not(:disabled){background:var(--tint-bad)!important}

.hint.ok{color:var(--ok);font-weight:var(--w-bold)}
/* Ro'yxat qatoridagi holat ham rang bilan: «bekor qilingan»
   kulrang yozuvda ko'zga tashlanmasdi. */
.found .sub.bad{color:var(--danger)}
.found .sub.ok{color:var(--ok)}

/* ⛔ `nowrap` MAJBURIY: 2026-09-08 da suratdan topildi — tor
   ekranda «450 000» ikki qatorga bo'linib, «450» va «000»
   bo'lib turardi. Summa hech qachon sinmaydi. */
.money{font-variant-numeric:tabular-nums;font-weight:var(--w-mid);white-space:nowrap}

/* ⛔ RO'YXAT SARLAVHASI — HECH QAYERDA TA'RIFLANMAGAN EDI.
 *
 * `.found-head` uchta ekranda ishlatiladi (cheklar, ombor
 * qoldig'i, xodimlar), lekin CSS da qoidasi YO'Q edi: sarlavha
 * oddiy `div` bo'lib qolgan va «Chek Vaqt Dona Summa» to'rtta
 * so'z chap chekkada yonma-yon turardi, ustunlar esa o'ngda.
 *
 * ⛔ `sales.css` boshidagi izoh «`.found-head` — `debt.css`»
 * deb turardi va bu YOLG'ON edi: u yerda bunday qoida yo'q.
 * Qachondir bo'lgan va refaktorda yo'qolgan. Izoh qolgan.
 *
 * Suratda ko'rindi (2026-09-16) — mantiq testi buni ko'rmaydi:
 * DOM da hamma katak joyida, matn ham to'g'ri.
 *
 * ⛔ `base.css` da, chunki u BITTA ekranniki emas: uchtasi ham
 * bir xil ro'yxat shaklini ishlatadi va shakl bir joyda tursin. */
.found-head{display:flex;align-items:baseline;gap:10px;
  padding:0 16px 6px;color:var(--muted);font-size:var(--t-2)}
/* ⛔ Birinchi katak QATORDAGIDEK cho'ziladi (`debt.css`:
   `.found .who{flex:1}`). Shusiz sarlavha chap chekkada
   siqilib qolib, «Vaqt» yozuvi soatdan 800 piksel narida
   turardi — ya'ni sarlavha bor-u, ustunni ko'rsatmasdi. */
.found-head .who{flex:1;min-width:0}

/* ⛔ MAYDON 1000 PIKSEL BO‘LMAYDI (2.1).
 *
 * «Tovar» ekranida qidiruv maydoni butun kenglikni egallardi:
 * ko‘z chap chekkadan o‘ng chekkagacha yurishi kerak edi va
 * terilgan matn maydonning chap burchagida yolg‘iz qolardi
 * (2026-09-12, suratda ko‘rindi).
 *
 * ⛔ KASSA ISTISNO: savat ekranidagi skaner maydoni ataylab keng —
 * u ekranning eng muhim elementi va kassir unga qaramay uradi. */
@media (min-width:820px){
  main:not(:has(.sale-wrap)) .field{max-width:560px}
  /* ⛔ TUGMA HAM MAYDONDAN KENG BO‘LMAYDI (DIZAYN.md 5.3).
   *
   * 5.3 qoidasi 2026-09-14 da yozilgan, lekin `.go` uchun CSS ga
   * hech qachon tushmagan: har ekran o‘z ustunini o‘zi
   * toraytirardi va OLTITA sahifa unutildi — «Yangi buyurtma»
   * (qoidaning o‘z misoli!) 1920 px monitorda 1400 piksellik
   * tasma bo‘lib turardi (2026-09-20, o‘lchandi). Endi qoida
   * maydon qoidasining YONIDA: ikkalasi bitta son, bitta shart.
   *
   * ⛔ 720 lik ustunlar (chek kartochkasi, oylik) o‘z enini
   * saqlaydi — istisno o‘sha sinf egasining faylida. */
  main:not(:has(.sale-wrap)) .go{max-width:560px}
}

/* ── Hisob qatorlari ─────────────────────────── */

/* ⛔ OLTI ekran ishlatadi: savdo, to‘lov, qaytarish, smena,
   chek kartochkasi va qaytarishlar ro‘yxati. Ilgari ular
   `sale.css` da edi, ya'ni bitta ekran fayli qolganlarini
   «boqib» turardi. */
.sums{margin-top:12px}
.trow{display:flex;justify-content:space-between;align-items:center;
  gap:12px;padding:6px 10px;font-size:var(--t-3);color:var(--muted)}
.trow .money{color:var(--ink);font-weight:var(--w-bold)}
.trow.big{font-size:var(--t-5);color:var(--ink);font-weight:var(--w-bold);
  border-top:1px solid var(--line);margin-top:4px;padding-top:10px}
.trow.big .money{font-size:20px}


/* ── Tafsilot: «yorliq — qiymat» qatorlari ─────────────────────
   ⛔ Egasi (2026-10-02, ikki suratga chizib: «hech qayerda shunaqa
   chiziqlar yo‘q, butun tizimni tahlil qil»; namuna dizayn/chiziqlar,
   javob «Tavsiya» — B, hamma joyga). Bir xil narsa tizimda ikki xil
   chizilgan edi: telefondagi chek oynasi, hisobot, sozlamalarda qatorlar
   chiziq bilan, kompyuterdagi chek, xarajat, qarz, mijoz, kassa amali,
   xabarlar, tovar narxi va profilda — ikki ustunli plitka, chiziqsiz:
   qaysi qiymat qaysi yorliqniki — ko‘z qidirardi.

     .kv-sheet  oyna foni — sahifa rangi: oq bloklar undan ajraladi
     .kv-blk    bo‘lim — oq karta (telefondagi chek bloki bilan bir xil)
     .kv-h      bo‘lim sarlavhasi
     .kv-row    qator: yorliq chapda, qiymat o‘ngda, orasida ingichka chiziq

   ⛔ DIZAYN 5.2 ga zid emas: bular jadval qatorlari — ko‘z ular bo‘ylab
   yuguradi. Birinchi qatorning tepasida chiziq yo‘q (sarlavhadan keyin
   ham): chiziq qatorlarni AJRATADI, blokni kesmaydi.
   ⛔ Qiymat rangi `:where` bilan — havola (mijoz ›, chek ›) o‘z rangini saqlasin. */
/* ⛔ Sinf IKKI MARTA (`.kv-sheet.kv-sheet`) — kuchi ikki sinf: oyna foni
   (`.sheet-card`) `shell.css` da, u `base.css` dan KEYIN yuklanadi va bir
   sinf bilan bosib ketardi. `.sheet-card` ni bu yerda yozib bo‘lmaydi —
   u `shell.css` niki (`test_bare_layout_class_does_not_leak`). */
/* `--field` — oq: oyna sahifa rangida, kulrang maydon (bekor qilish sababi,
   × tugmasi) unga qo‘shilib ketardi */
.kv-sheet.kv-sheet{background:var(--page);--field:var(--field-on)}
.kv-blk{display:flex;flex-direction:column;margin-top:12px;padding:4px 16px 6px;
  border-radius:20px;background:var(--glass)}
.kv-blk[hidden]{display:none}
.kv-h{margin:10px 0 2px;color:var(--ink);font-size:var(--t-4);font-weight:var(--w-bold)}
.kv-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;
  gap:2px 12px;min-width:0;padding:11px 0;border-top:1px solid var(--line);
  color:var(--muted);font-size:var(--t-3)}
.kv-row[hidden]{display:none}
.kv-row:first-child,.kv-h + .kv-row{border-top:0}
:where(.kv-row > :last-child:not(:first-child)){min-width:0;color:var(--ink);
  text-align:right;overflow-wrap:anywhere}

/* ⛔ KLAVISH BELGILARI (`.kbd` — «L», «B», «/») faqat klaviaturali qurilmada
   (egasi, 2026-10-04, POS videosi: sensorli kassada va telefonda ularni bosib
   bo‘lmaydi, faqat shovqin). Klavishlarning o‘zi ishlayveradi. */
@media (hover:none) and (pointer:coarse){.kbd{display:none !important}}

/* ⛔ MIJOZ YORLIG‘I KESILMAYDI — QATORGA O‘TADI (egasi, 2026-10-25).
   «<uzun joy nomi> · <ism familiya> · <kod>»: joy ism OLDIDA
   (`customer_label.js`), ya'ni ikki qatorlik chegara («…») uzun joy bilan
   to‘lib, kesiladigani ISM bo‘lardi — yorliq o‘z ishini qilmay qoladi.
   Bitta sinf, bitta joy: har ekranning o‘z «2 qator / …» qoidasi (tovar
   nomi uchun, 2026-10-08) mijoz yorlig‘ida bekor. Raqam bo‘linmaydi.
   Qo‘riqchi — tests/ui/test_customer_label_fit_screen.py */
.cl-full{-webkit-line-clamp:none!important;overflow:visible!important;
  white-space:normal!important;text-overflow:clip!important;overflow-wrap:anywhere}
.cl-full .sub{white-space:nowrap}

/* ═══ JOYLASHUV — UCH QOLIP (egasi «Tavsiya», 2026-10-28, JQ1…3 a; DIZAYN 5.12,
   dizayn/joylashuv). Ilgari hamma joyda bitta naqsh — «asosiy + o‘ngda 300 px»
   — raqamlarga ham ishlatilgan: Qarzlarda o‘ng ustun tagida 500–600 px bo‘sh,
   jadval siqilgan. ⛔ Mahkam bo‘lmagan yon ustun YO‘Q — qo‘riqchi
   tests/ui/test_layout_holes_screen.py har sahifani o‘lchaydi.
     Q1 Ro‘yxat   `.lay-sum` — raqam kartalari jadval USTIDA, bir qatorda
     Q2 Ish joyi  `.lay-panel` — o‘ngdagi bosiladigan panel MAHKAM
     Q3 Kartalar  `lay_balance.js` — ustunlar teng (Bosh sahifa) */
/* Q1: karta sig‘masa keyingi qatorga o‘tadi; YOLG‘IZ karta butun enni oladi
   (ikki ustunli to‘r bo‘lsa yonida bo‘sh katak qolardi). `.lay-wide` — ikki
   barobar keng (ichida bir necha raqam turgan karta) */
.lay-sum{display:flex;flex-wrap:wrap;gap:14px;align-items:stretch}
.lay-sum > *{flex:1 1 260px;min-width:0;margin:0}
.lay-sum > .lay-wide{flex-grow:2}
/* Q2: panel ro‘yxat bilan birga yuradi va ekrandan oshsa o‘zi aylanadi
   (`main` ichki aylanadi — `top:0` o‘sha qutiga nisbatan). Torda sahifa
   o‘zi bitta ustunga o‘tkazadi — u yerda panel oddiy blok */
.lay-panel{position:sticky;top:0;max-height:calc(100dvh - 24px);overflow-y:auto}