:root{
  /* matn */
  --ink:#111A15; --ink2:#33413A; --muted:#566459; --muted2:#5E6B63; /* UX-AUDIT 24.08: WCAG 1.4.3 — 4,39:1 edi, endi ≥4,9:1 */
  /* yuza */
  --bg:#F5F7F5; --yuza:#ffffff; --yuza2:#FAFBFA;
  --line:#E2E8E4; --line2:#EDF1EE;
  /* urgu */
  --brand:#1B4A33; --brand-tiq:#133426; --brand-bg:#EDF4F0; --brand-line:#C6DDD0;
  --navy:#0A1D13;
  /* holat */
  --ok:#17693F; --ok-bg:#E9F3EC; --ok-line:#BEDFC9;
  --warn:#8A5A08; --warn-bg:#FCF6E9; --warn-line:#EBD9AF;
  --danger:#AE2A20; --danger-bg:#FBEEEC; --danger-line:#EFC9C4;
  /* shakl */
  --r1:8px; --r2:11px; --r3:14px;
  --soya:0 1px 2px rgba(17,24,39,.04), 0 1px 3px rgba(17,24,39,.05);
  --soya2:0 2px 4px rgba(17,24,39,.05), 0 6px 16px rgba(17,24,39,.07);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:'Inter','Segoe UI',system-ui,-apple-system,'Helvetica Neue',sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.55;font-size:14.5px;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{line-height:1.3;letter-spacing:-.011em;font-weight:700}
a{color:var(--brand)}
::selection{background:var(--brand-bg);color:var(--brand-tiq)}

/* ---------- tepa panel ---------- */
.top{background:linear-gradient(118deg,#0A1D13 0%,#123927 52%,#256B48 140%);color:#fff;
  padding:11px 22px;display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.top h1{font-size:16px;letter-spacing:.2px;font-weight:800}
.top .rol{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:3px 12px;font-size:11.5px;font-weight:600;letter-spacing:.3px;text-transform:uppercase}
.top form{margin-left:auto}
.top button{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.24);
  border-radius:var(--r1);padding:6px 15px;cursor:pointer;font-size:13px;font-weight:600;
  font-family:inherit;transition:background .15s,border-color .15s}
.top button:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.42)}

/* ---------- yuqori menyu ---------- */
nav{display:flex;gap:5px;padding:9px 18px;background:var(--yuza);
  border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}
nav a{padding:6px 15px;border-radius:999px;text-decoration:none;color:var(--muted);
  font-size:13.5px;font-weight:600;white-space:nowrap;transition:background .15s,color .15s}
nav a:hover{background:var(--brand-bg);color:var(--brand-tiq)}
nav a.faol{background:var(--brand);color:#fff}
nav a.faol:hover{background:var(--brand-tiq);color:#fff}
nav .ntl{font-size:10px;color:var(--muted2);letter-spacing:1.2px;font-weight:700;
  align-self:center;padding-right:5px;white-space:nowrap;text-transform:uppercase}

/* ---------- karkas ---------- */
.wrap{max-width:1000px;margin:0 auto;padding:20px 16px 40px}
.layout{display:flex;gap:20px;max-width:1260px;margin:0 auto;padding:20px 16px 40px;align-items:flex-start}
.layout .wrap{flex:1;max-width:none;margin:0;padding:0;min-width:0}

/* ---------- yon menyu ---------- */
.yon{width:206px;flex:none;position:sticky;top:14px}
.yon .yt{font-size:10px;color:var(--muted2);letter-spacing:1.2px;margin:2px 0 7px 6px;
  font-weight:700;text-transform:uppercase}
.yon a{display:flex;align-items:center;gap:7px;padding:9px 13px;border-radius:var(--r2);margin-bottom:4px;
  background:transparent;border:1px solid transparent;text-decoration:none;color:var(--ink2);
  font-weight:600;font-size:13.5px;transition:background .15s,color .15s}
.yon a:hover{background:var(--yuza);border-color:var(--line);color:var(--ink)}
.yon a.faol{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:var(--soya)}
.yon a.faol:hover{background:var(--brand-tiq);color:#fff}
.yon .ygr{margin-bottom:16px}
.yon .yhz{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-line);
  border-radius:999px;padding:0 7px;font-size:9.5px;font-weight:700;letter-spacing:.2px}

/* ---------- kartalar ---------- */
.card{background:var(--yuza);border:1px solid var(--line);border-radius:var(--r3);
  padding:18px 20px;margin-bottom:16px;box-shadow:var(--soya)}
.card h2{font-size:15.5px;margin-bottom:12px;letter-spacing:-.01em;display:flex;
  align-items:center;gap:8px;flex-wrap:wrap}
.card h3{font-size:14px;margin-bottom:8px}
.izoh{font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.6}
.vaqt{color:var(--muted2);font-size:11.5px;text-align:right;margin-bottom:10px}

/* ---------- plitalar ---------- */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:12px;margin-bottom:18px}
.tile{background:var(--yuza);border:1px solid var(--line);border-radius:var(--r3);
  padding:14px 16px;box-shadow:var(--soya);position:relative;overflow:hidden}
.tile:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:transparent}
.tile.ok:before{background:var(--ok)}
.tile.warn:before{background:var(--warn)}
.tile.bad:before{background:var(--danger)}
.tile .l{font-size:10.5px;color:var(--muted2);text-transform:uppercase;letter-spacing:.9px;font-weight:700}
.tile .v{font-size:27px;font-weight:800;margin-top:3px;letter-spacing:-.02em;line-height:1.15}
.tile.ok .v{color:var(--ok)}.tile.warn .v{color:var(--warn)}.tile.bad .v{color:var(--danger)}
.tlink{display:block;text-decoration:none;color:inherit;flex:1;min-width:158px}
.tlink .tile{height:100%;cursor:pointer;transition:box-shadow .15s,border-color .15s,transform .15s}
.tlink:hover .tile{border-color:var(--brand-line);box-shadow:var(--soya2);transform:translateY(-1px)}

