/* AiROP dizayn tizimi v3: "did bilan tozalash" (docs/dizayn3.md).
   Rang = ma'no: neytral asos, aksent faqat harakat, yashil/amber/qizil faqat holat. Yorug' rejim asosiy, qorong'i rejim to'liq.
   Tashqi shrift/rasm/CDN yo'q. Eski token va sinf nomlari alias sifatida qolgan (qiymatlari yangilangan). */
:root{
  --font: ui-sans-serif, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* tipografiya shkalasi (px): 13 yordamchi (MINIMUM) / 15 asosiy / 18 bo'lim / 22 sahifa / 32 KPI / 40 hero */
  --text-xs:14px; --text-sm:16px; --text-md:18px; --text-lg:22px; --text-xl:32px; --text-hero:40px;

  /* radius va zichlik */
  --r-card:16px; --r-xl:20px; --r-lg:16px; --r-md:12px; --r-sm:8px; --r-chip:10px; --r-pill:999px;
  --pad-card:18px; --gap:16px; --pad:18px;
  --s1:8px; --s2:16px; --s3:20px; --s4:28px; --s5:40px; --s6:64px;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme: light;

  /* fon va yuzalar (neytral; dekor rang yo'q) */
  --bg:#f4f3f0; --deco-1:transparent; --deco-2:transparent;
  --card:#ffffff; --card-edge:transparent;
  --glass:var(--card); --glass-solid:#f6f5f2; --surf:#f6f5f2; --field:#ffffff;
  --mesh-1:transparent; --mesh-2:transparent; --mesh-3:transparent; --flute:transparent; --edge-hi:transparent; --edge-lo:transparent;

  /* matn: asosiy / ikkinchi / yordamchi (hammasi kartada >= 6:1) */
  --ink:#16171b; --ink-2:#464a54; --ink-3:#5b5f6b;
  --line:rgba(22,23,27,.17); --hair:rgba(22,23,27,.08); --track:rgba(22,23,27,.09);

  /* aksent: to'q sariq. FAQAT harakat va yo'nalish (tugma, faol menyu, tanlangan segment, joriy seriya, fokus). Hech qachon "yaxshi/yomon" emas */
  --accent:#f26a1b; --accent-ink:#ad3604; --accent-soft:rgba(242,106,27,.12); --accent-weak:#f6b185; --on-accent:#1b1208;
  --pill-bg:#16171b; --pill-ink:#ffffff;

  /* HOLAT: har biri uch qismli. -dot = nuqta/belgi/grafik rangi, -bg = yumshoq fon, -ink = matn (AA). Doim ikonka + so'z bilan */
  --st-good:#1b9a52;  --st-good-dot:#1b9a52;  --st-good-bg:rgba(22,163,74,.12);  --st-good-ink:#0b5e33;
  --st-warn:#b87b00;  --st-warn-dot:#b87b00;  --st-warn-bg:rgba(234,179,8,.20);   --st-warn-ink:#664400;
  --st-bad:#d63a30;   --st-bad-dot:#d63a30;   --st-bad-bg:rgba(220,38,38,.09);    --st-bad-ink:#a31d16;
  --st-na:#80848f;    --st-na-dot:#80848f;    --st-na-bg:rgba(22,23,27,.06);      --st-na-ink:#464a54;
  /* eski nomlar (sahifalar ishlatadi) */
  --good-fg:var(--st-good-ink); --good-bg:var(--st-good-bg); --good-mark:var(--st-good-dot);
  --warn-fg:var(--st-warn-ink); --warn-bg:var(--st-warn-bg); --warn-mark:var(--st-warn-dot);
  --bad-fg:var(--st-bad-ink);   --bad-bg:var(--st-bad-bg);   --bad-mark:var(--st-bad-dot);
  --info-bg:rgba(22,23,27,.06); --neutral-mark:#b4b7c0; --bar-soft:rgba(22,23,27,.12);

  /* neytral ikonka chip va ma'lumot (grafik) ranglari */
  --ichip-bg:#efeeea; --ichip-ink:#3d414b;
  --data-1:var(--accent); --data-2:#b4b7c0; --data-ink:#16171b;
  --cat-1:#4f6b8a; --cat-2:#7f93aa; --cat-3:#b3c0cf;       /* toifa kerak bo'lsa (kamdan-kam): sovuq ko'k-kulrang */
  --av-1-bg:#e3e9f1; --av-1-ink:#2d4560; --av-2-bg:#e2ebec; --av-2-ink:#2c4f56; --av-3-bg:#e9e8f0; --av-3-ink:#403e5c;

  /* pastel toifa tokenlari: QOLGAN, lekin sukut komponentlar ishlatmaydi (ma'no yo'q, holat ranglari bilan raqobatlashadi) */
  --peach-bg:#fdeadc;    --peach-chip:#fbc9a3;    --peach-ink:#8a3a0c;
  --lavender-bg:#ece8fb; --lavender-chip:#cdc4f5; --lavender-ink:#4a39a5;
  --sky-bg:#dff1fb;      --sky-chip:#b4dff5;      --sky-ink:#0a5c86;
  --mint-bg:#daf4e6;     --mint-chip:#aee6c8;     --mint-ink:#0c6840;
  --yellow-bg:#fbf1c9;   --yellow-chip:#f3dd83;   --yellow-ink:#745400;
  --pink-bg:#fbe2eb;     --pink-chip:#f5b8cd;     --pink-ink:#8f1a43;

  --shadow:0 1px 2px rgba(22,23,27,.04),0 8px 20px -14px rgba(22,23,27,.14);
  --shadow-up:0 1px 2px rgba(22,23,27,.05),0 14px 28px -14px rgba(22,23,27,.20);
  --shadow-pop:0 18px 44px -14px rgba(22,23,27,.32),0 2px 8px rgba(22,23,27,.08);
  --scrim:rgba(14,15,18,.40);
  --tip-bg:#16171b; --tip-ink:#ffffff; --tip-ink-2:#d4d6dd;
  --focus:#ad3604;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --bg:#0f1012; --card:#18191d; --card-edge:rgba(255,255,255,.06);
    --glass-solid:#202126; --surf:#202126; --field:#202126;
    --ink:#f3f4f6; --ink-2:#c5c8d0; --ink-3:#9a9ea9;
    --line:rgba(255,255,255,.18); --hair:rgba(255,255,255,.08); --track:rgba(255,255,255,.11);
    --accent:#ff7a2e; --accent-ink:#ff9f66; --accent-soft:rgba(255,122,46,.17); --accent-weak:#8c4b27; --on-accent:#1b1208;
    --pill-bg:#f3f4f6; --pill-ink:#16171b;
    --st-good:#3ecf8e; --st-good-dot:#3ecf8e; --st-good-bg:rgba(52,211,153,.14); --st-good-ink:#6ee7a8;
    --st-warn:#f0b030; --st-warn-dot:#f0b030; --st-warn-bg:rgba(251,191,36,.15); --st-warn-ink:#fbc94d;
    --st-bad:#f87171;  --st-bad-dot:#f87171;  --st-bad-bg:rgba(248,113,113,.15); --st-bad-ink:#ffa8a0;
    --st-na:#8a8e99;   --st-na-dot:#8a8e99;   --st-na-bg:rgba(255,255,255,.07);   --st-na-ink:#c5c8d0;
    --info-bg:rgba(255,255,255,.07); --neutral-mark:#5a5e6a; --bar-soft:rgba(255,255,255,.14);
    --ichip-bg:#26272d; --ichip-ink:#d7d9e0;
    --data-2:#5a5e6a; --data-ink:#f3f4f6;
    --cat-1:#7d9bbf; --cat-2:#5d7491; --cat-3:#445468;
    --av-1-bg:#26323f; --av-1-ink:#b9d0ea; --av-2-bg:#25363a; --av-2-ink:#b4d6dc; --av-3-bg:#2d2c3d; --av-3-ink:#c9c6ea;
    --peach-bg:#2d211a;    --peach-chip:#5b3822;    --peach-ink:#ffb685;
    --lavender-bg:#25223a; --lavender-chip:#3e3871; --lavender-ink:#c7bdff;
    --sky-bg:#172730;      --sky-chip:#1f4a62;      --sky-ink:#93d5f6;
    --mint-bg:#15291f;     --mint-chip:#1c5238;     --mint-ink:#84e2b1;
    --yellow-bg:#2a2613;   --yellow-chip:#5b4d10;   --yellow-ink:#f3d65f;
    --pink-bg:#2f1b24;     --pink-chip:#6a2b46;     --pink-ink:#ffa3c3;
    --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 24px -16px rgba(0,0,0,.7);
    --shadow-up:0 1px 0 rgba(255,255,255,.04) inset,0 16px 32px -16px rgba(0,0,0,.8);
    --shadow-pop:0 18px 44px -12px rgba(0,0,0,.75);
    --scrim:rgba(0,0,0,.55);
    --tip-bg:#2a2b31; --tip-ink:#f3f4f6; --tip-ink-2:#c5c8d0;
    --focus:#ff9f66;
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0f1012; --card:#18191d; --card-edge:rgba(255,255,255,.06);
  --glass-solid:#202126; --surf:#202126; --field:#202126;
  --ink:#f3f4f6; --ink-2:#c5c8d0; --ink-3:#9a9ea9;
  --line:rgba(255,255,255,.18); --hair:rgba(255,255,255,.08); --track:rgba(255,255,255,.11);
  --accent:#ff7a2e; --accent-ink:#ff9f66; --accent-soft:rgba(255,122,46,.17); --accent-weak:#8c4b27; --on-accent:#1b1208;
  --pill-bg:#f3f4f6; --pill-ink:#16171b;
  --st-good:#3ecf8e; --st-good-dot:#3ecf8e; --st-good-bg:rgba(52,211,153,.14); --st-good-ink:#6ee7a8;
  --st-warn:#f0b030; --st-warn-dot:#f0b030; --st-warn-bg:rgba(251,191,36,.15); --st-warn-ink:#fbc94d;
  --st-bad:#f87171;  --st-bad-dot:#f87171;  --st-bad-bg:rgba(248,113,113,.15); --st-bad-ink:#ffa8a0;
  --st-na:#8a8e99;   --st-na-dot:#8a8e99;   --st-na-bg:rgba(255,255,255,.07);   --st-na-ink:#c5c8d0;
  --info-bg:rgba(255,255,255,.07); --neutral-mark:#5a5e6a; --bar-soft:rgba(255,255,255,.14);
  --ichip-bg:#26272d; --ichip-ink:#d7d9e0;
  --data-2:#5a5e6a; --data-ink:#f3f4f6;
  --cat-1:#7d9bbf; --cat-2:#5d7491; --cat-3:#445468;
  --av-1-bg:#26323f; --av-1-ink:#b9d0ea; --av-2-bg:#25363a; --av-2-ink:#b4d6dc; --av-3-bg:#2d2c3d; --av-3-ink:#c9c6ea;
  --peach-bg:#2d211a;    --peach-chip:#5b3822;    --peach-ink:#ffb685;
  --lavender-bg:#25223a; --lavender-chip:#3e3871; --lavender-ink:#c7bdff;
  --sky-bg:#172730;      --sky-chip:#1f4a62;      --sky-ink:#93d5f6;
  --mint-bg:#15291f;     --mint-chip:#1c5238;     --mint-ink:#84e2b1;
  --yellow-bg:#2a2613;   --yellow-chip:#5b4d10;   --yellow-ink:#f3d65f;
  --pink-bg:#2f1b24;     --pink-chip:#6a2b46;     --pink-ink:#ffa3c3;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 24px -16px rgba(0,0,0,.7);
  --shadow-up:0 1px 0 rgba(255,255,255,.04) inset,0 16px 32px -16px rgba(0,0,0,.8);
  --shadow-pop:0 18px 44px -12px rgba(0,0,0,.75);
  --scrim:rgba(0,0,0,.55);
  --tip-bg:#2a2b31; --tip-ink:#f3f4f6; --tip-ink-2:#c5c8d0;
  --focus:#ff9f66;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--bg)}
body{margin:0;color:var(--ink);font:400 var(--text-sm)/1.5 var(--font);min-height:100vh;letter-spacing:-.003em;background:var(--bg)}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit}
.num,.tn{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:10px}
.skip{position:absolute;left:16px;top:-80px;background:var(--accent);color:var(--on-accent);padding:10px 16px;border-radius:12px;z-index:90;font-weight:650}
.skip:focus{top:12px}
.mesh{display:none}   /* eski fon elementi: endi ishlatilmaydi */
.wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:24px}