/* ---------- jadval ---------- */
.jscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted2);
  font-weight:700;padding:8px 9px;border-bottom:1px solid var(--line)}
td{padding:9px 9px;border-bottom:1px solid var(--line2)}
tbody tr:last-child td,table tr:last-child td{border-bottom:none}
tr:hover>td{background:var(--yuza2)}
.r{text-align:right}.b{font-weight:700}
td,.tile .v{font-variant-numeric:tabular-nums}
.card table th{position:sticky;top:0;background:var(--yuza);z-index:2}
th.jsort{cursor:pointer;user-select:none}
th.jsort:hover{color:var(--brand)}

/* ---------- belgi (pill) ---------- */
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 11px;
  font-size:11.5px;font-weight:700;background:var(--yuza2);color:var(--muted);
  border:1px solid var(--line)}
.pill.ok{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-line)}
.pill.warn{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-line)}
.pill.bad{background:var(--danger-bg);color:var(--danger);border-color:var(--danger-line)}
.pill.ok:before{content:"\25CF"}
.pill.warn:before{content:"\25B2"}
.pill.bad:before{content:"\25A0"}

/* ---------- tugmalar ---------- */
button,.tugma{font-family:inherit}
.tugma,button.tugma{display:inline-flex;align-items:center;gap:7px;border-radius:var(--r1);
  padding:8px 16px;font-size:13.5px;font-weight:700;cursor:pointer;border:1px solid var(--line);
  background:var(--yuza);color:var(--ink2);transition:background .15s,border-color .15s,box-shadow .15s}