/* ---------- Karta ---------- */
.card{position:relative;background:var(--card);border-radius:var(--r-card);box-shadow:var(--shadow),inset 0 0 0 1px var(--card-edge);padding:var(--pad-card);
  animation:rise .24s var(--ease) both;animation-delay:calc(var(--i,0) * 30ms);min-width:0}
.card::before{content:none}
@keyframes rise{from{opacity:0}to{opacity:1}}
@media (hover:hover){
  .lift{transition:transform .16s var(--ease),box-shadow .16s var(--ease)}
  .lift:hover{transform:translateY(-1px);box-shadow:var(--shadow-up),inset 0 0 0 1px var(--card-edge)}
}
@media (prefers-reduced-motion: reduce){ .card{animation:none} .lift,.lift:hover{transition:none;transform:none} html{scroll-behavior:auto} *{transition-duration:.01ms!important} }

/* ---------- Eski yuqori panel (hisobot sahifasi uchun; platformada .top ishlatiladi) ---------- */
.topbar{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--hair)}
.topbar-in{display:flex;align-items:center;gap:var(--s2) var(--s3);min-height:56px;flex-wrap:wrap;padding-block:8px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:var(--text-md);letter-spacing:-.02em}
.brand svg{width:30px;height:30px;flex:none}
.meta{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--ink-2)}
.meta b{color:var(--ink);font-weight:650}
.trust{background:var(--st-good-bg);color:var(--st-good-ink)}
.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--r-pill);border:0;background:var(--card);box-shadow:var(--shadow),inset 0 0 0 1px var(--card-edge);cursor:pointer;color:var(--ink);transition:background .15s ease,transform .15s ease}
.icon-btn:hover{background:var(--accent-soft)}
.icon-btn:active{transform:scale(.96)}
.ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- Umumiy matn ---------- */
main{padding-block:var(--s4) var(--s5);display:flex;flex-direction:column;gap:var(--s5)}
h2{font-size:var(--text-md);line-height:1.3;font-weight:650;letter-spacing:-.01em}
h3{font-size:var(--text-md);line-height:1.3;font-weight:650;letter-spacing:-.01em}
h4{font-size:var(--text-sm);line-height:1.35;font-weight:650}
.sec-head{display:flex;flex-direction:column;gap:2px;margin-bottom:12px}
.sec-head p{color:var(--ink-2);font-size:var(--text-sm);max-width:64ch}
.muted{color:var(--ink-3)}
.note{font-size:var(--text-xs);line-height:1.45;color:var(--ink-3);max-width:70ch}

/* ---------- Holat (yagona tizim): .is-good | .is-warn | .is-bad | .is-na ---------- */
.is-good{--st-c:var(--st-good-dot);--st-b:var(--st-good-bg);--st-i:var(--st-good-ink)}
.is-warn{--st-c:var(--st-warn-dot);--st-b:var(--st-warn-bg);--st-i:var(--st-warn-ink)}
.is-bad{--st-c:var(--st-bad-dot);--st-b:var(--st-bad-bg);--st-i:var(--st-bad-ink)}
.is-na{--st-c:var(--st-na-dot);--st-b:var(--st-na-bg);--st-i:var(--st-na-ink)}
.stchip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 10px;border-radius:var(--r-pill);background:var(--st-b);color:var(--st-i);font-size:var(--text-xs);font-weight:650;line-height:1.2;white-space:nowrap}
.stchip .ic{width:14px;height:14px;stroke-width:2.2}
.stchip.sm{min-height:24px;padding:1px 8px}
.sdot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--st-c);flex:none}

/* ---------- Chip ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 10px;border-radius:var(--r-pill);background:var(--info-bg);color:var(--ink-2);font-size:var(--text-xs);font-weight:600;line-height:1.25}
.chip .ic{width:14px;height:14px}
.tone-good{background:var(--st-good-bg);color:var(--st-good-ink)}
.tone-bad{background:var(--st-bad-bg);color:var(--st-bad-ink)}
.tone-warn{background:var(--st-warn-bg);color:var(--st-warn-ink)}
.tone-na{background:var(--st-na-bg);color:var(--st-na-ink)}
.tone-info{background:var(--info-bg);color:var(--ink-2)}
.tone-accent{background:var(--accent-soft);color:var(--accent-ink)}
.dots{display:inline-flex;gap:3px}
.dots i{width:6px;height:6px;border-radius:50%;background:currentColor}
.dots i.off{background:transparent;box-shadow:inset 0 0 0 1.5px currentColor;opacity:.6}

/* Eski pastel toifa sinflari (.pc-*) endi NEYTRAL: sahifalarda qolgan bo'lsa ham rang bermaydi. Pastel tokenlar faqat qo'lda ishlatiladi */
.pc-peach,.pc-lavender,.pc-sky,.pc-mint,.pc-yellow,.pc-pink{--p-bg:var(--surf);--p-chip:var(--ichip-bg);--p-ink:var(--ichip-ink)}
.ichip{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:var(--r-chip);flex:none;background:var(--ichip-bg);color:var(--ichip-ink)}
.ichip .ic{width:18px;height:18px}
.ichip.sm{width:28px;height:28px;border-radius:9px}.ichip.sm .ic{width:16px;height:16px}
.avatar{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;flex:none;background:var(--av-bg,var(--ichip-bg));color:var(--av-ink,var(--ichip-ink));font-weight:650;font-size:var(--text-xs);letter-spacing:.02em;line-height:1;user-select:none}
.avatar.foto{overflow:hidden;background:var(--surf)}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.avatar.xl{width:96px;height:96px;font-size:30px}
.xodim-rejim #search,.xodim-rejim #bell,.xodim-rejim #refresh,.xodim-rejim .meta,.xodim-rejim #sideFoot{display:none!important}
.av-1{--av-bg:var(--av-1-bg);--av-ink:var(--av-1-ink)}.av-2{--av-bg:var(--av-2-bg);--av-ink:var(--av-2-ink)}.av-3{--av-bg:var(--av-3-bg);--av-ink:var(--av-3-ink)}
.avatar.sm{width:28px;height:28px}
.avatar.lg{width:48px;height:48px;font-size:var(--text-sm)}

/* O'zgarish pill (delta): rang + strelka + matn */
.delta{display:inline-flex;align-items:center;gap:3px;min-height:24px;padding:1px 9px 1px 6px;border-radius:var(--r-pill);font-size:var(--text-xs);font-weight:650;font-variant-numeric:tabular-nums;line-height:1.2;white-space:nowrap}
.delta .ic{width:14px;height:14px;stroke-width:2.2}
.delta.good{background:var(--st-good-bg);color:var(--st-good-ink)}
.delta.bad{background:var(--st-bad-bg);color:var(--st-bad-ink)}
.delta.flat{background:var(--st-na-bg);color:var(--st-na-ink)}
.delta small{font-size:var(--text-xs);font-weight:500;opacity:.9}

/* Segment (tab): tanlangan = qora pill */
.seg{display:inline-flex;padding:3px;gap:2px;border-radius:var(--r-pill);background:var(--info-bg);flex-wrap:wrap}
.chart-card .seg{align-self:flex-start}
.seg button{min-height:32px;padding:4px 14px;border:0;border-radius:var(--r-pill);background:transparent;font-size:var(--text-xs);font-weight:650;color:var(--ink-2);cursor:pointer;transition:background .15s ease,color .15s ease}
.seg button[aria-pressed="true"]{background:var(--pill-bg);color:var(--pill-ink)}
.seg button:not([aria-pressed="true"]):hover{background:var(--accent-soft);color:var(--ink)}

/* ---------- Hero / KPI (eski imzo; yangi kod U.metric ishlatadi) ---------- */
.hero{display:flex;flex-direction:column;gap:var(--s2)}
.hero h1{font-size:var(--text-lg);line-height:1.2;font-weight:700;letter-spacing:-.02em;max-width:36ch}
.hero h1 span{display:block;margin-top:6px;color:var(--ink-2);font-weight:500;font-size:var(--text-sm);line-height:1.4;letter-spacing:0;max-width:60ch}
.hero .sub{color:var(--ink-3)}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.kpi{display:flex;flex-direction:column;gap:4px}
.kpi .k-top{display:flex;align-items:center;gap:10px;min-height:32px}
.kpi .label{color:var(--ink-2);font-weight:600;font-size:var(--text-sm)}
.kpi .k-val{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap}
.kpi .val{font-size:var(--text-xl);line-height:1.1;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.kpi .sense{color:var(--ink-3);font-size:var(--text-xs);line-height:1.4}
.kpi .foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;flex-wrap:wrap}
.spark{display:block;color:var(--data-1)}

/* ---------- Katak (U.tile): neytral, pastel EMAS ---------- */
.tile{display:flex;flex-direction:column;gap:4px;padding:var(--pad-card);border-radius:var(--r-card);background:var(--card);box-shadow:var(--shadow);color:var(--ink);min-width:0;position:relative;
  animation:rise .24s var(--ease) both;animation-delay:calc(var(--i,0) * 30ms)}
.card .tile,.card.tiles-in .tile{background:var(--surf);box-shadow:none}
.tile .t-top{display:flex;align-items:center;gap:10px;min-height:32px}
.tile .t-nm{font-size:var(--text-sm);font-weight:600;color:var(--ink-2);line-height:1.3;flex:1;min-width:0}
.tile .t-val{font-size:28px;line-height:1.1;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin-top:2px}
.tile .t-sub{font-size:var(--text-xs);line-height:1.4;color:var(--ink-3)}
.tile .stchip{align-self:flex-start;margin-top:2px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:var(--gap)}