.tugma:hover{border-color:#CFD8D2;background:var(--yuza2)}
.tugma.asosiy{background:var(--brand);border-color:var(--brand);color:#fff}
.tugma.asosiy:hover{background:var(--brand-tiq);border-color:var(--brand-tiq)}
.tugma.ogoh{background:var(--warn-bg);border-color:var(--warn-line);color:var(--warn)}
.tugma.ogoh:hover{background:#fdf3e0;border-color:#e9cb93}
.tugma.xavf{background:var(--danger-bg);border-color:var(--danger-line);color:var(--danger)}
.tugma.xavf:hover{background:#fbe9e9;border-color:#e7b9b9}
.tugma:disabled{opacity:.5;cursor:default}
.mini{background:var(--yuza);border:1px solid var(--line);border-radius:var(--r1);padding:5px 12px;
  font-size:12.5px;cursor:pointer;color:var(--brand);font-weight:700;font-family:inherit;
  transition:background .15s,border-color .15s}
.mini:hover{background:var(--brand-bg);border-color:var(--brand-line)}

/* ---------- xabar bloklari ---------- */
.eskirgan{background:var(--warn-bg);border:1px solid var(--warn-line);border-left:3px solid var(--warn);
  border-radius:var(--r2);padding:11px 16px;margin-bottom:16px;font-size:13px;color:#8a4b09}
.zid{background:var(--danger-bg);border:1px solid var(--danger-line);border-left:3px solid var(--danger);
  border-radius:var(--r2);padding:10px 14px;font-size:13px;margin:8px 0;color:#9c2020}
.natija{background:var(--brand-bg);border:1px solid var(--brand-line);border-radius:var(--r2);
  padding:10px 14px;font-size:13px;margin:8px 0;color:var(--brand-tiq)}

/* ---------- diagramma / progress ---------- */
.bar{height:8px;background:var(--line2);border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--brand);border-radius:999px}
.qat{display:flex;align-items:center;gap:11px;padding:6px 0;font-size:14px;font-variant-numeric:tabular-nums}
.qat .nom{width:82px;color:var(--muted)}.qat .blk{flex:1}
.kun{display:flex;align-items:flex-end;gap:3px;height:92px;margin-top:10px}
.kun i{flex:1;background:var(--brand);border-radius:3px 3px 0 0;min-height:2px;opacity:.85}
.kun i.bosh{background:var(--line)}

/* ---------- motiv bloki ---------- */
.motiv{background:linear-gradient(132deg,#08170F 0%,#14402B 60%,#2B7A54 130%);border-radius:var(--r3);
  color:#fff;padding:28px 24px;text-align:center;margin-bottom:18px;box-shadow:var(--soya2)}
.motiv .ism{font-size:19px;letter-spacing:1.2px;color:#A9D8BF;margin-top:14px;font-weight:600}
.motiv .pul{font-size:44px;font-weight:900;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.motiv .maqsad{margin-top:18px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r2);padding:12px 16px;font-size:14.5px}

/* ---------- vazifa qatorlari ---------- */
.vaz{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line2);font-size:14.5px}
.vaz:last-child{border-bottom:none}
.vaz .m{flex:1}
.vaz form{margin:0}
.vaz button{background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:var(--r1);
  padding:8px 18px;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}
.vaz button:hover{background:var(--brand-tiq)}
.vaz .ok{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-line);border-radius:var(--r1);
  padding:7px 14px;font-size:12.5px;font-weight:700;white-space:nowrap}

/* ---------- kirish sahifasi ---------- */
.login{max-width:370px;margin:13vh auto;background:var(--yuza);border:1px solid var(--line);
  border-radius:18px;padding:34px 30px;text-align:center;box-shadow:var(--soya2)}
.login h1{font-size:23px;margin-bottom:4px;letter-spacing:-.02em}
.login p{color:var(--muted);font-size:13px;margin-bottom:20px}
.login input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r2);
  font-size:16px;margin-bottom:12px;font-family:inherit;background:var(--yuza2)}
.login input:focus{background:#fff;border-color:var(--brand-line)}
.login button{width:100%;padding:12px;background:var(--brand);color:#fff;border:none;border-radius:var(--r2);
  font-size:16px;font-weight:700;cursor:pointer;font-family:inherit}
.login button:hover{background:var(--brand-tiq)}
.login .x{color:var(--danger);font-size:13px;margin-bottom:10px}

/* ---------- jurnal boshqaruvi ---------- */
.jboshq{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:2px 0 12px}
.jboshq input[type=search]{flex:1;min-width:160px;padding:8px 12px;border:1px solid var(--line);
  border-radius:var(--r1);font-size:14px;font-family:inherit;background:var(--yuza2)}
.jboshq input[type=search]:focus{background:#fff;border-color:var(--brand-line)}
.jboshq .jcsv{padding:8px 13px;border:1px solid var(--line);border-radius:var(--r1);background:var(--yuza);
  font-size:12.5px;text-decoration:none;color:var(--muted);white-space:nowrap;font-weight:600}
.jboshq .jcsv:hover{border-color:var(--brand-line);color:var(--brand);background:var(--brand-bg)}
.jboshq .json-soni{font-size:12px;color:var(--muted2);white-space:nowrap}
.jsahifa{display:flex;gap:5px;align-items:center;justify-content:center;margin-top:12px;flex-wrap:wrap}
.jsahifa button{min-width:34px;padding:6px 10px;border:1px solid var(--line);background:var(--yuza);
  border-radius:var(--r1);font-size:13px;cursor:pointer;font-family:inherit;color:var(--ink2)}
.jsahifa button:hover{border-color:var(--brand-line);color:var(--brand)}
.jsahifa button.faol{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:700}
.jsahifa button:disabled{opacity:.35;cursor:default}
.jyoq{color:var(--muted2);font-size:13px;padding:12px 2px}

/* ---------- akkordeon ---------- */
details.tvzacc{margin:8px 0}
details.tvzacc>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;
  padding:9px 14px;border:1px solid var(--line);border-radius:var(--r1);background:var(--yuza2);
  color:var(--ink2);font-weight:600;font-size:13px;user-select:none;transition:background .15s,border-color .15s}
details.tvzacc>summary::-webkit-details-marker{display:none}
details.tvzacc>summary:before{content:"\25B8";color:var(--muted2);font-size:11px}
details.tvzacc[open]>summary:before{content:"\25BE"}
details.tvzacc>summary:hover{background:var(--brand-bg);border-color:var(--brand-line);color:var(--brand-tiq)}
details.tvzacc[open]>summary{border-radius:var(--r1) var(--r1) 0 0;background:var(--brand-bg);
  border-color:var(--brand-line);color:var(--brand-tiq)}
details.tvzacc>table{border:1px solid var(--brand-line);border-top:none;border-radius:0 0 var(--r1) var(--r1)}
details.tvzacc>table th{padding-top:9px}
details.tvzacc>table th:first-child,details.tvzacc>table td:first-child{padding-left:14px}
details.tvzacc>table th:last-child,details.tvzacc>table td:last-child{padding-right:14px}

/* ---------- CHOP: kanal sahifasi ---------- */
.kn-tablar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.kn-tab{padding:8px 20px;border-radius:999px;text-decoration:none;font-weight:700;font-size:13.5px;
  background:var(--yuza2);color:var(--muted);border:1px solid var(--line);transition:all .15s}
.kn-tab:hover{background:var(--brand-bg);color:var(--brand-tiq);border-color:var(--brand-line)}
.kn-tab.faol{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:var(--soya)}

.kn-guruh{margin:16px 0;padding:14px 16px 12px;border:1px solid var(--line);border-radius:var(--r3);background:var(--yuza2)}
.kn-guruh.ok{border-color:var(--ok-line);background:var(--ok-bg)}
.kn-guruh.kut{border-color:var(--warn-line);background:var(--warn-bg)}
.kn-sarl{font-size:13.5px;font-weight:800;margin:0 0 10px;letter-spacing:-.01em;display:flex;
  align-items:center;gap:8px;flex-wrap:wrap}
.kn-guruh.ok .kn-sarl{color:var(--ok)}
.kn-guruh.kut .kn-sarl{color:var(--warn)}
.kn-ogoh{margin:0 0 10px;padding:8px 12px;border-radius:var(--r1);background:var(--danger-bg);
  border:1px solid var(--danger-line);color:var(--danger);font-weight:700;font-size:12.5px}

.kn-nak{background:var(--yuza);border:1px solid var(--line);border-radius:var(--r2);
  padding:12px 14px;margin:10px 0;box-shadow:var(--soya)}
.kn-qator{display:flex;gap:9px;flex-wrap:wrap;align-items:center;font-weight:600;font-size:13px;color:var(--ink2)}
.kn-son{display:inline-flex;align-items:center;background:var(--ok-bg);border:1px solid var(--ok-line);
  color:var(--ok);border-radius:var(--r1);padding:3px 11px;font-size:14px;font-weight:800;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.kn-chiq{display:inline-flex;align-items:center;background:var(--brand-bg);border:1px solid var(--brand-line);
  color:var(--brand-tiq);border-radius:var(--r1);padding:3px 11px;font-size:12.5px;font-weight:700;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.kn-nak b.kn-chala{color:var(--danger)}
.kn-nak b.kn-muddat{color:var(--ok)}
.kn-amal{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0}
.kn-qog{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:12px;color:var(--muted)}
.kn-qog select{padding:6px 10px;border-radius:var(--r1);background:var(--yuza);color:var(--ink);
  border:1px solid var(--line);font-weight:600;font-size:13px;font-family:inherit;cursor:pointer}
.kn-qog select:hover{border-color:var(--brand-line)}
.kn-pvz{font-size:12px;color:var(--muted);margin:8px 0 2px}
.kn-kut-nak{margin:10px 0 4px;font-weight:700;color:#8a6a2a;font-size:13px}
.kn-xira{opacity:.7}
.kn-pid{font-size:11px;color:var(--muted2)}
.kn-sku{font-size:12.5px}
.kn-w56{width:56px}
.kn-qoida{font-size:12px;color:var(--muted);margin-top:14px;padding-top:12px;border-top:1px solid var(--line2);line-height:1.65}

/* ---------- kichik yordamchilar ---------- */
abbr.atama{text-decoration:underline dotted;text-underline-offset:2px;cursor:help;border:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
input,select,textarea{font-family:inherit}

/* ---------- moslashuvchanlik ---------- */
@media(max-width:900px){
  .layout{flex-direction:column-reverse;gap:14px;align-items:stretch}
  .yon{width:100%;position:static;display:flex;overflow-x:auto;gap:6px;padding-bottom:4px}
  .yon .ygr{display:contents}
  .yon .yt{display:block;font-size:10px;margin:7px 7px 7px 0;align-self:center}
  .yon a{white-space:nowrap;margin-bottom:0;flex:none;background:var(--yuza);border-color:var(--line)}
}
@media(max-width:700px){.card table{display:block;overflow-x:auto}}
@media(max-width:640px){
  body{font-size:14px}
  .wrap,.layout{padding:14px 11px 32px}
  .card{padding:15px 14px;border-radius:12px}
  table{font-size:13px}
  th{font-size:10.5px}
  td{padding:8px 7px}
  .jscroll table{min-width:520px}
  .tiles{grid-template-columns:repeat(2,1fr)!important}
  h2{font-size:15px}
  .tile .v{font-size:24px}
  .kn-qator{font-size:12.5px}
  .kn-nak{padding:11px 12px}
}
@media(max-width:420px){.tiles{grid-template-columns:repeat(2,1fr)!important}}

/* ---------- MOBIL MOSLASHUV v2 (2026-08-23, ega: "telefonda korish noqulay") ---------- */
@media(max-width:700px){
  /* HAR QANDAY jadval oz ichida aylanadi - sahifa yon tomonga kengaymaydi */
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  .jscroll table{display:table;min-width:520px}
}
@media(max-width:640px){
  /* tepa panel ixcham */
  .top{padding:8px 12px;gap:9px}
  .top h1{font-size:14.5px}
  .top .rol{padding:2px 9px;font-size:10.5px}
  .top button{padding:5px 11px;font-size:12.5px}
  /* yuqori menyu: yopishqoq, barmoq uchun kattaroq, skrollbar korinmas */
  nav{position:sticky;top:0;z-index:50;padding:8px 10px;gap:6px;
    box-shadow:0 1px 4px rgba(17,24,39,.06);scrollbar-width:none}
  nav::-webkit-scrollbar{display:none}
  nav a{padding:5px 11px;font-size:12.5px}
  .yon a{padding:6px 11px;font-size:12.5px}
  /* iOS avtozoom oldini olish: maydonlar 16px */
  input,select,textarea{font-size:16px!important}
  /* tugmalar - barmoq nishoni (min 42px) */
  .tugma,button.tugma{min-height:32px;padding:5px 11px;font-size:12.5px;gap:5px;border-radius:7px}
  .mini{min-height:28px;padding:4px 9px;font-size:12px}
  .vaz{flex-wrap:wrap;gap:8px}
  .vaz button{min-height:30px;padding:5px 12px;font-size:12.5px}
  /* chop (kn) tugmalari - 2x2 tor, teng kenglik */
  .kn-amal{display:inline-flex;gap:6px}
  .kn-amal .tugma{flex:0 1 auto}
  .kn-qator{row-gap:6px}
  /* raqam plitalari ixcham */
  .tiles{gap:9px;margin-bottom:14px}
  .tile{padding:11px 12px}
  .tile .l{font-size:9.5px;letter-spacing:.6px}
  .tile .v{font-size:21px}
  /* motiv bloki */
  .motiv{padding:20px 14px}
  .motiv .pul{font-size:33px}
  .motiv .ism{font-size:16px}
  /* diagrammalar */
  .kun{height:70px}
  .qat{gap:8px}
  .qat .nom{width:64px;font-size:12.5px}
  /* jurnal boshqaruvi: qidiruv toliq qator */
  .jboshq input[type=search]{flex:1 1 100%;min-width:0}
  .jsahifa button{min-width:28px;min-height:26px;font-size:12px}
  /* kirish */
  .login{margin:7vh auto;padding:26px 20px;max-width:92vw}
  .vaqt{font-size:10.5px}
}
@media(max-width:420px){
  .top h1{font-size:13.5px}
  .kn-amal .tugma{flex:0 1 auto}
}

/* ---------- logo (2026-08-23) ---------- */
.logochip{display:inline-flex;align-items:center;background:#fff;border-radius:7px;padding:2px 6px;vertical-align:middle}
.logochip img{height:22px;display:block}

/* ---------- MOBIL IXCHAM BLOKLAR (2026-08-23, ega: "bloklar ham ixcham pragmatik") ---------- */
@media(max-width:640px){
  body{font-size:13.5px}
  .wrap,.layout{padding:10px 8px 26px;gap:10px}
  h2{font-size:14px}
  /* kartalar zich */
  .card,.mvk,.tzk{padding:11px 12px;margin-bottom:10px;border-radius:10px}
  .card h2{font-size:13.5px;margin-bottom:8px}
  .mvk h2{font-size:13.5px;margin-bottom:7px}
  .izoh{font-size:11.5px;margin-top:4px}
  .vaqt{margin-bottom:6px}
  /* plitkalar zich */
  .tiles{gap:7px;margin-bottom:10px}
  .tile{padding:8px 10px;border-radius:9px}
  .tile .l{font-size:9px;letter-spacing:.5px}
  .tile .v{font-size:18px;margin-top:1px}
  /* jadval zich */
  table{font-size:12.5px}
  th{padding:6px 6px;font-size:9.5px}
  td{padding:6px 6px}
  /* xabar bloklari zich */
  .eskirgan,.zid,.natija{padding:8px 11px;font-size:12px;margin-bottom:9px}
  /* motiv */
  .motiv{padding:14px 12px;margin-bottom:11px}
  .motiv .pul{font-size:28px}
  .motiv .maqsad{padding:8px 11px;font-size:12.5px;margin-top:10px}
  /* vazifa qatorlari */
  .vaz{padding:8px 2px;font-size:13px;gap:8px}
  /* kn (chop) bloklari */
  .kn-nak{padding:9px 10px;margin:7px 0}
  .kn-guruh{padding:10px 11px 8px;margin:10px 0}
  .kn-qator{font-size:12px;gap:6px}
  .kn-son,.kn-chiq{padding:2px 8px;font-size:12px}
  /* jurnal boshqaruvi zich */
  .jboshq{gap:6px;margin:2px 0 8px}
  .jboshq input[type=search]{padding:6px 10px}
  /* formalar ixcham */
  input,select,textarea{font-size:15px!important}
  select{padding:6px 8px!important}
  input[type=number],input[type=text],input[type=search],input[type=password]{padding:6px 10px!important}
}

/* ---------- MOBIL IXCHAM SAHIFA-LOKAL (2026-08-23) ----------
   mavzu/tizim/xodimlar sahifalari o'z <style> bloki bilan keladi (hujjatda keyin
   turgani uchun ustun chiqadi). body-prefiks selektorlar spetsifiklikni oshirib,
   ularni ham ixcham rejimga bo'ysundiradi. */
@media(max-width:640px){
  /* mavzu (menejer/FBO/buyurtma) */
  body .mvk{padding:10px 11px;margin-bottom:9px;border-radius:10px}
  body .mvk h2{font-size:13.5px;margin-bottom:7px}
  body .mvj{font-size:12px}
  body .mvj th,body .mvj td{padding:5px 6px}
  body .mvlenta{font-size:11.5px;padding:8px 10px;max-height:250px}
  body .mvizoh{font-size:11px;margin-top:5px}
  /* tizim */
  body .tzgrid{gap:7px;margin-bottom:10px}
  body .tzt{padding:8px 10px;border-radius:9px}
  body .tzt .l{font-size:9.5px}
  body .tzt .v{font-size:18px}
  body .tzk{padding:10px 11px;margin-bottom:9px;border-radius:10px}
  body .tzk h3{font-size:13.5px;margin-bottom:7px}
  body .tzr{padding:7px 10px;margin-bottom:6px;font-size:12.5px}
  body .tzjad th,body .tzjad td{padding:5px 6px;font-size:12px}
  body .tzf select,body .tzf input{padding:6px 8px;font-size:12.5px}
  body .tzf button{padding:6px 12px;font-size:12.5px}
  body .tkmatn{font-size:11.5px;padding:10px 12px}
  body .tkmatn2{font-size:12.5px;padding:12px 14px}
  /* xodimlar */
  body .xkart{padding:10px 11px;margin-bottom:9px;border-radius:10px}
  body .xkart h3{font-size:13.5px;margin-bottom:7px}
  body .xt th,body .xt td{padding:6px 7px;font-size:12.5px}
  body .xgrid{gap:7px;margin-bottom:8px}
  body .xgrid input,body .xgrid select{padding:6px 8px}
  body .xb{padding:6px 12px;font-size:12.5px}
  body .xchk label{padding:4px 10px;font-size:12px}
  body .xn{padding:8px 11px;margin-bottom:9px;font-size:12.5px}
  /* umumiy bloklarni ham body-prefiks bilan mustahkamlash */
  body .card{padding:11px 12px;margin-bottom:10px;border-radius:10px}
  body .tile{padding:8px 10px;border-radius:9px}
  body .tile .v{font-size:18px}
  body details.tvzacc>summary{padding:7px 10px;font-size:12.5px}
}

/* ---------- MOBIL SHAPKA (2026-08-23, ega: "shapkasi galati") ----------
   Sabab: biror keng element sahifani yon tomonga chozgan - shapka viewport
   kengligida qolib, kartalar chozilgan kenglikda edi (ong tomonda oq boshliq).
   Yechim: gorizontal overflow butunlay yopiladi (jadvallar oz ichida aylanadi,
   ularga tasir yoq) + uzun uzilmas matnlar sindiriladi + shapka zich. */
@media(max-width:700px){
  html,body{max-width:100vw;overflow-x:hidden}
  body .mvlenta,body .tkmatn,body .izoh,body .mvizoh,body .natija,body .eskirgan,body .zid{overflow-wrap:anywhere;word-break:break-word}
}
@media(max-width:640px){
  /* 1-qator: tepa panel */
  body .top{padding:6px 10px;gap:8px}
  body .top h1{font-size:13.5px;gap:6px;display:inline-flex;align-items:center}
  body .logochip{padding:2px 4px;border-radius:6px}
  body .logochip img{height:17px}
  body .top .rol{padding:2px 8px;font-size:9.5px}
  body .top button{padding:4px 10px;font-size:12px;border-radius:7px}
  /* 2-qator: yuqori menyu */
  body nav{padding:5px 8px;gap:4px}
  body nav a{padding:4px 9px;font-size:12px}
  body nav .ntl{font-size:8.5px;letter-spacing:.8px}
  /* 3-qator: bolim chiplari (yon) */
  body .yon{gap:4px;padding-bottom:3px}
  body .yon a{padding:4px 9px;font-size:12px;border-radius:8px;gap:4px}
  body .yon .yt{font-size:8.5px;margin:4px 4px 4px 0;letter-spacing:.8px}
  body .yon .yhz{font-size:8px;padding:0 5px}
  body .layout{gap:6px}
}

/* ---------- sahifa boshi (UX NAV1 2026-08-24) ---------- */
.phd{background:var(--yuza);border:1px solid var(--line);border-radius:var(--r3);padding:14px 18px 13px;margin-bottom:14px;box-shadow:var(--soya)}
.phd .crumb{font-size:11px;color:var(--muted2);font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:5px}
.phd .crumb b{color:var(--brand)}
.phd .prow{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.phd .ph1{font-size:20px;font-weight:800;letter-spacing:-.02em;margin:0 0 3px}
.phd .pizoh{font-size:13px;color:var(--muted);line-height:1.55;margin:0;max-width:78ch}
.phd .pyord{font-size:12px;font-weight:700;text-decoration:none;color:var(--brand);white-space:nowrap;padding:4px 2px;min-height:24px;display:inline-flex;align-items:center}
@media(max-width:640px){.phd{padding:12px 13px}.phd .ph1{font-size:17.5px}}

/* ---------- chap rels (NAV v2, 2026-08-24) ---------- */
.rail{width:238px;flex:none;position:sticky;top:14px;background:var(--yuza);border:1px solid var(--line);border-radius:var(--r3);padding:10px 9px;box-shadow:var(--soya)}
.rail .rgrp{margin-bottom:2px}
.rail .rgh{display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:var(--r2);font-size:12.5px;font-weight:800;letter-spacing:.02em;color:var(--ink2);text-decoration:none;border:1px solid transparent;min-height:24px}
.rail .rgh:hover{background:var(--yuza2);border-color:var(--line)}
.rail .rgh .rn{flex:1}
.rail .rgh .rc{font-size:10.5px;font-weight:700;opacity:.55;font-variant-numeric:tabular-nums}
.rail .rgrp.on .rgh{background:var(--navy);color:#fff;border-color:var(--navy)}
.rail .rgrp.on .rgh:hover{background:var(--navy)}
.rail .rsub{display:none;padding:4px 0 8px 8px;margin:2px 0 0 13px;border-left:2px solid var(--line2)}
.rail .rgrp.on .rsub{display:block}
.rail .rsub a{display:block;padding:8px 11px;border-radius:var(--r1);font-size:13px;font-weight:600;color:var(--ink2);text-decoration:none;margin-bottom:2px;min-height:24px}
.rail .rsub a:hover{background:var(--brand-bg);color:var(--brand-tiq)}
.rail .rsub a.faol{background:var(--brand);color:#fff}
.rail .reski{display:block;margin-top:10px;padding:7px 11px;font-size:11px;color:var(--muted2);text-decoration:none;border-top:1px solid var(--line2)}
.rail .reski:hover{color:var(--brand)}
@media(max-width:900px){
  .lay2{flex-direction:column}
  .lay2 .rail{width:100%;position:static;margin-bottom:14px}
}

/* ---------- NAV3 2026-08-24: makon, olcham, signal qatori ---------- */
.layout{max-width:1520px}
.lay2 .wrap{max-width:1200px}
.sigbar{display:flex;align-items:center;gap:8px;background:var(--yuza2);border:1px solid var(--line);border-radius:var(--r1);padding:6px 12px;margin-bottom:12px;font-size:12.5px;min-height:26px}
.sigbar a{text-decoration:none;color:var(--ink2)}
.sigbar a:hover{color:var(--brand)}
.yon .yt{font-size:11.5px;letter-spacing:.9px}
nav .ntl{font-size:11.5px;letter-spacing:.9px}
th{font-size:11.5px;letter-spacing:.5px}
.tile .l{font-size:11.5px;letter-spacing:.6px}
.rail .rgh .rc{font-size:11px;opacity:.62}
.phd .crumb{font-size:11.5px}
.vaqt{font-size:12px}
@media(max-width:900px){
  .lay2 .rail{display:flex;flex-wrap:wrap;gap:5px;padding:8px}
  .lay2 .rail .rgrp{margin:0}
  .lay2 .rail .rgh{padding:7px 11px;font-size:11.5px;border:1px solid var(--line);background:var(--yuza2)}
  .lay2 .rail .rgrp.on{width:100%}
  .lay2 .rail .rgrp.on .rgh{background:var(--navy);color:#fff;border-color:var(--navy)}
  .lay2 .rail .rsub{margin:7px 0 2px;border-left:none;padding:0;flex-wrap:wrap;gap:5px}
  .lay2 .rail .rgrp.on .rsub{display:flex}
  .lay2 .rail .rsub a{margin:0;font-size:12.5px;padding:7px 11px;border:1px solid var(--line);background:var(--yuza2)}
  .lay2 .rail .rsub a.faol{background:var(--brand);color:#fff;border-color:var(--brand)}
  .lay2 .rail .reski{width:100%;border-top:none;padding:3px 2px}
}

/* ---------- NAV4 2026-08-24: amal sahifalari (narx/sharh/savol/boshqaruv) qatlami ---------- */
.frm{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.frm label{font-size:12px;color:var(--muted);display:block;margin-bottom:3px}
.frm select,.frm input{padding:10px 12px;border:1px solid var(--line);border-radius:var(--r2);font-size:15px;background:var(--yuza);font-family:inherit;color:var(--ink)}
.frm select:focus,.frm input:focus{border-color:var(--brand-line);outline:2px solid var(--brand-bg)}
.frm button{background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:var(--r1);padding:10px 22px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;min-height:24px}
.frm button:hover{background:var(--brand-tiq);border-color:var(--brand-tiq)}
.xato{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-line);border-radius:var(--r2);padding:10px 14px;margin-bottom:14px;font-size:14px;font-weight:600}
.tasdiq{background:var(--warn-bg);border:1px dashed var(--warn-line);border-radius:var(--r3);padding:16px 18px;margin-top:14px}
.tasdiq h3{font-size:15px;margin-bottom:10px;color:var(--warn)}
.tasdiq .pk{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px}
.tasdiq input[type=password]{padding:10px 12px;border:1px solid var(--warn-line);border-radius:var(--r2);font-size:15px;font-family:inherit}
.tasdiq button{background:var(--danger);color:#fff;border:1px solid var(--danger);border-radius:var(--r1);padding:10px 22px;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;min-height:24px}
.tasdiq button:hover{background:#94231b;border-color:#94231b}
.natija h3{font-size:15px;color:var(--ok);margin-bottom:10px}
.eho{display:inline-block;border-radius:999px;padding:2px 12px;font-size:12px;font-weight:800}
.eho.mos{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-line)}
.eho.notogri{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-line)}
.javob{background:var(--yuza2);border:1px solid var(--line);border-radius:var(--r2);padding:14px 16px;font-size:14.5px;white-space:pre-wrap;margin-top:12px;line-height:1.6}
.savolf textarea{width:100%;min-height:96px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r2);font-size:15px;font-family:inherit;resize:vertical;background:var(--yuza);color:var(--ink)}
.savolf textarea:focus{border-color:var(--brand-line);outline:2px solid var(--brand-bg)}
.savolf button{margin-top:10px;background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:var(--r1);padding:11px 26px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.savolf button:hover{background:var(--brand-tiq)}
.kut{color:var(--muted);font-size:12.5px;margin-top:8px}

/* ---------- NAV5 2026-08-25: bitta sahifali bolim — sarlavhasiz, sahifaning ozi ---------- */
.rail .rgrp.solo{margin-bottom:2px}
.rail .rsolo{font-size:13px;font-weight:700;letter-spacing:0;color:var(--ink2)}
.rail .rsolo:hover{background:var(--brand-bg);color:var(--brand-tiq);border-color:var(--brand-line)}
.rail .rsolo.faol{background:var(--brand);color:#fff;border-color:var(--brand)}
.rail .rsolo.faol:hover{background:var(--brand-tiq);color:#fff;border-color:var(--brand-tiq)}
@media(max-width:900px){
  .lay2 .rail .rsolo{font-size:12.5px;font-weight:700}
  .lay2 .rail .rsolo.faol{background:var(--brand);color:#fff;border-color:var(--brand)}
}

/* 2026-08-28 TEZLIK: sahifadan sahifaga otishda OQ MILTILLASHNI yoqotadi.
   Server 30 ms da javob beradi, lekin har bosishda ekran oqarib qayta chizilardi -
   ogirlik hissi asosan shundan edi. Endi silliq, qisqa otish. */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .10s; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