/* ---------- Halqa / progress ---------- */
.ring{display:inline-flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.ring svg{display:block;overflow:visible}
.ring .r-track{fill:none;stroke:var(--track)}
.ring .r-arc{fill:none;stroke-linecap:round;transition:stroke-dashoffset .6s var(--ease)}
.ring .r-val{font-size:var(--text-lg);font-weight:700;letter-spacing:-.02em;fill:var(--ink);font-variant-numeric:tabular-nums;dominant-baseline:central}
.ring .r-nm{font-size:var(--text-xs);font-weight:550;color:var(--ink-2);max-width:16ch;line-height:1.3}
.progress{display:flex;gap:3px;height:8px;width:100%;min-width:60px}
.progress .p-track{position:relative;flex:1;height:100%;border-radius:var(--r-pill);background:var(--track);overflow:hidden}
.progress .p-fill{display:block;height:100%;border-radius:var(--r-pill);background:var(--accent)}
.progress.good .p-fill{background:var(--st-good-dot)}
.progress.warn .p-fill{background:var(--st-warn-dot)}
.progress.bad .p-fill{background:var(--st-bad-dot)}
.progress.ink .p-fill{background:var(--ink)}
.progress.seg-mode .p-track{border-radius:3px;flex:1}
.progress.seg-mode .p-track.on{background:var(--accent)}
.progress.seg-mode.good .p-track.on{background:var(--st-good-dot)}
.progress.seg-mode.warn .p-track.on{background:var(--st-warn-dot)}
.progress.seg-mode.bad .p-track.on{background:var(--st-bad-dot)}
.progress.seg-mode.ink .p-track.on{background:var(--ink)}

/* ---------- Qarorlar ---------- */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.decision{display:flex;flex-direction:column;gap:var(--s2)}
.d-top{display:flex;align-items:center;gap:10px}
.d-num{display:grid;place-items:center;width:28px;height:28px;border-radius:var(--r-chip);background:var(--pill-bg);color:var(--pill-ink);font-weight:700;font-size:var(--text-xs)}
.decision h3{font-size:var(--text-md)}
.d-why{color:var(--ink-2)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
details>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;min-height:40px;font-weight:600;color:var(--accent-ink);border-radius:12px}
details>summary::-webkit-details-marker{display:none}
details>summary .ic{transition:transform .2s ease}
details[open]>summary .ic.chev{transform:rotate(180deg)}
.decision details{margin-top:auto;border-top:1px solid var(--hair);padding-top:4px}
dl.facts{display:grid;gap:var(--s2);padding:var(--s1) 0}
dl.facts dt{font-weight:650;color:var(--ink)}
dl.facts dd{color:var(--ink-2);margin-top:2px}
.more{margin-top:var(--s2)}
.more>summary{display:inline-flex;padding:6px 16px;background:var(--card);box-shadow:var(--shadow);border-radius:var(--r-pill);color:var(--accent-ink)}
.more-list{display:grid;gap:var(--gap);margin-top:var(--s2);grid-template-columns:repeat(2,minmax(0,1fr))}
.mini{padding:var(--s2)}
.mini h3{font-size:var(--text-sm)}
.mini .chips{margin-top:8px}

/* ---------- Grafik kartalari ---------- */
.grid2{display:grid;grid-template-columns:5fr 7fr;gap:var(--gap)}
.chart-card{display:flex;flex-direction:column;gap:12px}
.chart-card header{display:flex;flex-direction:column;gap:4px}
.chart-card header p{color:var(--ink-2)}
.chart{width:100%;min-height:40px}
.chart svg{display:block;overflow:visible;max-width:100%}
svg text{font-family:var(--font);fill:var(--ink-3)}
svg .ax{font-size:var(--text-xs);font-weight:500}
svg .ax.hl{fill:var(--ink);font-weight:700}
svg .nm{font-size:var(--text-sm);font-weight:650;fill:var(--ink)}
svg .vl{font-size:var(--text-xs);font-weight:650;fill:var(--ink)}
svg .vl-2{font-size:var(--text-xs);font-weight:550;fill:var(--ink-2)}
svg .sm{font-size:var(--text-xs);fill:var(--ink-3)}
svg .big{font-size:var(--text-sm);font-weight:700;fill:var(--ink)}
.g-hair{stroke:var(--hair);stroke-width:1}
.g-base{stroke:var(--line);stroke-width:1}
.m-line{fill:none;stroke:var(--data-1);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.m-dot{fill:var(--data-1);stroke:var(--card);stroke-width:2.5}
.m-pt{opacity:0;transition:opacity .12s ease}
.m-pt.last{opacity:1}
.pt:hover .m-pt,.pt:focus-within .m-pt{opacity:1}
.m-area{fill:url(#ar)}
.m-bar{fill:var(--data-1)}
.m-soft{fill:var(--bar-soft);transition:fill .15s ease}
.m-soft:hover,.m-soft:focus{fill:var(--accent-weak)}
.m-weak{fill:var(--accent-weak)}
.m-neutral{fill:var(--neutral-mark)}
.m-warn{fill:var(--st-warn-dot)}
.m-void{fill:none;stroke:var(--ink-3);stroke-width:1.5;stroke-dasharray:4 3}
.m-ci{stroke:var(--data-1);stroke-width:3;stroke-linecap:round;opacity:.7}
.m-ref{stroke:var(--ink-3);stroke-width:1.5;stroke-dasharray:2 4;stroke-linecap:round}
.band-na{fill:var(--info-bg)}
.tr{fill:transparent}
.hit{cursor:default;outline-offset:-2px}
.band .cross{stroke:var(--ink-3);stroke-width:1;opacity:0}
.band:hover .cross,.band:focus-within .cross{opacity:.7}
.hit:focus-visible{outline:3px solid var(--focus);border-radius:0}
.pill-info{fill:var(--info-bg)}
.pill-warn{fill:var(--st-warn-bg);stroke:var(--st-warn-dot);stroke-width:1.5}
.t-warn{fill:var(--st-warn-ink)!important;font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:var(--text-xs);color:var(--ink-2)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.sw{width:12px;height:12px;border-radius:4px;display:inline-block;flex:none}
.sw.good{background:var(--data-1)}
.sw.bad{background:var(--st-warn-dot)}
.sw.void{box-shadow:inset 0 0 0 1.5px var(--ink-3);background:transparent}
.sw.weak{background:var(--accent-weak)}
.sw.soft{background:var(--bar-soft)}
.sw.dot{border-radius:50%;background:var(--data-1);width:10px;height:10px}
.sw.ci{height:4px;width:20px;border-radius:2px;background:var(--data-1);opacity:.7}
.sw.ref{height:0;width:20px;border-top:2px dotted var(--ink-3);border-radius:0;background:none}

.hours-body{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--s4);align-items:start}
.reco{display:flex;flex-direction:column;gap:10px;padding:var(--s2);border-radius:var(--r-md);background:var(--surf)}
.reco h4{display:flex;align-items:center;gap:8px;color:var(--ink)}
.reco p{color:var(--ink-2)}

.group + .group{margin-top:var(--s3)}
.group h4{margin-bottom:4px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.group h4 span{font-weight:500;color:var(--ink-3);font-size:var(--text-xs)}
.low-n{margin-top:var(--s2);border-top:1px solid var(--hair);padding-top:var(--s1)}

.qgrid>*{min-width:0}
.qgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3);padding-top:var(--s2)}
.stat-list{display:grid;gap:var(--s2)}
.stat{display:flex;gap:14px;align-items:baseline}
.stat b{font-size:var(--text-lg);line-height:1.1;font-weight:700;letter-spacing:-.02em;min-width:4ch;font-variant-numeric:tabular-nums}
.stat span{color:var(--ink-2)}
.big-sum{font-size:var(--text-md);font-weight:650;letter-spacing:-.01em;line-height:1.35}

/* ---------- Jadval ---------- */
.tablewrap{overflow-x:auto;max-width:100%;border-radius:var(--r-md);-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:var(--text-sm);min-width:480px}
th,td{padding:10px 14px;text-align:right;white-space:nowrap;border-bottom:1px solid var(--hair);font-variant-numeric:tabular-nums}
th:first-child,td:first-child{text-align:left}
th{font-weight:600;font-size:var(--text-xs);color:var(--ink-3);background:transparent;border-bottom:1px solid var(--line);padding-block:8px}
td{color:var(--ink-2)}
tbody tr{transition:background .12s ease}
tbody tr:hover td{background:var(--info-bg)}
tbody tr:hover td:first-child{border-radius:10px 0 0 10px}
tbody tr:hover td:last-child{border-radius:0 10px 10px 0}
tr:last-child td{border-bottom:0}
.q-sum{font-size:var(--text-md);font-weight:650;letter-spacing:-.01em;color:var(--ink)}
.q-sum small{display:block;font-size:var(--text-xs);font-weight:450;color:var(--ink-3);letter-spacing:0}
.q-card>details>summary{min-height:48px}
.q-card>details>summary .ic.chev{margin-left:auto}

footer{padding-block:var(--s3) var(--s5);color:var(--ink-3);font-size:var(--text-xs)}
footer p{max-width:80ch}

/* ---------- Tooltip (U.help, grafik) ---------- */
#tip{position:fixed;left:0;top:0;z-index:95;pointer-events:none;opacity:0;transition:opacity .12s ease;max-width:260px;
  background:var(--tip-bg);color:var(--tip-ink);border-radius:10px;padding:7px 11px;font-size:var(--text-xs);line-height:1.4;
  box-shadow:0 12px 28px -10px rgba(0,0,0,.45)}
#tip.on{opacity:1}
#tip strong{display:block;font-weight:650;margin-bottom:1px}
#tip span{display:block;color:var(--tip-ink-2)}
#tip strong:only-child{font-weight:550}

/* ================= PLATFORMA QOBIG'I ================= */
.app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:12px;align-self:start;height:calc(100vh - 24px);margin:12px 0 12px 12px;display:flex;flex-direction:column;gap:6px;padding:16px 10px 10px;
  background:var(--card);border-radius:var(--r-xl);box-shadow:var(--shadow),inset 0 0 0 1px var(--card-edge);z-index:30}
.side .brand{padding:0 10px 10px}
.nav{display:flex;flex-direction:column;gap:2px;overflow:auto;flex:1;margin-inline:-4px;padding-inline:4px}
.nav-group{font-size:var(--text-xs);font-weight:600;color:var(--ink-3);padding:14px 12px 4px}
.nav a{display:flex;align-items:center;gap:10px;min-height:40px;padding:6px 12px;border-radius:var(--r-md);color:var(--ink-2);text-decoration:none;font-weight:600;font-size:var(--text-sm);transition:background .15s ease,color .15s ease}
.nav a:hover{background:var(--info-bg);color:var(--ink)}
.nav a .ic{width:20px;height:20px}
.nav a[aria-current="page"]{background:var(--accent);color:var(--on-accent)}
.nav a[aria-current="page"]:focus-visible{outline-color:var(--ink)}
.nav a .badge{margin-left:auto;font-size:var(--text-xs);font-weight:700;padding:1px 8px;border-radius:999px;background:var(--st-bad-bg);color:var(--st-bad-ink)}
.nav a[aria-current="page"] .badge{background:rgba(0,0,0,.14);color:var(--on-accent)}
.side-foot{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:14px;background:var(--surf);font-size:var(--text-xs);line-height:1.4;color:var(--ink-2)}
.side-foot b{color:var(--ink);font-size:var(--text-sm)}
.side-foot .sf-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:2px}
.main-col{min-width:0;display:flex;flex-direction:column}

/* Yuqori panel: sarlavha + qidiruv + asboblar */
.top{position:relative;z-index:20;display:flex;align-items:center;gap:10px 20px;flex-wrap:wrap;padding:20px 28px 0}
.burger{display:none}
.top-title{margin-right:auto;min-width:0;flex:1 1 320px}
.top h1{font-size:24px;line-height:1.2;font-weight:700;letter-spacing:-.02em}
.top h1.greet{font-size:var(--text-lg)}
.top-sub{margin-top:2px;color:var(--ink-2);font-size:var(--text-sm);max-width:72ch;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.top .meta{margin-top:6px;gap:6px}
.top .meta span:empty{display:none}
.top .meta span{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:var(--r-pill);background:var(--info-bg);font-size:var(--text-xs);font-weight:550;color:var(--ink-2);white-space:nowrap}
.top-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-left:auto}
.search{position:relative;width:300px;max-width:100%}
.search .s-in{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px 0 14px;border-radius:var(--r-pill);background:var(--card);box-shadow:var(--shadow),inset 0 0 0 1px var(--card-edge);color:var(--ink-3)}
.search .s-in:focus-within{box-shadow:var(--shadow),0 0 0 3px var(--accent-soft),inset 0 0 0 1.5px var(--accent)}
.search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:var(--text-sm);color:var(--ink);height:100%}
.search input::placeholder{color:var(--ink-3);opacity:1}
.search input::-webkit-search-cancel-button{display:none}
.search kbd{font:600 var(--text-xs)/1 var(--font);padding:4px 7px;border-radius:7px;background:var(--info-bg);color:var(--ink-2);flex:none}
.search .s-res{position:absolute;left:0;right:0;top:calc(100% + 8px);min-width:300px;background:var(--card);border-radius:var(--r-card);box-shadow:var(--shadow-pop),inset 0 0 0 1px var(--hair);padding:6px;z-index:40;max-height:min(70vh,420px);overflow:auto}
.s-grp{font-size:var(--text-xs);font-weight:600;color:var(--ink-3);padding:8px 10px 2px}
.s-item{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:12px;color:var(--ink);text-decoration:none;cursor:pointer}
.s-item[aria-selected="true"],.s-item:hover{background:var(--accent-soft)}
.s-item .s-t{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.s-item .s-t b{font-weight:600;font-size:var(--text-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s-item .s-t span{font-size:var(--text-xs);color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s-none{padding:12px 10px;color:var(--ink-3);font-size:var(--text-xs)}
.who{display:inline-flex;align-items:center;gap:8px;height:40px;padding:4px 14px 4px 4px;border-radius:var(--r-pill);background:var(--card);box-shadow:var(--shadow),inset 0 0 0 1px var(--card-edge);min-width:0}
.who .w-t{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.who .w-t b{font-size:var(--text-xs);font-weight:650;max-width:14ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who .w-t span{font-size:var(--text-xs);color:var(--ink-3)}

.tabs{display:flex;gap:6px;padding:4px 28px 0;max-width:1480px;width:100%;margin-inline:auto;overflow-x:auto;scrollbar-width:none}
.tabs[hidden]{display:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;display:inline-flex;align-items:center;min-height:40px;padding:6px 16px;border-radius:var(--r-pill);font-size:var(--text-sm);font-weight:650;color:var(--ink-2);text-decoration:none;white-space:nowrap;transition:background .15s ease,color .15s ease}
.tabs a:hover{background:var(--info-bg)}
.tabs a[aria-current=page]{background:var(--pill-bg);color:var(--pill-ink)}
@media (max-width:900px){.tabs{padding-inline:20px}}
@media (max-width:640px){.tabs{padding-inline:16px}}
.view{padding:16px 28px 40px;display:flex;flex-direction:column;gap:var(--s3);max-width:1480px;width:100%;margin-inline:auto}
.view>*{min-width:0}
.lead{font-size:var(--text-lg);line-height:1.3;font-weight:650;letter-spacing:-.015em;max-width:48ch}
.lead small{display:block;margin-top:4px;font-size:var(--text-sm);font-weight:450;color:var(--ink-2);letter-spacing:0;max-width:70ch;line-height:1.45}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--gap)}
.stack{display:flex;flex-direction:column;gap:12px}
.rowx{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}

/* Holat kartasi (eski imzo, U.status): neytral oq karta, holat = chip (rang + ikonka + so'z) */
.status{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit}
.status .s-top{display:flex;align-items:center;gap:10px;min-height:32px}
.status .v{font-size:var(--text-xl);font-weight:700;letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}
.status .t{font-weight:600;color:var(--ink-2);font-size:var(--text-sm)}
.status p{color:var(--ink-3);font-size:var(--text-xs);line-height:1.4}
.status .chip,.status .stchip{align-self:flex-start}

.banner{display:flex;gap:12px;align-items:flex-start;padding:14px var(--pad-card);border-radius:var(--r-card);background:var(--st-warn-bg);color:var(--ink)}
.banner .ic{color:var(--st-warn-ink);width:22px;height:22px;margin-top:1px}
.banner h2{font-size:var(--text-sm)}.banner p{color:var(--ink-2);margin-top:2px}
/* Forma elementlari: brauzerning oddiy ko'rinishi o'rniga bir xil, yumaloq, o'z chevronli (hamma sahifada; sahifa qoidalari ustun, lekin chevron va o'ng bo'sh joy saqlanadi) */
select{-webkit-appearance:none;appearance:none;min-height:40px;max-width:100%;padding:6px 14px;border-radius:var(--r-md,12px);border:1px solid var(--line);background-color:var(--field);color:var(--ink);font:inherit;font-size:var(--text-sm);font-weight:600;line-height:1.3;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8f98' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:16px!important;padding-right:38px!important;text-overflow:ellipsis}
select:hover:not(:disabled){border-color:var(--ink-3)}
select:focus,select:focus-visible{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
select:disabled{opacity:.55;cursor:default}
select option{font-weight:500;color:var(--ink);background:var(--card)}
:where(input[type=text],input[type=search],input[type=number],input[type=url],input[type=email],input[type=password],input[type=date],textarea){max-width:100%;padding:8px 14px;border-radius:var(--r-md,12px);border:1px solid var(--line);background-color:var(--field);color:var(--ink);font:inherit;font-size:var(--text-sm);transition:border-color .15s ease,box-shadow .15s ease}
:where(input[type=text],input[type=search],input[type=number],input[type=url],input[type=email],input[type=password],input[type=date]){min-height:40px}
input[type=text]:focus,input[type=search]:focus,input[type=number]:focus,input[type=url]:focus,input[type=email]:focus,input[type=password]:focus,input[type=date]:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
input::placeholder,textarea::placeholder{color:var(--ink-3);font-weight:400}
input:disabled,textarea:disabled{opacity:.55}
.field{display:flex;flex-direction:column;gap:4px;font-size:var(--text-xs);font-weight:600;color:var(--ink-2)}
.field select,.field input{min-height:40px;padding:6px 12px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--field);color:var(--ink);font:inherit;font-size:var(--text-sm);font-weight:400}
.field select:focus,.field input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:6px 16px;border-radius:999px;border:0;background:var(--info-bg);color:var(--ink);font-size:var(--text-sm);font-weight:600;cursor:pointer;text-decoration:none;transition:background .15s ease,transform .15s ease,box-shadow .15s ease}
.btn:hover{background:var(--accent-soft)}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--accent);color:var(--on-accent)}
.btn.primary:hover{background:var(--accent);box-shadow:0 8px 16px -10px var(--accent)}
.btn.dark{background:var(--pill-bg);color:var(--pill-ink)}
.btn.dark:hover{background:var(--pill-bg);box-shadow:0 8px 16px -10px rgba(0,0,0,.5)}
.btn.ghost{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.btn.ghost:hover{background:var(--info-bg)}
.btn.sm{min-height:32px;padding:3px 12px;font-size:var(--text-xs)}
.btn[disabled]{opacity:.5;cursor:default;transform:none;box-shadow:none}
.empty{padding:var(--s3);text-align:center;color:var(--ink-3)}
.skel{border-radius:var(--r-card);min-height:96px;background:linear-gradient(90deg,var(--info-bg),transparent,var(--info-bg));background-size:200% 100%;animation:sk 1.4s linear infinite}
@keyframes sk{to{background-position:-200% 0}}
.err{padding:var(--s2);border-radius:var(--r-card);background:var(--st-bad-bg);color:var(--st-bad-ink)}
.tbl a{color:var(--accent-ink);font-weight:600;text-decoration:none}.tbl a:hover{text-decoration:underline}
.tbl tr.click{cursor:pointer}.tbl tr.click:hover td{background:var(--accent-soft)}
.tbl td.l,.tbl th.l{text-align:left;white-space:normal}
.score{display:inline-block;min-width:2.8em;text-align:center;padding:1px 8px;border-radius:999px;font-weight:700;font-size:var(--text-xs);font-variant-numeric:tabular-nums}
.score.g{background:var(--st-good-bg);color:var(--st-good-ink)}.score.w{background:var(--st-warn-bg);color:var(--st-warn-ink)}.score.b{background:var(--st-bad-bg);color:var(--st-bad-ink)}.score.n{background:var(--st-na-bg);color:var(--st-na-ink)}
.pager{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.hm td,.hm th{padding:5px 6px;font-size:var(--text-xs);text-align:center;border-bottom:0}.hm td{min-width:40px;border-radius:8px;font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink)}
.hm th{color:var(--ink-2)}
.hm tbody tr:hover td{background-blend-mode:normal}
.hm th.l{text-align:left}
.scrim{display:none}

/* ---------- Yangi yadro: U.metric (yagona standart metrika kartasi) ---------- */
.metric{display:flex;flex-direction:column;gap:6px;min-width:0}
.metric .m-head{display:flex;align-items:center;gap:8px;min-height:22px}
.metric .m-label{flex:1;min-width:0;font-size:var(--text-sm);font-weight:600;color:var(--ink-2);line-height:1.3;text-decoration:none}
.metric .m-body{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 8px}
.metric .m-val{font-size:var(--text-xl);line-height:1.1;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.metric .m-unit{font-size:var(--text-sm);font-weight:600;color:var(--ink-3)}
.metric .m-body .delta{align-self:center}
.metric .m-foot{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;min-height:28px}
.metric .m-hint{order:3;flex:1 1 100%;font-size:var(--text-xs);color:var(--ink-3);line-height:1.4;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.metric .m-spark{margin-left:auto;line-height:0}
.metric.m-hero{padding:20px}
.metric.m-hero .m-val{font-size:var(--text-hero)}
.metric.m-sm{padding:12px 14px;gap:2px}
.metric.m-sm .m-label{font-size:var(--text-xs);font-weight:600}
.metric.m-sm .m-val{font-size:var(--text-lg)}
.metric.m-sm .m-unit{font-size:var(--text-xs)}
.metric.m-sm .m-foot{min-height:24px}
.metric.is-click{cursor:pointer;transition:box-shadow .16s var(--ease)}
.metric.is-click:hover{box-shadow:var(--shadow-up),inset 0 0 0 1px var(--card-edge)}
.metric .m-link::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:1}
.metric .m-link:hover{color:var(--ink)}
.metric .m-link:focus-visible{outline:0}
.metric .m-link:focus-visible::after{outline:3px solid var(--focus);outline-offset:2px}
.metric .info-btn{position:relative;z-index:2}

/* ---------- Yangi yadro: U.info (ⓘ -> popover | drawer | mobil sheet) ---------- */
.info-btn{display:inline-grid;place-items:center;width:32px;height:32px;margin:-5px -7px -5px 0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--ink-3);cursor:pointer;flex:none;transition:background .12s ease,color .12s ease}
.info-btn .ic{width:18px;height:18px}
.info-btn:hover{background:var(--info-bg);color:var(--ink)}
.info-btn[aria-expanded="true"]{background:var(--accent-soft);color:var(--accent-ink)}
.ip-scrim{position:fixed;inset:0;z-index:80;background:transparent}
.ip-scrim.dim{background:var(--scrim)}
.ipop{position:fixed;z-index:81;display:flex;flex-direction:column;background:var(--card);color:var(--ink);border-radius:var(--r-card);box-shadow:var(--shadow-pop),inset 0 0 0 1px var(--hair);
  width:min(340px,calc(100vw - 24px));max-height:min(72vh,520px);outline:0;animation:ipin .14s var(--ease) both}
.ipop.drawer{inset:12px 12px 12px auto;width:min(400px,calc(100vw - 24px));max-height:none;border-radius:var(--r-xl);animation:ipdr .2s var(--ease) both}
.ipop.sheet{inset:auto 0 0 0;width:auto;max-height:84vh;border-radius:var(--r-xl) var(--r-xl) 0 0;animation:ipup .22s var(--ease) both}
.ipop.sheet::before{content:"";align-self:center;width:36px;height:4px;border-radius:2px;background:var(--line);margin-top:8px;flex:none}
@keyframes ipin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes ipdr{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
@keyframes ipup{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.ip-head{display:flex;align-items:flex-start;gap:8px;padding:14px 12px 4px 18px}
.ip-head h3{flex:1;min-width:0;font-size:var(--text-md);padding-top:2px}
.ip-x{display:inline-grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:var(--info-bg);color:var(--ink-2);cursor:pointer;flex:none}
.ip-x:hover{background:var(--accent-soft);color:var(--ink)}
.ip-x .ic{width:16px;height:16px}
.ip-body{display:flex;flex-direction:column;gap:12px;padding:6px 18px 18px;overflow:auto;overscroll-behavior:contain}
.ipop.sheet .ip-body{padding-bottom:calc(18px + env(safe-area-inset-bottom))}
.ip-text{color:var(--ink-2);font-size:var(--text-sm);line-height:1.5}
.ip-rows{display:flex;flex-direction:column;gap:10px}
.ip-row dt{font-size:var(--text-xs);font-weight:600;color:var(--ink-3);line-height:1.3}
.ip-row dd{font-size:var(--text-sm);color:var(--ink);margin-top:1px;line-height:1.45}
.ip-lim{display:flex;flex-direction:column;gap:6px}
.ip-lim div{display:flex;align-items:center;gap:10px;font-size:var(--text-sm);color:var(--ink)}
.ip-lim .stchip{min-width:92px;justify-content:flex-start}
.ip-note{font-size:var(--text-xs);color:var(--ink-3);line-height:1.45}
body.ip-lock{overflow:hidden}

/* ---------- Yangi yadro: U.help (qisqa tooltip tugmasi) ---------- */
.help{display:inline-grid;place-items:center;width:24px;height:24px;margin:-4px 0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--ink-3);cursor:help;vertical-align:middle;flex:none}
.help .ic{width:15px;height:15px}
.help:hover{color:var(--ink);background:var(--info-bg)}

@media (max-width:1080px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid3{grid-template-columns:minmax(0,1fr)}
  .grid2{grid-template-columns:minmax(0,1fr)}
  .hours-body{grid-template-columns:minmax(0,1fr)}
  .more-list{grid-template-columns:minmax(0,1fr)}
  .qgrid{grid-template-columns:minmax(0,1fr)}
  .app{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;inset:0 auto 0 0;top:0;height:100vh;margin:0;width:280px;max-width:86vw;border-radius:0 var(--r-xl) var(--r-xl) 0;transform:translateX(-104%);transition:transform .22s var(--ease);box-shadow:var(--shadow-pop);visibility:hidden}
  body.nav-open .side{transform:none;visibility:visible}
  body.nav-open .scrim{display:block;position:fixed;inset:0;background:var(--scrim);z-index:25}
  .burger{display:inline-grid;order:-1}
  .top{padding:16px 20px 0}
  .top-tools{order:5;flex:1 1 100%}
  .search{flex:1 1 auto;width:auto}
  .view{padding:16px 20px 36px}
}
@media (max-width:760px){
  .top{gap:10px 8px}
  .top-tools{display:contents}
  .burger{order:0;margin-right:auto}
  #refresh{order:1}
  #theme{order:2}
  .who{order:3}
  .top-title{order:4;flex:1 1 100%;margin-right:0}
  .top-sub{-webkit-line-clamp:2}
  .search{order:5;width:100%;flex:1 1 100%}
}
@media (max-width:640px){
  .wrap{padding-inline:16px}
  main{gap:32px;padding-block:20px 32px}
  .kpis{grid-template-columns:minmax(0,1fr)}
  .topbar{position:static}
  .topbar-in{gap:8px 16px}
  .top{padding:14px 16px 0;gap:10px 8px}
  .top h1{font-size:var(--text-lg)}
  .view{padding:14px 16px 36px}
  .who{padding:4px}
  .who .w-t{display:none}
  .seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;width:100%;border-radius:16px}
  .seg button{min-height:36px;padding:4px 8px;white-space:nowrap;text-align:center}
  .tablewrap{margin-inline:-4px}
  .btn{min-height:40px}
}
@media (prefers-reduced-motion:reduce){.side{transition:none}.skel{animation:none}.ring .r-arc{transition:none}.ipop{animation:none}}
@media print{ .card{background:#fff;box-shadow:none;border:1px solid #ccc} body{background:#fff} }

[hidden]{display:none!important}

/* =====================================================================================================================
   PREMIUM SHISHA QATLAMI: shaffof (glass) yuzalar, yumshoq nur va chuqurlik. Faqat ko'rinish: tuzilma va ma'lumot o'zgarmaydi.
   Qoida: karta/tile/varaq/yon panel = shisha (blur + nozik yorug' chekka); popover/yopishqoq panel = zich (o'qilishi uchun).
   ===================================================================================================================== */
:root{
  --card-solid:#ffffff;
  --card:rgba(255,255,255,.46); --card-edge:rgba(255,255,255,.80);
  --surf:rgba(255,255,255,.46); --field:rgba(255,255,255,.66);
  --glass-hi:inset 0 1px 0 rgba(255,255,255,.85), inset 0 0 0 1px rgba(255,255,255,.55);
  --glass-blur:blur(24px) saturate(1.7);
  --shadow:0 1px 1px rgba(22,23,27,.03),0 10px 30px -14px rgba(40,44,60,.20);
  --shadow-up:0 1px 1px rgba(22,23,27,.04),0 20px 44px -16px rgba(40,44,60,.30);
  --amb-1:rgba(255,138,64,.38); --amb-2:rgba(92,132,255,.30); --amb-3:rgba(150,100,255,.24);
  --acc-grad:linear-gradient(135deg,#ff8a3d 0%,#f26a1b 55%,#e2520a 100%);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --card-solid:#1a1c22;
    --card:rgba(30,33,41,.42); --card-edge:rgba(255,255,255,.13);
    --surf:rgba(255,255,255,.055); --field:rgba(255,255,255,.07);
    --glass-hi:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(255,255,255,.07);
    --shadow:0 1px 1px rgba(0,0,0,.25),0 14px 36px -16px rgba(0,0,0,.65);
    --shadow-up:0 1px 1px rgba(0,0,0,.3),0 24px 52px -18px rgba(0,0,0,.75);
    --amb-1:rgba(255,122,46,.36); --amb-2:rgba(70,110,255,.34); --amb-3:rgba(150,90,255,.26);
  }
}
:root[data-theme="dark"]{
  --card-solid:#1a1c22;
  --card:rgba(30,33,41,.42); --card-edge:rgba(255,255,255,.13);
  --surf:rgba(255,255,255,.055); --field:rgba(255,255,255,.07);
  --glass-hi:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(255,255,255,.07);
  --shadow:0 1px 1px rgba(0,0,0,.25),0 14px 36px -16px rgba(0,0,0,.65);
  --shadow-up:0 1px 1px rgba(0,0,0,.3),0 24px 52px -18px rgba(0,0,0,.75);
  --amb-1:rgba(255,122,46,.36); --amb-2:rgba(70,110,255,.34); --amb-3:rgba(150,90,255,.26);
}
/* Fon: shisha ortida ko'rinadigan yumshoq yoritilgan sirt */
body{background:transparent}       /* html fonni beradi; body shaffof bo'lmasa ambient qatlam body fonining ORQASIDA qolib ko'rinmaydi */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(760px 520px at 6% 4%,var(--amb-1),transparent 62%),radial-gradient(700px 520px at 96% 14%,var(--amb-2),transparent 64%),radial-gradient(820px 620px at 50% 108%,var(--amb-3),transparent 62%),radial-gradient(520px 380px at 78% 62%,var(--amb-1),transparent 66%)}
/* Shisha yuzalar */
body .card,body .tile,body .side,body .bh-k6,body .xl-cd,body .bh-hero,body .th-chk,body .ul-card,body .k-karta{
  background:var(--card);border:1px solid var(--card-edge);box-shadow:var(--glass-hi),var(--shadow);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
body .card .card,body .card .tile,body .tile .tile,body .card.tiles-in .tile{background:var(--surf);border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
body .card::before{content:none}
@media (hover:hover){
  body .tile.lift:hover,body a.xl-cd:hover,body a.bh-k6:hover{box-shadow:var(--glass-hi),var(--shadow-up);border-color:rgba(255,255,255,.28)}
}
/* Yon panel va yuqori panel */
body .side{border-radius:var(--r-xl);box-shadow:var(--glass-hi),var(--shadow-up)}
body .nav a[aria-current=page]{background:var(--accent-soft);color:var(--accent-ink);box-shadow:inset 0 0 0 1px rgba(242,106,27,.22)}
/* Bo'lim ichidagi varaqlar (tabs): shisha kapsula */
body .tabs{gap:4px;padding:6px;margin:10px 28px 0;width:fit-content;max-width:calc(100% - 56px);border-radius:var(--r-pill);background:var(--card);border:1px solid var(--card-edge);box-shadow:var(--glass-hi),var(--shadow);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
body .tabs a{min-height:38px;padding:6px 18px;color:var(--ink-2)}
body .tabs a:hover{background:rgba(255,255,255,.35);color:var(--ink)}
body .tabs a[aria-current=page]{background:var(--acc-grad);color:#fff;box-shadow:0 6px 16px -6px rgba(242,106,27,.65),inset 0 1px 0 rgba(255,255,255,.35)}
@media (max-width:900px){body .tabs{margin-inline:20px;max-width:calc(100% - 40px)}}
@media (max-width:640px){body .tabs{margin-inline:16px;max-width:calc(100% - 32px)}}
/* Tugmalar va maydonlar */
body .btn.primary{background:var(--acc-grad);color:#fff;box-shadow:0 8px 20px -8px rgba(242,106,27,.7),inset 0 1px 0 rgba(255,255,255,.35);border:0}
body .btn.primary:hover{filter:brightness(1.06);box-shadow:0 12px 26px -8px rgba(242,106,27,.8),inset 0 1px 0 rgba(255,255,255,.4)}
body .btn.ghost,body .btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
body .btn.ghost{background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px var(--line)}
body select,body :where(input[type=text],input[type=search],input[type=number],input[type=url],input[type=email],input[type=password],input[type=date],textarea){background-color:var(--field);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
/* Premium tafsilotlar */
body .bh-hero{background:linear-gradient(135deg,var(--card),var(--card)),var(--card);position:relative;overflow:hidden}
body .bh-hero::after{content:"";position:absolute;inset:-40% -10% auto auto;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(248,113,113,.22),transparent 65%);pointer-events:none}
body .bh-hero.ok::after{background:radial-gradient(circle,rgba(62,207,142,.20),transparent 65%)}
body .bh-hero .bh-num{background:linear-gradient(180deg,currentColor,color-mix(in srgb,currentColor 70%,transparent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body .bh-k6{border-top:0;position:relative;overflow:hidden}
body .bh-k6::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--line)}
body .bh-k6.yaxshi::before{background:linear-gradient(90deg,var(--st-good-dot),transparent)}
body .bh-k6.diqqat::before{background:linear-gradient(90deg,var(--st-warn-dot),transparent)}
body .bh-k6.yomon::before{background:linear-gradient(90deg,var(--st-bad-dot),transparent)}
body h1,body h2{letter-spacing:-.022em}
::selection{background:rgba(242,106,27,.30)}
*{scrollbar-width:thin;scrollbar-color:rgba(128,132,143,.45) transparent}
/* Zich yuzalar: popover, qidiruv natijalari, yopishqoq panellar (o'qilishi uchun shisha emas) */
body .bell-panel,body .ipop,body .s-res,body #tip{background:var(--card-solid);-webkit-backdrop-filter:none;backdrop-filter:none}
body .ul-foot{background:linear-gradient(to top,var(--card-solid) 78%,transparent);-webkit-backdrop-filter:none;backdrop-filter:none;border:0;box-shadow:none}
body .th-chk{background:var(--surf);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border:0}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :root{--card:rgba(255,255,255,.92)}
}
@media (prefers-reduced-transparency:reduce){:root{--card:var(--card-solid)}}
@media (prefers-reduced-motion:reduce){body .bh-k6,body .xl-cd{transition:none}}

/* Soddalashtirish: yig'ilgan bloklar (akkordeon) */
body details.yig{border-radius:var(--r-card);background:var(--card);border:1px solid var(--card-edge);box-shadow:var(--glass-hi),var(--shadow);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);padding:0 20px}
body details.yig>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;font-size:var(--text-md);font-weight:650;color:var(--ink)}
body details.yig>summary::-webkit-details-marker{display:none}
body details.yig>summary::after{content:"";width:10px;height:10px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg) translateY(-3px);transition:transform .2s var(--ease);flex:none}
body details.yig[open]>summary::after{transform:rotate(-135deg) translateY(-3px)}
body details.yig[open]>summary{border-bottom:1px solid var(--hair);margin-bottom:16px}
body details.yig>*:not(summary){margin-bottom:20px}
body details.yig>.card,body details.yig>.tile{box-shadow:none;background:transparent;border:0;padding-left:0;padding-right:0;-webkit-backdrop-filter:none;backdrop-filter:none}