/* ---------- footer ---------- */
  /* qora tasma (Ustoz 20.10) — data-fx-scheme="dark": tokenlar oʻzi qorongʻi */
  .ld-foot { padding-block: var(--fx-space-12) var(--fx-space-8); background: var(--fx-bg-page); color: var(--fx-text-primary); }
  .ld-foot .ld-brand { padding: 0; background: transparent; box-shadow: none; }
  .ld-foot__in { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr)); gap: var(--fx-space-8); }
  @media (max-width: 1199.98px) { .ld-foot__in { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ld-foot__in > .ld-foot__brand { grid-column: 1 / -1; } }
  @media (max-width: 839.98px) { .ld-foot__in { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ld-foot__brand { grid-column: 1 / -1; } }
  .ld-foot__brand p { max-inline-size: 36ch; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .ld-foot nav { display: grid; gap: var(--fx-space-2); align-content: start; font-size: var(--fx-font-size-sm); }
  .ld-foot nav b { margin-block-end: var(--fx-space-1); color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); text-transform: uppercase; letter-spacing: 0.06em; }
  .ld-foot nav a { color: var(--fx-text-secondary); text-decoration: none; }
  .ld-foot nav a:hover { color: var(--fx-text-primary); }
  .ld-foot__low { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--fx-space-3); margin-block-start: var(--fx-space-10); color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
/* foxui.dev bosh sahifasi — sotuvchi landing («B · Galereya», Ustoz 18.10). Faqat tokenlar; harakat prefers-reduced-motion va
   data-fx-motion="none"da oʻchadi. Komponentlar — FoxUI'niki; bu fayl faqat sahna, toʻr, fon va harakatni yozadi. */
@layer fx.utilities {
  .ld { margin: 0; background: var(--fx-bg-page); color: var(--fx-text-primary); overflow-x: clip; }
  .ld a:not(.fx-btn) { color: inherit; }
  .ld-wrap { box-sizing: border-box; inline-size: 100%; max-inline-size: calc(var(--fx-space-12) * 26); margin-inline: auto; padding-inline: max(var(--fx-space-4), env(safe-area-inset-left, 0px)); }
  .ld-kicker { margin: 0; color: var(--fx-text-brand); font-size: var(--fx-font-size-sm); font-weight: var(--fx-font-weight-semibold); letter-spacing: 0.06em; text-transform: uppercase; }
  .ld-h2 { margin: var(--fx-space-2) 0 0; max-inline-size: 22ch; font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(var(--fx-font-size-display-sm), 4vw, calc(var(--fx-font-size-display-md) * 1.4)); font-weight: var(--fx-font-weight-semibold); line-height: 1.05; letter-spacing: -0.025em; text-wrap: balance; }
  .ld-sub { margin: var(--fx-space-4) 0 0; max-inline-size: 62ch; color: var(--fx-text-secondary); font-size: var(--fx-font-size-lg); line-height: 1.55; }
  .ld-sec { padding-block: calc(var(--fx-space-12) * 2); }
  .ld-sec--tint { background: linear-gradient(180deg, transparent, var(--fx-bg-category-purple-subtle) 20%, var(--fx-bg-category-blue-subtle) 80%, transparent); }
  .ld-mini { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); font-weight: var(--fx-font-weight-medium); }
  .ld-cta { display: flex; flex-wrap: wrap; gap: var(--fx-space-3); margin-block-start: var(--fx-space-8); }
  .ld-cta .fx-btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); fill: currentColor; }

  /* ---------- sarlavha: shisha, scroll bilan chegarasi chiqadi ---------- */
  .ld-head { position: sticky; inset-block-start: 0; z-index: 40; border-block-end: var(--fx-border-width-default) solid transparent; background: color-mix(in oklab, var(--fx-bg-page) 72%, transparent); backdrop-filter: blur(var(--fx-space-4)) saturate(1.4); transition: border-color var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-head[data-scrolled] { border-block-end-color: var(--fx-border-color-default); }
  .ld-head__in { display: flex; align-items: center; gap: var(--fx-space-6); min-block-size: var(--fx-size-topbar); }
  .ld-brand { display: inline-flex; align-items: center; gap: var(--fx-space-2); text-decoration: none; font-size: var(--fx-font-size-lg); }
  .ld-brand > svg { inline-size: var(--fx-space-6); block-size: var(--fx-space-6); }
  .ld-nav { display: flex; gap: var(--fx-space-1); margin-inline-start: auto; }
  .ld-nav a { white-space: nowrap; padding: var(--fx-space-2) var(--fx-space-3); border-radius: var(--fx-radius-control); color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); font-weight: var(--fx-font-weight-medium); text-decoration: none; transition: color var(--fx-motion-fast) var(--fx-ease-standard), background-color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-nav a:hover { color: var(--fx-text-primary); background: var(--fx-bg-muted); }
  .ld-head__cta { display: flex; align-items: center; gap: var(--fx-space-2); }
  @media (max-width: 839.98px) { .ld-search .ds-top__label { display: none; } }
  @media (max-width: 1199.98px) { .ld-nav { display: none; } .ld-head__cta { margin-inline-start: auto; } }
  @media (max-width: 599.98px) { .ld-head__cta .fx-btn[data-variant="ghost"], .ld-brand .fx-badge { display: none; } }
  /* «Tizimga kirish» — telefonda ham koʻrinadi (Ustoz 19.10: ichkariga kirish yoʻli topilmayotgan edi), torda faqat ikon */
  @media (max-width: 599.98px) { .ld-enter > span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } }

  /* telefonda sarlavhadagi ikonli tugmalar fonsiz (Ustoz 20.10) — hujjat sayti bilan bir xil */
  @media (max-width: 839.98px) { .ld-head .fx-btn:not([data-variant]) { background: transparent; border-color: transparent; box-shadow: none; } .ld-head .fx-btn:not([data-variant]):hover { background: var(--fx-bg-muted); } }
  /* ---------- hero ---------- */
  .ld-hero { position: relative; isolation: isolate; padding-block: calc(var(--fx-space-12) * 1.5) calc(var(--fx-space-12) * 2); overflow: clip; }
  .ld-hero__bg { position: absolute; inset: 0; z-index: -1; pointer-events: none;
 }
  .ld-hero__bg i { position: absolute; inline-size: 42vw; aspect-ratio: 1; border-radius: var(--fx-radius-circle); filter: blur(calc(var(--fx-space-12) * 1.6)); opacity: 0.55; animation: ld-drift calc(var(--fx-duration-pulse) * 12) var(--fx-ease-standard) infinite alternate; }
  .ld-hero__bg i:nth-child(1) { inset-block-start: -12%; inset-inline-end: -6%; background: var(--fx-bg-brand-solid); opacity: 0.4; }
  .ld-hero__bg i { transition: background-color var(--fx-motion-slow) var(--fx-ease-standard); }
  /* dogʻlar libos rangidan (Ustoz 21.10: «libos tanlanganda hero rangi ham oʻzgarsin») */
  .ld-hero__bg i:nth-child(2) { inset-block-start: 30%; inset-inline-start: -14%; background: color-mix(in oklab, var(--fx-bg-brand-solid) 45%, var(--fx-bg-category-pink)); animation-delay: calc(var(--fx-duration-pulse) * -4); }
  .ld-hero__bg i:nth-child(3) { inset-block-end: -20%; inset-inline-end: 22%; background: color-mix(in oklab, var(--fx-bg-brand-solid) 35%, var(--fx-bg-category-blue)); animation-delay: calc(var(--fx-duration-pulse) * -8); }
  @keyframes ld-drift { to { translate: 6vw 4vh; scale: 1.15; } }
  .ld-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: var(--fx-space-12); align-items: center; }
  @media (max-width: 1199.98px) { .ld-hero__grid { grid-template-columns: minmax(0, 1fr); } }
  .ld-pill { display: inline-flex; align-items: center; gap: var(--fx-space-2); max-inline-size: 100%; padding: var(--fx-space-1) var(--fx-space-3) var(--fx-space-1) var(--fx-space-2); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-badge); background: color-mix(in oklab, var(--fx-bg-surface) 80%, transparent); color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); text-decoration: none; box-shadow: var(--fx-shadow-sm); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .ld-pill:hover { color: var(--fx-text-primary); }
  .ld-pill__dot { flex: none; inline-size: var(--fx-size-status-dot-sm); block-size: var(--fx-size-status-dot-sm); border-radius: var(--fx-radius-circle); background: var(--fx-fg-success); outline: var(--fx-border-width-focus) solid var(--fx-fg-success); outline-offset: 0; animation: ld-ping var(--fx-duration-pulse) var(--fx-ease-standard) infinite; }
  @keyframes ld-ping { 70%, 100% { outline-offset: var(--fx-space-1); outline-color: transparent; } }
  .ld-h1 { margin: var(--fx-space-6) 0 0; font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(calc(var(--fx-font-size-display-md) * 1.05), 5vw, calc(var(--fx-font-size-display-md) * 1.85)); font-weight: var(--fx-font-weight-semibold); line-height: 1.04; letter-spacing: -0.035em; }
  /* aylanuvchi soʻz: toʻrt ibora navbat bilan pastdan chiqadi; gradient brend → pushti */
  .ld-rot { display: inline-grid; vertical-align: bottom; overflow: hidden; padding-block-end: 0.08em; white-space: nowrap; }
  .ld-rot > span { grid-area: 1 / 1; background: linear-gradient(90deg, var(--fx-text-brand), color-mix(in oklch, var(--fx-text-brand) 40%, var(--fx-fg-error))); background-clip: text; color: transparent; opacity: 0; translate: 0 100%; animation: ld-rot calc(var(--fx-duration-pulse) * 6) var(--fx-ease-emphasized) calc(var(--fx-duration-pulse) * -0.3) infinite; }
  .ld-rot > span:nth-child(2) { animation-delay: calc(var(--fx-duration-pulse) * 1.2); }
  .ld-rot > span:nth-child(3) { animation-delay: calc(var(--fx-duration-pulse) * 2.7); }
  .ld-rot > span:nth-child(4) { animation-delay: calc(var(--fx-duration-pulse) * 4.2); }
  /* soʻzlar ustma-ust almashadi (25–29%), satr hech qachon boʻsh qolmaydi; birinchisi darhol koʻrinadi (manfiy kechikish) */
  @keyframes ld-rot { 0% { opacity: 0; translate: 0 100%; } 4%, 25% { opacity: 1; translate: 0 0; } 29%, 100% { opacity: 0; translate: 0 -100%; } }
  .ld-lead { margin: var(--fx-space-6) 0 0; max-inline-size: 56ch; color: var(--fx-text-secondary); font-size: var(--fx-font-size-lg); line-height: 1.6; }
  .ld-try { display: grid; gap: var(--fx-space-3); margin-block-start: var(--fx-space-8); padding: var(--fx-space-4); border: 0; /* punktir ramka yoʻq — shisha fon oʻzi ajratadi (Ustoz 21.10) */ border-radius: var(--fx-radius-surface); background: color-mix(in oklab, var(--fx-bg-surface) 60%, transparent); }
  .ld-try__label { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .ld-sws { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  .ld-sw { display: grid; inline-size: var(--fx-size-avatar-md); block-size: var(--fx-size-avatar-md); padding: 0; border: 0; border-radius: var(--fx-radius-circle); background: none; cursor: pointer; }
  .ld-sw > i { border-radius: inherit; outline: var(--fx-border-width-default) solid var(--fx-border-color-default); outline-offset: calc(var(--fx-border-width-focus) * 1.5); transition: scale var(--fx-motion-fast) var(--fx-ease-standard), outline-color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-sw:hover > i { scale: 1.1; }
  .ld-sw[aria-pressed="true"] > i { outline: var(--fx-border-width-focus) solid var(--fx-text-primary); }
  .ld-sw:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-space-1); }
  .ld-chips { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  /* libos tanlovi (Ustoz 19.10): har chipda oʻz rangi va shaklidagi kichik namuna */
  .ld-libs { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  .ld-lib { display: inline-flex; align-items: center; gap: var(--fx-space-2); padding: var(--fx-space-1) var(--fx-space-3) var(--fx-space-1) var(--fx-space-1); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-tag); background: var(--fx-bg-surface); color: var(--fx-text-primary); font: inherit; font-size: var(--fx-font-size-sm); cursor: pointer; transition: border-color var(--fx-motion-fast) var(--fx-ease-standard), background-color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-lib:hover { border-color: var(--fx-border-color-strong); }
  /* tanlangan libos — chegarasi oʻsha libos rangida (sahifa shu libosni kiygan: brend tokeni = libos rangi; Ustoz 21.10) */
  .ld-lib[aria-pressed="true"] { border-color: var(--fx-bg-brand-solid); outline: var(--fx-border-width-default) solid var(--fx-bg-brand-solid); outline-offset: calc(var(--fx-border-width-default) * -2); color: var(--fx-text-brand); }
  .ld-lib:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-default); }
  /* libos belgisi — «Sozlamalar»dagi ikonlar, lekin bir rangda (Ustoz 21.10: «rangli boʻlib archabayram boʻlib ketmasin») */
  .ld-lib__ic { display: grid; place-items: center; inline-size: var(--fx-space-6); block-size: var(--fx-space-6); color: var(--fx-text-secondary); }
  .ld-lib__ic > svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .ld-lib:hover .ld-lib__ic { color: var(--fx-text-primary); }
  .ld-lib[aria-pressed="true"] .ld-lib__ic { color: var(--fx-text-brand); }
  .ld-try__sub { align-self: center; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  /* libos koʻrgazmasi (Ustoz 20.10, heroui.pro kabi): sahna liboslarni oʻzi almashtiradi — koʻrsatilayotgan tugma ostida vaqt chizigʻi */
  .ld-lib { position: relative; overflow: hidden; }
  .ld-lib__bar { position: absolute; inset: auto 0 0 0; block-size: calc(var(--fx-border-width-default) * 2); background: var(--fx-bg-brand-solid); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
  .ld-lib[data-preview] { border-color: var(--fx-border-color-strong); }
  .ld-lib[data-preview] .ld-lib__bar { animation: ld-lib-bar var(--ld-dur, 4.5s) linear forwards; }
  [data-ld-libs][data-paused] .ld-lib__bar { animation-play-state: paused; }
  @keyframes ld-lib-bar { to { transform: scaleX(1); } }
  .ld-stage__tag { position: absolute; inset-block-end: 3%; inset-inline-end: 0; z-index: 3; display: inline-flex; align-items: center; gap: var(--fx-space-2); padding: var(--fx-space-1) var(--fx-space-3); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-tag); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-sm); color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); transition: opacity var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-stage__tag:empty { opacity: 0; }
  /* sahna orqasidagi nur — libos rangida (mavzu almashsa, nur ham almashadi) */
  .ld-stage::before { content: ""; position: absolute; inset: 8% 6%; z-index: 0; border-radius: var(--fx-radius-circle); background: radial-gradient(closest-side, color-mix(in oklab, var(--fx-bg-brand-solid) 28%, transparent), transparent); filter: blur(var(--fx-space-10)); pointer-events: none; transition: opacity var(--fx-motion-slow) var(--fx-ease-standard); }
  .ld-f4__acts { display: flex; gap: var(--fx-space-2); }
  .ld-f4__acts .fx-btn:first-child { flex: 1; }
  .ld-stage__tag::before { content: ""; inline-size: var(--fx-space-2); aspect-ratio: 1; border-radius: var(--fx-radius-circle); background: var(--fx-bg-brand-solid); }
  .ld-stage__tag b { color: var(--fx-text-primary); font-weight: var(--fx-font-weight-semibold); }
  /* libos almashganda kartalar yumshoq oʻtadi */
  .ld-stage .ld-card, .ld-stage .fx-btn, .ld-stage .fx-segment, .ld-stage .fx-segment__item, .ld-stage .fx-badge, .ld-stage .fx-avatar, .ld-stage .fx-check__box { transition-property: transform, background-color, border-color, border-radius, color, box-shadow; transition-duration: var(--fx-motion-slow); transition-timing-function: var(--fx-ease-standard); }
  .ld-chips .fx-chip[aria-pressed="true"] { background: var(--fx-bg-brand-solid); color: var(--fx-text-on-brand); }

  /* sahna: jonli komponentlar kollaji, kursor bilan parallaks (--mx/--my, site.js) */
  .ld-stage { --mx: 0; --my: 0; position: relative; min-block-size: calc(var(--fx-space-12) * 11.5); perspective: calc(var(--fx-space-12) * 30); }
  .ld-card { position: absolute; box-sizing: border-box; display: grid; gap: var(--fx-space-2); padding: var(--fx-space-4); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: color-mix(in oklab, var(--fx-bg-surface) 92%, transparent); box-shadow: var(--fx-shadow-lg); backdrop-filter: blur(var(--fx-space-3)); transform: translate3d(calc(var(--mx) * var(--d, 1) * var(--fx-space-4)), calc(var(--my) * var(--d, 1) * var(--fx-space-4)), 0) rotateX(calc(var(--my) * -4deg)) rotateY(calc(var(--mx) * 5deg)); transition: transform var(--fx-motion-slow) var(--fx-ease-standard); animation: ld-float calc(var(--fx-duration-pulse) * 4) var(--fx-ease-standard) infinite alternate; }
  @keyframes ld-float { to { translate: 0 calc(var(--fx-space-2) * -1.5); } }
  .ld-card .fx-stat { padding: 0; border: 0; background: none; box-shadow: none; }
  .ld-f1 { --d: 1.4; inset-block-start: 0; inset-inline-start: 0; inline-size: 46%; }
  .ld-f2 { --d: 0.8; inset-block-start: 3%; inset-inline-end: 0; inline-size: 48%; animation-delay: calc(var(--fx-duration-pulse) * -1); }
  .ld-f3 { --d: 2; inset-block-start: 35%; inset-inline-start: 34%; justify-items: center; padding: var(--fx-space-5); animation-delay: calc(var(--fx-duration-pulse) * -2); z-index: 2; }
  .ld-f4 { --d: 1.1; inset-block-start: 40%; inset-inline-start: 0; inline-size: 30%; animation-delay: calc(var(--fx-duration-pulse) * -3); }
  .ld-f5 { --d: 0.9; inset-block-end: 2%; inset-inline-start: 2%; display: flex; flex-wrap: wrap; align-items: center; animation-delay: calc(var(--fx-duration-pulse) * -0.5); }
  .ld-f6 { --d: 1.3; inset-block-start: 37%; inset-inline-end: 0; inline-size: 31%; zoom: 0.8; animation-delay: calc(var(--fx-duration-pulse) * -1.5); }
  .ld-f7 { --d: 0.7; inset-block-end: 0; inset-inline-start: 43%; inline-size: 26%; animation-delay: calc(var(--fx-duration-pulse) * -2.5); }
    .ld-card--orb { background: color-mix(in oklab, var(--fx-bg-surface) 70%, transparent); }
  .ld-card--orb .fx-orb { filter: drop-shadow(0 var(--fx-space-4) var(--fx-space-8) color-mix(in oklab, var(--fx-bg-brand-solid) 45%, transparent)); }
  .ld-orb__cap { font-size: var(--fx-font-size-sm); color: var(--fx-text-secondary); }
  .ld-f6 .fx-chart { max-inline-size: 100%; }
  @media (max-width: 1199.98px) {
    .ld-f6 { zoom: 1; }
    .ld-stage { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-3); min-block-size: 0; perspective: none; }
    .ld-card { position: static; inline-size: auto; transform: none; }
    .ld-f3 { grid-column: span 2; }
    .ld-stage__tag { position: static; grid-column: 1 / -1; justify-self: start; order: 9; }
  }
  @media (max-width: 599.98px) { .ld-stage { grid-template-columns: minmax(0, 1fr); } .ld-f3 { grid-column: auto; } .ld-f6, .ld-f7 { display: none; } }

  /* ---------- komponentlar oqimi ---------- */
  .ld-marquee { display: grid; gap: var(--fx-space-3); padding-block: var(--fx-space-6); border-block: var(--fx-border-width-default) solid var(--fx-border-color-default); background: var(--fx-bg-surface); mask-image: linear-gradient(90deg, transparent, var(--fx-color-black) 10%, var(--fx-color-black) 90%, transparent); }
  .ld-marquee__row { overflow: hidden; }
  .ld-marquee__track { display: flex; gap: var(--fx-space-2); inline-size: max-content; animation: ld-marq calc(var(--fx-duration-pulse) * 40) linear infinite; }
  .ld-marquee__row[data-dir="rev"] .ld-marquee__track { animation-direction: reverse; }
  .ld-marquee:hover .ld-marquee__track { animation-play-state: paused; }
  .ld-marquee .fx-chip { font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-xs); }
  @keyframes ld-marq { to { translate: -50% 0; } }

  /* ---------- koʻrgazma (showreel): jonli sahifalar ---------- */
  .ld-show { padding-block: calc(var(--fx-space-12) * 2); background: radial-gradient(80% 60% at 50% 0%, color-mix(in oklab, var(--fx-bg-brand-solid) 35%, var(--fx-color-neutral-950)), var(--fx-color-neutral-950) 70%); color: var(--fx-color-neutral-50); }
  .ld-show .ld-kicker { color: color-mix(in oklab, var(--fx-bg-brand-solid) 50%, var(--fx-color-neutral-50)); }
  .ld-show .ld-sub { color: var(--fx-color-neutral-300); }
  .ld-show__tabs { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: var(--fx-space-2); margin-block-start: var(--fx-space-10); }
  .ld-show__all { display: flex; justify-content: center; margin: var(--fx-space-8) 0 0; }
  @media (max-width: 1599.98px) { .ld-show__tabs { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
  @media (max-width: 1199.98px) { .ld-show__tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  @media (max-width: 839.98px) { .ld-show__tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .ld-show__tab { position: relative; display: flex; flex-direction: column; gap: var(--fx-space-2); align-items: flex-start; min-inline-size: 0; padding: var(--fx-space-4); border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-color-neutral-50) 12%, transparent); border-radius: var(--fx-radius-surface); background: color-mix(in oklab, var(--fx-color-neutral-50) 4%, transparent); color: var(--fx-color-neutral-300); font: inherit; text-align: start; cursor: pointer; overflow: hidden; transition: background-color var(--fx-motion-fast) var(--fx-ease-standard), color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-show__tab:hover { background: color-mix(in oklab, var(--fx-color-neutral-50) 8%, transparent); }
  .ld-show__tab[aria-selected="true"] { background: color-mix(in oklab, var(--fx-color-neutral-50) 12%, transparent); color: var(--fx-color-neutral-50); }
  .ld-show__tab > svg { flex: none; inline-size: var(--fx-size-icon-lg); block-size: var(--fx-size-icon-lg); fill: currentColor; }
  /* ikonka sarlavha tepasida (Ustoz 19.10: «Dashboard» sigʻmayotgan edi) — 9 ustunda ham nom toʻliq */
  .ld-show__tab span { display: grid; gap: var(--fx-space-1); min-inline-size: 0; }
  .ld-show__tab b { overflow-wrap: anywhere; }
  .ld-show__tab small { color: var(--fx-color-neutral-400); font-size: var(--fx-font-size-xs); line-height: 1.4; }
  .ld-show__tab:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-color-neutral-50); outline-offset: var(--fx-border-width-focus); }
  .ld-show__bar { position: absolute; inset: auto 0 0 0; block-size: calc(var(--fx-border-width-focus) * 1.5); background: var(--fx-bg-brand-solid); transform-origin: left; scale: 0 1; }
  .ld-show__tab[aria-selected="true"] .ld-show__bar { animation: ld-bar var(--ld-dur, calc(var(--fx-duration-pulse) * 4.5)) linear forwards; }
  .ld-show[data-paused] .ld-show__bar { animation-play-state: paused; }
  @keyframes ld-bar { to { scale: 1 1; } }
  .ld-frame { margin-block-start: var(--fx-space-6); border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-color-neutral-50) 14%, transparent); border-radius: var(--fx-radius-overlay); background: var(--fx-color-neutral-900); box-shadow: var(--fx-shadow-lg); overflow: hidden; position: relative; }
  .ld-show .ld-wrap { position: relative; isolation: isolate; }
  .ld-show .ld-wrap::after { content: ""; position: absolute; inset: 55% 10% -4% 10%; z-index: -1; border-radius: var(--fx-radius-circle); background: var(--fx-bg-brand-solid); opacity: 0.45; filter: blur(calc(var(--fx-space-12) * 1.5)); pointer-events: none; }
  .ld-frame__bar { display: flex; align-items: center; gap: var(--fx-space-2); padding: var(--fx-space-3) var(--fx-space-4); border-block-end: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-color-neutral-50) 10%, transparent); }
  .ld-frame__bar > i { inline-size: var(--fx-size-status-dot); block-size: var(--fx-size-status-dot); border-radius: var(--fx-radius-circle); background: var(--fx-color-neutral-700); }
  .ld-frame__url { margin-inline: auto; padding: var(--fx-space-1) var(--fx-space-4); border-radius: var(--fx-radius-badge); background: color-mix(in oklab, var(--fx-color-neutral-50) 8%, transparent); color: var(--fx-color-neutral-400); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-xs); }
  .ld-frame__url b { color: var(--fx-color-neutral-50); font-weight: var(--fx-font-weight-regular); }
  .ld-frame__open { display: inline-flex; align-items: center; gap: var(--fx-space-1); color: var(--fx-color-neutral-300); font-size: var(--fx-font-size-xs); text-decoration: none; }
  /* tashqi/yangi oyna — oddiy strelka (qutili ikon emas, Ustoz 19.10); hover'da strelka yoʻnalishi boʻyicha siljiydi */
  .ld-frame__open svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); fill: currentColor; transition: translate var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-frame__open:hover svg { translate: calc(var(--fx-space-1) / 2) calc(var(--fx-space-1) / -2); }
  .ld-frame__view { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--fx-color-neutral-50); }
  .ld-frame__view iframe { position: absolute; inset-block-start: 0; inset-inline-start: 0; border: 0; transform-origin: 0 0; transform: scale(var(--ld-scale, 0.6)); transition: opacity var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-frame__view[data-loading] iframe { opacity: 0; }

  /* ---------- qanday ishlaydi (konveyer) ---------- */
  .ld-steps { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fx-space-4); margin: var(--fx-space-10) 0 0; padding: 0; list-style: none; }
  .ld-steps::before { content: ""; position: absolute; inset-block-start: calc(var(--fx-space-12) * 1.6); inset-inline: var(--fx-space-8); block-size: var(--fx-border-width-focus); background: repeating-linear-gradient(90deg, var(--fx-border-color-strong) 0 var(--fx-space-2), transparent var(--fx-space-2) var(--fx-space-4)); background-size: var(--fx-space-4) 100%; animation: ld-belt calc(var(--fx-duration-pulse) / 2) linear infinite; z-index: -1; }
  @keyframes ld-belt { to { background-position: var(--fx-space-4) 0; } }
  @media (max-width: 839.98px) { .ld-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ld-steps::before { display: none; } }
  @media (max-width: 599.98px) { .ld-steps { grid-template-columns: minmax(0, 1fr); } }
  .ld-step { display: grid; gap: var(--fx-space-3); align-content: start; padding: var(--fx-space-5); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-sm); }
  .ld-step__n { color: var(--fx-text-tertiary); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-xs); }
  .ld-step > b { font-size: var(--fx-font-size-lg); }
  .ld-step p { margin: 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.55; }
  .ld-step__art { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--fx-space-2); min-block-size: calc(var(--fx-space-12) * 2.2); padding: var(--fx-space-3); border-radius: var(--fx-radius-surface); background: var(--fx-bg-subtle); }
  .ld-art-tok i { inline-size: var(--fx-space-6); block-size: var(--fx-space-6); border-radius: var(--fx-radius-circle); animation: ld-pop calc(var(--fx-duration-pulse) * 2) var(--fx-ease-standard) infinite; }
  .ld-art-tok i:nth-child(1) { background: var(--fx-bg-brand-solid); }
  .ld-art-tok i:nth-child(2) { background: var(--fx-bg-category-pink); animation-delay: calc(var(--fx-duration-pulse) * 0.2); }
  .ld-art-tok i:nth-child(3) { background: var(--fx-bg-category-blue); animation-delay: calc(var(--fx-duration-pulse) * 0.4); }
  .ld-art-tok i:nth-child(4) { background: var(--fx-bg-category-yellow); animation-delay: calc(var(--fx-duration-pulse) * 0.6); }
  .ld-art-tok i:nth-child(5) { background: var(--fx-bg-category-green); animation-delay: calc(var(--fx-duration-pulse) * 0.8); }
  @keyframes ld-pop { 0%, 60%, 100% { scale: 1; } 30% { scale: 1.25; } }
  .ld-art-tok code, .ld-art-shape span { flex-basis: 100%; text-align: center; color: var(--fx-text-tertiary); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-xs); }
  .ld-art-shape i { inline-size: var(--fx-space-12); block-size: var(--fx-space-10); background: var(--fx-bg-brand-solid); animation: ld-morph calc(var(--fx-duration-pulse) * 3) var(--fx-ease-emphasized) infinite; }
  @keyframes ld-morph { 0%, 100% { border-radius: var(--fx-radius-badge); } 33% { border-radius: var(--fx-radius-surface); } 66% { border-radius: calc(var(--fx-space-10) / 2); } }
  .ld-art-comp { flex-direction: column; }
  .ld-art-comp > * { animation: ld-in calc(var(--fx-duration-pulse) * 3) var(--fx-ease-emphasized) infinite; }
  .ld-art-comp > :nth-child(2) { animation-delay: calc(var(--fx-duration-pulse) * 0.25); }
  .ld-art-comp > :nth-child(3) { animation-delay: calc(var(--fx-duration-pulse) * 0.5); }
  @keyframes ld-in { 0% { opacity: 0; translate: 0 var(--fx-space-2); } 15%, 85% { opacity: 1; translate: 0 0; } 100% { opacity: 0; } }
  .ld-fake { display: block; inline-size: 80%; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); line-height: var(--fx-control-h-sm); padding-inline: var(--fx-space-3); }
  .ld-art-proj { display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; gap: var(--fx-space-1); }
  .ld-art-proj i { block-size: calc(var(--h) * var(--fx-space-1)); border-radius: var(--fx-radius-badge) var(--fx-radius-badge) 0 0; background: var(--fx-bg-brand-solid); opacity: 0.85; transform-origin: bottom; animation: ld-grow calc(var(--fx-duration-pulse) * 2) var(--fx-ease-emphasized) infinite alternate; }
  .ld-art-proj i:nth-child(1) { --h: 5; } .ld-art-proj i:nth-child(2) { --h: 8; animation-delay: calc(var(--fx-duration-pulse) * 0.15); } .ld-art-proj i:nth-child(3) { --h: 6; animation-delay: calc(var(--fx-duration-pulse) * 0.3); } .ld-art-proj i:nth-child(4) { --h: 11; animation-delay: calc(var(--fx-duration-pulse) * 0.45); } .ld-art-proj i:nth-child(5) { --h: 14; animation-delay: calc(var(--fx-duration-pulse) * 0.6); background: var(--fx-bg-category-pink); }
  @keyframes ld-grow { from { scale: 1 0.35; } }

  /* ---------- sinov maydoni ---------- */
  .ld-play { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--fx-space-10); align-items: center; }
  @media (max-width: 839.98px) { .ld-play { grid-template-columns: minmax(0, 1fr); } }
  .ld-ctl { display: grid; gap: var(--fx-space-2); margin-block-start: var(--fx-space-5); }
  .ld-ctl > span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); font-weight: var(--fx-font-weight-semibold); text-transform: uppercase; letter-spacing: 0.06em; }
  .ld-ctl .fx-segment { max-inline-size: 100%; overflow-x: auto; }
  /* «Oʻz brendingiz» — rang tanlagich + HEX + palitra (Ustoz 20.10) */
  .ld-own__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--fx-space-2); }
  .ld-own__row .fx-input { inline-size: calc(var(--fx-space-12) * 2.4); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); text-transform: uppercase; }
  .ld-own__row .fx-btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .ld-own__pick { position: relative; display: inline-grid; place-items: center; inline-size: var(--fx-control-h-sm); aspect-ratio: 1; border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-control); background: var(--fx-bg-surface); cursor: pointer; }
  .ld-own__pick input { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; opacity: 0; cursor: pointer; }
  .ld-own__pick:focus-within { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-default); }
  .ld-own__dot { inline-size: 60%; aspect-ratio: 1; border-radius: var(--fx-radius-circle); background: var(--own, conic-gradient(from 0deg, var(--fx-color-pastel-coral), var(--fx-color-pastel-yellow), var(--fx-color-pastel-green), var(--fx-color-pastel-blue), var(--fx-color-pastel-purple), var(--fx-color-pastel-pink), var(--fx-color-pastel-coral))); pointer-events: none; }
  .ld-own__scale { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); block-size: var(--fx-space-6); overflow: hidden; border-radius: var(--fx-radius-control); }
  .ld-own__scale i { display: block; }
  /* brendlar ilhomidagi liboslar */
  .ld-brands { display: grid; gap: var(--fx-space-5); margin-block-start: var(--fx-space-12); padding-block-start: var(--fx-space-8); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .ld-brands__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--fx-space-4); }
  .ld-brands__h { margin: 0; font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-2xl); font-weight: var(--fx-font-weight-semibold); }
  .ld-brands__head p { margin: var(--fx-space-2) 0 0; color: var(--fx-text-secondary); }
  .ld-brands__head .fx-btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .ld-brands__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: var(--fx-space-3); }
  .ld-brand { display: flex; align-items: center; gap: var(--fx-space-3); padding: var(--fx-space-3); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); color: inherit; font: inherit; text-align: start; cursor: pointer; transition: border-color var(--fx-motion-fast) var(--fx-ease-standard), translate var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-brand:hover { border-color: var(--fx-border-color-strong); translate: 0 calc(var(--fx-space-1) / -2); }
  .ld-brand:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-default); }
  .ld-brand[aria-pressed="true"] { border-color: var(--fx-text-primary); outline: var(--fx-border-width-default) solid var(--fx-text-primary); outline-offset: calc(var(--fx-border-width-default) * -2); }
  /* brend belgisi — neytral plitkada bir rangli (Ustoz 20.10: gradient yoʻq, «qora logo iconsifat») */
  .ld-brand__logo { display: inline-grid; place-items: center; flex: none; inline-size: var(--fx-space-10); aspect-ratio: 1; border-radius: var(--fx-radius-control); background: var(--fx-bg-muted); color: var(--fx-text-primary); }
  .ld-brand__logo svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .ld-brand__logo .fx-mono { font-size: var(--fx-font-size-lg); line-height: 1; }
  .ld-brand__t b { display: inline-flex; align-items: center; gap: var(--fx-space-2); }
  .ld-brand__dot { inline-size: var(--fx-space-2); aspect-ratio: 1; border-radius: var(--fx-radius-circle); background: var(--c); }
  .ld-brand__t { display: grid; gap: calc(var(--fx-space-1) / 2); min-inline-size: 0; }
  .ld-brand__t small { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); line-height: 1.35; }
  .ld-brands__note { margin: 0; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-code { margin: var(--fx-space-6) 0 0; padding: var(--fx-space-3) var(--fx-space-4); border-radius: var(--fx-radius-control); background: var(--fx-color-neutral-950); color: var(--fx-color-neutral-100); font: var(--fx-font-size-xs) / 1.6 var(--fx-font-family-mono); white-space: pre-wrap; overflow-wrap: anywhere; }
  .ld-play__demo { padding: var(--fx-space-6); border-radius: calc(var(--fx-radius-overlay) * 1.5); background: var(--fx-bg-page); box-shadow: var(--fx-shadow-lg); transition: background-color var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-demo { display: grid; gap: var(--fx-space-4); color: var(--fx-text-primary); font-family: var(--fx-font-family-sans); }
  .ld-demo__head { display: flex; align-items: center; justify-content: space-between; gap: var(--fx-space-3); }
  .ld-demo__title { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-display-sm); font-weight: var(--fx-font-weight-semibold); }
  .ld-demo__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-3); }
  .ld-demo__act { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }

  /* ---------- avval / keyin ---------- */
  .ld-ba { display: grid; gap: var(--fx-space-4); margin-block-start: var(--fx-space-10); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); }
  .ld-ba > p { margin: 0; color: var(--fx-text-secondary); }
  .ld-ba__card { display: grid; gap: var(--fx-space-4); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); }
  .ld-ba__card--ok { background: linear-gradient(140deg, var(--fx-bg-brand-subtle), var(--fx-bg-surface)); }
  .ld-ba__card p { margin: 0; color: var(--fx-text-secondary); }
  .ld-ba__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--fx-space-2); }
  .ld-ba__row > span[data-fx-theme] { background: none; }

  /* ---------- bento ---------- */
  .ld-bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-10); }
  @media (max-width: 839.98px) { .ld-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 599.98px) { .ld-bento { grid-template-columns: minmax(0, 1fr); } .ld-tile--wide { grid-column: auto; } }
  .ld-tile { position: relative; display: grid; align-content: start; gap: var(--fx-space-3); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); overflow: hidden; transition: translate var(--fx-motion-base) var(--fx-ease-standard), box-shadow var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-tile:hover { translate: 0 calc(var(--fx-space-1) * -1); box-shadow: var(--fx-shadow-lg); }
  .ld-tile--wide { grid-column: span 2; }
  .ld-tile--link { color: inherit; text-decoration: none; }
  .ld-tile--link:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-space-1); }
  .ld-tile__shots { position: relative; display: block; block-size: calc(var(--fx-space-12) * 2.6); margin: var(--fx-space-2) calc(var(--fx-space-6) * -1) calc(var(--fx-space-6) * -1); }
  .ld-tile__shots img { position: absolute; inset-block-start: 0; inline-size: 52%; max-inline-size: none; block-size: auto; border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-surface); box-shadow: var(--fx-shadow-md); transition: translate var(--fx-motion-base) var(--fx-ease-standard), rotate var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-tile__shots img:nth-child(1) { inset-inline-start: 4%; rotate: -4deg; translate: 0 var(--fx-space-4); }
  .ld-tile__shots img:nth-child(2) { inset-inline-start: 24%; z-index: 1; }
  .ld-tile__shots img:nth-child(3) { inset-inline-start: 44%; rotate: 4deg; translate: 0 var(--fx-space-4); }
  .ld-tile--link:hover .ld-tile__shots img:nth-child(1) { rotate: -7deg; translate: calc(var(--fx-space-2) * -1) var(--fx-space-3); }
  .ld-tile--link:hover .ld-tile__shots img:nth-child(3) { rotate: 7deg; translate: var(--fx-space-2) var(--fx-space-3); }
  .ld-tile__ic { display: grid; place-items: center; justify-self: start; inline-size: var(--fx-space-12); aspect-ratio: 1; margin-block-start: var(--fx-space-2); border-radius: var(--fx-radius-surface); background: var(--fx-bg-brand-subtle); color: var(--fx-text-brand); }
  .ld-tile__ic svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .ld-tile--dark { background: var(--fx-color-neutral-950); color: var(--fx-color-neutral-50); border-color: transparent; }
  
  .ld-tile h3 { margin: 0; font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-xl); font-weight: var(--fx-font-weight-semibold); line-height: 1.2; }
  .ld-tile p { margin: 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.55; }
  .ld-tile--dark p { color: var(--fx-color-neutral-300); }
  .ld-tile__k { color: var(--fx-text-brand); font-size: var(--fx-font-size-xs); font-weight: var(--fx-font-weight-semibold); text-transform: uppercase; letter-spacing: 0.06em; }
  .ld-tile--dark .ld-tile__k { color: color-mix(in oklab, var(--fx-bg-brand-solid) 50%, var(--fx-color-neutral-50)); }
  .ld-big { font-size: calc(var(--fx-font-size-display-md) * 1.6) !important; line-height: 1 !important; letter-spacing: -0.04em; background: linear-gradient(120deg, var(--fx-text-brand), color-mix(in oklch, var(--fx-text-brand) 45%, var(--fx-fg-info))); background-clip: text; color: transparent; }
  .ld-tile__orb { justify-self: end; margin-block-start: auto; }
  .ld-term { margin: var(--fx-space-2) 0 0; padding: var(--fx-space-4); border-radius: var(--fx-radius-surface); background: color-mix(in oklab, var(--fx-color-neutral-50) 6%, transparent); color: var(--fx-color-neutral-200); font: var(--fx-font-size-xs) / 1.8 var(--fx-font-family-mono); white-space: pre-wrap; overflow-wrap: anywhere; }
  .ld-term__p { color: color-mix(in oklab, var(--fx-bg-brand-solid) 55%, var(--fx-color-neutral-50)); }
  .ld-term__ok { color: var(--fx-color-green-300); }
  .ld-term__cur { display: inline-block; inline-size: 0.6em; block-size: 1.1em; margin-inline-start: var(--fx-space-1); vertical-align: text-bottom; background: var(--fx-color-neutral-200); animation: ld-blink var(--fx-duration-pulse) steps(1) infinite; }
  @keyframes ld-blink { 50% { opacity: 0; } }
  .ld-feed { display: grid; gap: var(--fx-space-2); margin: var(--fx-space-2) 0 0; padding: 0; list-style: none; }
  .ld-feed li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--fx-space-3); align-items: baseline; padding-block: var(--fx-space-2); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-default); font-size: var(--fx-font-size-sm); }
  .ld-feed b { font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-weight: var(--fx-font-weight-medium); }
  .ld-feed span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .ld-feed time { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }

  /* ---------- raqamlar ---------- */
  .ld-nums { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--fx-space-3); margin-block-start: var(--fx-space-8); }
  @media (max-width: 839.98px) { .ld-nums { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  @media (max-width: 599.98px) { .ld-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .ld-num { display: grid; gap: var(--fx-space-1); padding: var(--fx-space-5); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-sm); }
  .ld-num b { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: calc(var(--fx-font-size-display-md) * 1.25); font-weight: var(--fx-font-weight-semibold); font-variant-numeric: tabular-nums; letter-spacing: -0.03em; line-height: 1; }
  .ld-num span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }

  /* ---------- AI ---------- */
  .ld-ai { padding-block: calc(var(--fx-space-12) * 1.5); background: var(--fx-color-neutral-950); color: var(--fx-color-neutral-50);
    background-image: repeating-linear-gradient(90deg, color-mix(in oklab, var(--fx-color-neutral-50) 5%, transparent) 0 var(--fx-border-width-default), transparent var(--fx-border-width-default) calc(var(--fx-space-12) * 2)); }
  .ld-ai .ld-kicker { color: color-mix(in oklab, var(--fx-bg-brand-solid) 50%, var(--fx-color-neutral-50)); }
  .ld-ai .ld-sub { color: var(--fx-color-neutral-300); }
  .ld-ai__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--fx-space-8); align-items: center; }
  @media (max-width: 839.98px) { .ld-ai__in { grid-template-columns: minmax(0, 1fr); } }
  .ld-ai__box { display: flex; align-items: center; gap: var(--fx-space-3); padding: var(--fx-space-2) var(--fx-space-2) var(--fx-space-2) var(--fx-space-5); border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-color-neutral-50) 18%, transparent); border-radius: var(--fx-radius-overlay); background: color-mix(in oklab, var(--fx-color-neutral-50) 5%, transparent); }
  .ld-ai__box code { flex: 1; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fx-font-size-sm); }
  .ld-ai__box .fx-btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); fill: currentColor; }
  .ld-ai__box { margin-block-start: var(--fx-space-6); }
  .ld-ai__hint { margin: var(--fx-space-3) 0 0; color: var(--fx-color-neutral-400); font-size: var(--fx-font-size-sm); }
  .ld-ai__hint code { color: var(--fx-color-neutral-100); }
  /* MCP sxemasi: 3 ustun (AI · FoxUI · vositalar) + orqada SVG simlar (viewBox 0–100, choʻziladi; chiziq qalinligi ekranda bir xil) */
  .ld-mcp { position: relative; display: grid; grid-template-columns: 30fr 40fr 30fr; align-items: stretch; min-block-size: calc(var(--fx-space-12) * 8); }
  .ld-mcp__wires { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; overflow: visible; pointer-events: none; }
  .ld-mcp__wires path { fill: none; stroke: color-mix(in oklab, var(--fx-color-neutral-50) 16%, transparent); stroke-width: var(--fx-border-width-default); vector-effect: non-scaling-stroke; }
  .ld-mcp__col { display: grid; grid-auto-rows: 1fr; margin: 0; padding: 0; list-style: none; position: relative; z-index: 1; }
  .ld-mcp__col li { display: flex; align-items: center; gap: var(--fx-space-2); align-self: center; justify-self: start; inline-size: 100%; box-sizing: border-box; padding: var(--fx-space-2) var(--fx-space-3); border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-color-neutral-50) 14%, transparent); border-radius: var(--fx-radius-control); background: color-mix(in oklab, var(--fx-color-neutral-950) 70%, var(--fx-color-neutral-800)); font-size: var(--fx-font-size-sm); white-space: nowrap; }
  .ld-mcp__clients li svg { flex: none; inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); color: color-mix(in oklab, var(--fx-bg-brand-solid) 60%, var(--fx-color-neutral-50)); }
  .ld-mcp__tools li { display: grid; gap: 0; justify-items: start; }
  .ld-mcp__tools code { font-size: var(--fx-font-size-xs); color: var(--fx-color-neutral-100); }
  .ld-mcp__tools span { color: var(--fx-color-neutral-400); font-size: var(--fx-font-size-xs); }
  .ld-mcp__hub { position: relative; z-index: 1; display: grid; place-content: center; justify-items: center; gap: var(--fx-space-3); }
  .ld-mcp__mark { position: relative; display: grid; place-items: center; inline-size: calc(var(--fx-space-12) * 1.75); aspect-ratio: 1; border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-bg-brand-solid) 55%, transparent); border-radius: var(--fx-radius-overlay); background: radial-gradient(circle at 50% 30%, color-mix(in oklab, var(--fx-bg-brand-solid) 35%, var(--fx-color-neutral-900)), var(--fx-color-neutral-950)); }
  .ld-mcp__mark svg { inline-size: 50%; block-size: auto; }
  .ld-mcp__ring { position: absolute; inset-block-start: 50%; inset-inline-start: 50%; inline-size: calc(var(--fx-space-12) * 1.75); aspect-ratio: 1; translate: -50% calc(-50% - var(--fx-space-5)); border-radius: var(--fx-radius-overlay); border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-bg-brand-solid) 60%, transparent); pointer-events: none; opacity: 0; }
  .ld-mcp__hub b { font-size: var(--fx-font-size-sm); font-weight: var(--fx-font-weight-semibold); }
  @media (prefers-reduced-motion: no-preference) {
    .ld-mcp__wires path { stroke: color-mix(in oklab, var(--fx-bg-brand-solid) 55%, var(--fx-color-neutral-50)); stroke-dasharray: 2 10; stroke-linecap: round; animation: ld-wire var(--fx-duration-pulse) linear infinite; animation-delay: calc(var(--i) * var(--fx-duration-pulse) / -6); opacity: 0.55; }
    .ld-mcp__wires path[data-out] { animation-direction: normal; }
    .ld-mcp__ring { animation: ld-ring calc(var(--fx-duration-pulse) * 1.5) var(--fx-ease-standard) infinite; }
    .ld-mcp__clients li { animation: ld-blink calc(var(--fx-duration-pulse) * 3.75) var(--fx-ease-standard) infinite; animation-delay: calc(var(--i) * var(--fx-duration-pulse) * 0.625); }
  }
  @keyframes ld-wire { to { stroke-dashoffset: -24; } }
  @keyframes ld-ring { 0% { opacity: 0.8; scale: 1; } 100% { opacity: 0; scale: 1.6; } }
  @keyframes ld-blink { 0%, 12%, 100% { border-color: color-mix(in oklab, var(--fx-color-neutral-50) 14%, transparent); } 6% { border-color: color-mix(in oklab, var(--fx-bg-brand-solid) 75%, transparent); } }
  /* agent suhbati namunasi: soʻrov → MCP chaqiruvlari → natija */
  .ld-ai__chat { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--fx-space-4); align-items: start; margin-block-start: var(--fx-space-10); padding: var(--fx-space-5); border: var(--fx-border-width-default) solid color-mix(in oklab, var(--fx-color-neutral-50) 12%, transparent); border-radius: var(--fx-radius-overlay); background: color-mix(in oklab, var(--fx-color-neutral-50) 3%, transparent); }
  .ld-ai__chat .fx-message { margin: 0; }
  .ld-ai__steps { display: grid; gap: var(--fx-space-2); }
  .ld-ai__out { overflow-x: auto; border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); }
  .ld-ai__out .fx-table { inline-size: 100%; }
  @media (max-width: 839.98px) {
    .ld-ai__chat { grid-template-columns: minmax(0, 1fr); }
  }
  @media (max-width: 599.98px) {
    .ld-mcp { grid-template-columns: 34fr 32fr 34fr; min-block-size: calc(var(--fx-space-12) * 7); }
    .ld-mcp__col li { padding: var(--fx-space-1) var(--fx-space-2); font-size: var(--fx-font-size-xs); white-space: normal; }
    .ld-mcp__clients li svg { display: none; }
    .ld-mcp__mark { inline-size: var(--fx-space-12); }
    .ld-mcp__ring { inline-size: var(--fx-space-12); }
  }

  /* ---------- narx ---------- */
  .ld-period { display: flex; justify-content: center; margin-block-start: var(--fx-space-8); }
  .ld-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-6); align-items: stretch; }
  @media (max-width: 839.98px) { .ld-plans { grid-template-columns: minmax(0, 1fr); } }
  .ld-plan { position: relative; display: grid; grid-template-rows: auto auto auto auto 1fr auto; gap: var(--fx-space-3); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); }
  .ld-plan--hot { border: var(--fx-border-width-focus) solid var(--fx-bg-brand-solid); box-shadow: var(--fx-shadow-lg); }
  .ld-plan > .fx-badge { position: absolute; z-index: 2; inset-block-start: calc(var(--fx-space-3) * -1); inset-inline-start: var(--fx-space-6); }
  .ld-plan h3 { margin: 0; font-size: var(--fx-font-size-xl); }
  .ld-plan > p { margin: 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .ld-plan__price { display: flex; align-items: baseline; gap: var(--fx-space-2); }
  .ld-plan__price b { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-display-sm); letter-spacing: -0.02em; }
  .ld-plan__price span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .ld-plan ul { display: grid; gap: var(--fx-space-2); margin: 0; padding: 0; list-style: none; font-size: var(--fx-font-size-sm); }
  .ld-plan li { display: flex; gap: var(--fx-space-2); align-items: flex-start; }
  .ld-plan__btn { justify-self: stretch; }
  .ld-plan li svg { flex: none; inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); margin-block-start: calc(var(--fx-space-1) / 2); fill: var(--fx-fg-success); }
  .ld-plan li .ds-crown { display: inline; flex: none; inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); margin: 0 var(--fx-space-1); vertical-align: -0.125em; fill: var(--fx-color-amber-600); }

  /* ---------- FAQ ---------- */
  .ld-faq { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--fx-space-10); align-items: start; }
  @media (max-width: 839.98px) { .ld-faq { grid-template-columns: minmax(0, 1fr); } }

  /* ---------- yakuniy CTA ---------- */
  .ld-final { padding-block: calc(var(--fx-space-12) * 2); }
  .ld-final__in { display: grid; justify-items: center; gap: var(--fx-space-2); padding: calc(var(--fx-space-12) * 1.5) var(--fx-space-6); border-radius: calc(var(--fx-radius-overlay) * 2); background: radial-gradient(70% 90% at 50% 0%, var(--fx-bg-category-purple-subtle), transparent), radial-gradient(60% 80% at 100% 100%, var(--fx-bg-category-pink-subtle), transparent), var(--fx-bg-surface); text-align: center; box-shadow: var(--fx-shadow-md); }
  .ld-final__in .ld-h2, .ld-final__in .ld-sub { margin-inline: auto; }
  .ld-final__in .ld-cta { justify-content: center; }
  /* ariza shu yerda (Ustoz 21.10): taklif qatori, bir qatorda 3 maydon + tugma, telefonda ustma-ust */
  .ld-final__offer { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--fx-space-2); margin: var(--fx-space-3) 0 0; padding: var(--fx-space-2) var(--fx-space-4); border-radius: var(--fx-radius-pill); background: var(--fx-bg-surface); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); font-size: var(--fx-font-size-md); }
  .ld-final__offer > span:last-child { display: inline-flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: var(--fx-space-1) var(--fx-space-2); }
  .ld-final__offer b { color: var(--fx-text-brand); }
  .ld-final__offer s { color: var(--fx-text-tertiary); }
  .ld-final__crown { display: grid; place-items: center; inline-size: var(--fx-space-6); block-size: var(--fx-space-6); border-radius: var(--fx-radius-circle); background: var(--fx-bg-warning-subtle); color: var(--fx-fg-warning); }
  .ld-final__crown > svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .ld-final__form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: var(--fx-space-2); inline-size: 100%; max-inline-size: calc(var(--fx-space-12) * 17); margin-block-start: var(--fx-space-5); text-align: start; }
  .ld-final__f { display: block; min-inline-size: 0; }
  .ld-final__f .fx-input { inline-size: 100%; }
  .ld-final__send > svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .ld-final__note { margin: var(--fx-space-2) 0 0; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .ld-final__note a { color: var(--fx-text-brand); }
  .ld-final .ds-hp { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  @media (max-width: 839.98px) { .ld-final__form { grid-template-columns: minmax(0, 1fr); } .ld-final__send { inline-size: 100%; } }


  /* ---------- koʻrinishga kirganda paydo boʻlish ---------- */
  [data-ld-reveal] > * { opacity: 0; translate: 0 var(--fx-space-6); transition: opacity var(--fx-motion-slow) var(--fx-ease-emphasized), translate var(--fx-motion-slow) var(--fx-ease-emphasized); }
  [data-ld-reveal][data-in] > * { opacity: 1; translate: 0 0; }
  [data-ld-reveal][data-in] > :nth-child(2) { transition-delay: calc(var(--fx-duration-stagger) * 3); }
  [data-ld-reveal][data-in] > :nth-child(3) { transition-delay: calc(var(--fx-duration-stagger) * 6); }
  [data-ld-reveal][data-in] > :nth-child(4) { transition-delay: calc(var(--fx-duration-stagger) * 9); }
  [data-ld-reveal][data-in] > :nth-child(5) { transition-delay: calc(var(--fx-duration-stagger) * 12); }
  [data-ld-reveal][data-in] > :nth-child(6) { transition-delay: calc(var(--fx-duration-stagger) * 15); }

  /* harakat kamaytirilsa yoki «Harakat: yoʻq» — hammasi tinch */
  @media (prefers-reduced-motion: reduce) {
    .ld *, .ld *::before, .ld *::after { animation: none !important; transition: none !important; }
    [data-ld-reveal] > * { opacity: 1; translate: none; }
    .ld-rot > span:first-child { opacity: 1; translate: none; }
  }
  [data-fx-motion="none"] .ld *, [data-fx-motion="none"] .ld *::before, [data-fx-motion="none"] .ld *::after { animation: none !important; }
  [data-fx-motion="none"] .ld-rot > span:first-child { opacity: 1; translate: none; }
}

/* allaqachon ishlayapti — oʻz loyihalarimiz (haqiqiy, oʻylab topilmagan) */
@layer fx.utilities {
  .ld-used { padding-block-end: 0; }
  .ld-used__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-8); }
  @media (max-width: 839.98px) { .ld-used__grid { grid-template-columns: minmax(0, 1fr); } }
  .ld-used__card { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--fx-space-3) var(--fx-space-4); align-items: center; padding: var(--fx-space-5); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); }
  .ld-used__card > svg { inline-size: var(--fx-size-avatar-md); block-size: var(--fx-size-avatar-md); padding: var(--fx-space-2); box-sizing: border-box; border-radius: var(--fx-radius-surface); background: var(--fx-bg-brand-subtle); fill: var(--fx-text-brand); }
  .ld-used__card div { display: grid; gap: var(--fx-space-1); }
  .ld-used__card span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-used__card p { grid-column: 1 / -1; margin: 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.55; }
}

/* mavzular galereyasi — har karta oʻz mavzusida (ichma-ich data-fx-theme) */
@layer fx.utilities {
  .ld-themes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-10); }
  @media (max-width: 1199.98px) { .ld-themes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 599.98px) { .ld-themes { grid-template-columns: minmax(0, 1fr); } }
  .ld-theme { display: grid; border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); overflow: hidden; transition: translate var(--fx-motion-base) var(--fx-ease-standard), box-shadow var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-theme:hover { translate: 0 calc(var(--fx-space-1) * -1); box-shadow: var(--fx-shadow-lg); }
  .ld-theme__pv { display: grid; gap: var(--fx-space-3); padding: var(--fx-space-5); background: radial-gradient(90% 70% at 100% 0%, var(--fx-bg-brand-subtle), transparent 70%), var(--fx-bg-page); color: var(--fx-text-primary); font-family: var(--fx-font-family-sans); }
  .ld-theme__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--fx-space-2); }
  .ld-theme__row b { margin-inline-end: auto; font-size: var(--fx-font-size-md); }
  .ld-theme__dot { inline-size: var(--fx-space-5); block-size: var(--fx-space-5); border-radius: var(--fx-radius-circle); background: var(--fx-bg-brand-solid); }
  .ld-theme__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-2); }
  .ld-theme__stats .fx-stat { padding: var(--fx-space-3); }
  .ld-theme__stats .fx-stat__value { font-size: var(--fx-font-size-xl); }
  .ld-theme__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--fx-space-3); padding: var(--fx-space-3) var(--fx-space-4); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .ld-theme__sw { display: flex; }
  .ld-theme__sw i { inline-size: var(--fx-space-5); block-size: var(--fx-space-5); border-radius: var(--fx-radius-circle); outline: var(--fx-border-width-focus) solid var(--fx-bg-surface); }
  .ld-theme__sw i + i { margin-inline-start: calc(var(--fx-space-2) * -1); }
  .ld-theme:has(.ld-theme__foot [aria-pressed="true"]) { outline: var(--fx-border-width-focus) solid var(--fx-text-primary); }
  /* Ikki rang qoidasi (Ustoz 21.10: «kasha boʻlmasin»): tanlanmagan kartada faqat brend va neytral — pastel bloklar va badge kulrang;
     tanlanganda (yoki ustiga kelinganda) qolgan detallar jonlanadi */
  .ld-theme__pv :is(.fx-stat, .fx-badge) { transition: background-color var(--fx-motion-slow) var(--fx-ease-standard), color var(--fx-motion-slow) var(--fx-ease-standard); }
  .ld-theme:not(:has(.ld-theme__foot [aria-pressed="true"])):not(:hover) .ld-theme__pv .fx-stat { background: var(--fx-bg-subtle); }
  .ld-theme:not(:has(.ld-theme__foot [aria-pressed="true"])):not(:hover) .ld-theme__pv .fx-badge { background: var(--fx-bg-muted); color: var(--fx-text-secondary); }
  .ld-theme__ink { background: var(--fx-text-primary); }
  .ld-theme__act { margin-block-start: var(--fx-space-1); }
  .ld-themes__all { display: flex; justify-content: center; margin-block-start: var(--fx-space-5); }
  .ld-themes__all .fx-btn > svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
}

/* mexanizm → libos (fx-compare): ikki qatlam bir xil toʻrda — har kulrang blok aynan oʻz komponenti oʻrnida */
@layer fx.utilities {
  /* ---- Mexanizm → libos (Ustoz 21.10: «udar boʻlsin»): har qator butun enda, ikki tomonda bir xil joyda ---- */
  .ld-compare { margin-block-start: var(--fx-space-10); border-radius: var(--fx-radius-overlay); box-shadow: var(--fx-shadow-lg); }
  .ld-compare .fx-compare__handle { background: var(--fx-bg-brand-solid); outline: var(--fx-space-1) solid color-mix(in oklab, var(--fx-bg-brand-solid) 22%, transparent); }
  /* «Qolip» / «Libos» yorliqlari pastda — tepadagi tugmalarni yopmasin */
  .ld-compare .fx-compare__label { inset-block: auto var(--fx-space-3); }
  .ld-mx { position: relative; display: grid; align-content: center; gap: var(--fx-space-4); padding: var(--fx-space-10) var(--fx-space-10); overflow: hidden; }
  .ld-mx > * { position: relative; z-index: 1; }
  .ld-mx--before { background: var(--fx-bg-subtle); filter: grayscale(1); }
  .ld-mx__head { display: flex; align-items: center; justify-content: space-between; gap: var(--fx-space-3); min-block-size: var(--fx-space-10); }
  .ld-mx__title { display: flex; align-items: center; gap: var(--fx-space-3); font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-2xl); }
  .ld-mx__end { display: flex; align-items: center; gap: var(--fx-space-2); }
  .ld-mx__stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fx-space-3); }
  .ld-mx__stats > * { min-block-size: calc(var(--fx-space-12) * 2); box-sizing: border-box; }
  .ld-mx__delta { justify-self: start; padding: 0 var(--fx-space-2); border-radius: var(--fx-radius-badge); background: color-mix(in oklab, var(--fx-bg-surface) 70%, transparent); font-size: var(--fx-font-size-xs); font-weight: var(--fx-font-weight-semibold); }
  .ld-mx__chart { position: relative; block-size: calc(var(--fx-space-12) * 2.4); border-radius: var(--fx-radius-surface); background: color-mix(in oklab, var(--fx-bg-surface) 82%, transparent); backdrop-filter: blur(var(--fx-space-2)); overflow: hidden; }
  .ld-mx__chart > svg { position: absolute; inset: var(--fx-space-6) 0 0; inline-size: 100%; block-size: calc(100% - var(--fx-space-6)); }
  .ld-mx__chart stop { stop-color: var(--fx-bg-brand-solid); stop-opacity: 0.35; }
  .ld-mx__chart stop + stop { stop-opacity: 0; }
  .ld-mx__area { fill: url(#ld-mx-g); }
  .ld-mx__line { fill: none; stroke: var(--fx-bg-brand-solid); stroke-width: 3; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
  .ld-mx__live { position: absolute; inset-block-start: calc(var(--fx-space-6) + (100% - var(--fx-space-6)) * 0.2); inset-inline-end: 0; inline-size: var(--fx-space-3); block-size: var(--fx-space-3); translate: 50% -50%; border-radius: var(--fx-radius-circle); background: var(--fx-bg-brand-solid); }
  .ld-mx__chip { position: absolute; inset-block-start: var(--fx-space-3); inset-inline-start: var(--fx-space-4); font-size: var(--fx-font-size-sm); font-weight: var(--fx-font-weight-semibold); color: var(--fx-text-brand); }
  .ld-mx__row { display: grid; grid-template-columns: auto minmax(0, 1.2fr) minmax(0, 2fr) auto; align-items: center; gap: var(--fx-space-4); min-block-size: calc(var(--fx-space-12) * 1.25); padding-inline: var(--fx-space-4); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); }
  .ld-mx__who { display: grid; min-inline-size: 0; font-size: var(--fx-font-size-sm); }
  .ld-mx__who small { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-mx__who > * { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .ld-mx__bar { display: block; block-size: var(--fx-space-2); border-radius: var(--fx-radius-pill); background: var(--fx-bg-muted); overflow: hidden; }
  .ld-mx__bar > i { display: block; block-size: 100%; inline-size: var(--v); border-radius: inherit; background: linear-gradient(90deg, color-mix(in oklab, var(--fx-bg-brand-solid) 70%, var(--fx-color-pastel-pink)), var(--fx-bg-brand-solid)); }
  /* qolip: skelet, kulrang */
  .ld-sk { display: block; block-size: var(--fx-space-8); border-radius: var(--fx-radius-control); background: var(--fx-bg-muted); }
  .ld-sk--text { block-size: var(--fx-space-3); }
  .ld-sk--pill { inline-size: calc(var(--fx-space-12) * 1.6); block-size: var(--fx-space-8); border-radius: var(--fx-radius-control); }
  .ld-sk--dot { inline-size: var(--fx-space-8); block-size: var(--fx-space-8); border-radius: var(--fx-radius-circle); }
  .ld-mx__stats > .ld-sk--box { border-radius: var(--fx-radius-surface); }
  .ld-sk--chart { block-size: calc(var(--fx-space-12) * 2.4); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); outline: var(--fx-border-width-default) dashed var(--fx-border-color-strong); outline-offset: calc(var(--fx-border-width-default) * -1); }
  .ld-mx--before .ld-mx__row { background: var(--fx-bg-surface); outline: var(--fx-border-width-default) dashed var(--fx-border-color-strong); outline-offset: calc(var(--fx-border-width-default) * -1); }
  /* libos: suzuvchi rang foni (mesh) — brend va pastel dogʻlar sekin aylanadi */
  .ld-mx--after { background: var(--fx-bg-page); transition: background-color var(--fx-motion-slow) var(--fx-ease-standard); }
  .ld-mx--after::before { content: ""; position: absolute; inset: -30%; z-index: 0; background:
      radial-gradient(30% 35% at 18% 28%, color-mix(in oklab, var(--fx-bg-brand-solid) 60%, transparent), transparent 70%),
      radial-gradient(22% 28% at 92% 60%, color-mix(in oklab, var(--fx-bg-brand-solid) 45%, transparent), transparent 70%),
      radial-gradient(28% 34% at 82% 18%, color-mix(in oklab, var(--fx-color-pastel-pink) 85%, transparent), transparent 70%),
      radial-gradient(34% 38% at 70% 82%, color-mix(in oklab, var(--fx-color-pastel-blue) 85%, transparent), transparent 70%),
      radial-gradient(26% 30% at 30% 85%, color-mix(in oklab, var(--fx-color-pastel-yellow) 80%, transparent), transparent 70%);
    filter: blur(var(--fx-space-6)); animation: ld-mesh calc(var(--fx-duration-spin) * 18) var(--fx-ease-standard) infinite alternate; }
  @keyframes ld-mesh { 0% { transform: rotate(0deg) scale(1); } 50% { transform: rotate(14deg) scale(1.08) translate(2%, -3%); } 100% { transform: rotate(-10deg) scale(1.04) translate(-3%, 2%); } }
  /* koʻrinishga kirganda (data-on): grafik chiziladi, chiziqlar toʻladi, jonli nuqta toʻlqinlanadi */
  [data-ld-mx][data-on] .ld-mx__chart > svg { animation: ld-draw calc(var(--fx-duration-spin) * 3) var(--fx-ease-emphasized) both; }
  [data-ld-mx][data-on] .ld-mx__area { animation: ld-fade calc(var(--fx-duration-spin) * 3) var(--fx-ease-standard) both; }
  [data-ld-mx][data-on] .ld-mx__bar > i { animation: ld-fill calc(var(--fx-duration-spin) * 2.5) var(--fx-ease-emphasized) both; }
  [data-ld-mx][data-on] .ld-mx__live { animation: ld-ping calc(var(--fx-duration-spin) * 2) var(--fx-ease-standard) infinite; }
  @keyframes ld-draw { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
  @keyframes ld-fade { from { opacity: 0; } }
  @keyframes ld-fill { from { inline-size: 0; } }
  .ld-mx__live { outline: var(--fx-border-width-focus) solid color-mix(in oklab, var(--fx-bg-brand-solid) 55%, transparent); outline-offset: 0; }
  @keyframes ld-ping { 80%, 100% { outline-offset: var(--fx-space-3); outline-color: transparent; } }
  .ld-mx__pick { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--fx-space-2); margin-block-start: var(--fx-space-5); }
  @media (prefers-reduced-motion: reduce) { .ld-mx--after::before, [data-ld-mx][data-on] :is(.ld-mx__chart > svg, .ld-mx__area, .ld-mx__bar > i, .ld-mx__live) { animation: none; } }
  @media (max-width: 839.98px) {
    .ld-mx { padding: var(--fx-space-5); gap: var(--fx-space-3); }
    .ld-mx__title { font-size: var(--fx-font-size-lg); }
    .ld-mx__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ld-mx__stats > * { min-block-size: calc(var(--fx-space-12) * 1.6); }
    .ld-mx__row { grid-template-columns: auto minmax(0, 1fr) auto; }
    .ld-mx__row > .ld-mx__bar, .ld-mx__row > .ld-mx__barsk { display: none; }
    .ld-mx__end > :not(.fx-btn):not(.ld-sk--pill) { display: none; }
  }

  /* ---------- narxlar (site/data/narx.json → scripts/site-narx.mjs) ---------- */
  .ld-plan__price { flex-wrap: wrap; }
  .ld-plan__price s { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-lg); text-decoration-thickness: calc(var(--fx-border-width-default) * 1.5); }
  .ld-plan__price .fx-badge { align-self: center; }
  .ld-plan > .ld-plan__bill { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-promo { display: flex; align-items: center; justify-content: center; gap: var(--fx-space-2); margin: var(--fx-space-4) 0 0; color: var(--fx-text-brand); font-size: var(--fx-font-size-sm); font-weight: 600; }
  .ld-promo > svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .ld-founders { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: var(--fx-space-6); align-items: center; margin-block-start: var(--fx-space-6); padding: var(--fx-space-6); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-category-yellow-subtle); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); }
  .ld-founders h3 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--fx-space-2); margin: var(--fx-space-2) 0 0; font-size: var(--fx-font-size-xl); text-wrap: balance; }
  /* chaqnab turgan chegirma belgisi: ustidan yorugʻlik oʻtadi; harakat kamaytirilsa — tinch */
  .ld-shine { position: relative; overflow: hidden; isolation: isolate; font-size: var(--fx-font-size-sm); font-weight: 700; }
  .ld-shine::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 30%, color-mix(in oklab, var(--fx-color-white) 75%, transparent) 50%, transparent 70%); translate: -100% 0; animation: ld-shine calc(var(--fx-duration-pulse) * 1.6) var(--fx-ease-standard) infinite; }
  @keyframes ld-shine { 60%, 100% { translate: 100% 0; } }
  @media (prefers-reduced-motion: reduce) { .ld-shine::after { animation: none; } }
  .ld-period .fx-segment__item { display: inline-flex; align-items: center; gap: var(--fx-space-2); }
  .ld-founders p { margin: var(--fx-space-2) 0 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.55; }
  .ld-founders__left { display: grid; gap: var(--fx-space-2); justify-items: start; }
  .ld-founders__left b { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-display-md); line-height: 1; }
  .ld-founders__left span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .ld-founders__left .fx-progress { inline-size: 100%; }
  @media (max-width: 839.98px) { .ld-founders { grid-template-columns: minmax(0, 1fr); } }
  .ld-terms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-3) var(--fx-space-6); margin: var(--fx-space-6) 0 0; padding: 0; list-style: none; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.5; }
  .ld-terms li { display: flex; gap: var(--fx-space-2); }
  .ld-terms svg { flex: none; inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); margin-block-start: calc(var(--fx-space-1) / 2); color: var(--fx-fg-success); }
  @media (max-width: 839.98px) { .ld-terms { grid-template-columns: minmax(0, 1fr); } }
  .ld-more { display: flex; justify-content: center; margin: var(--fx-space-6) 0 0; }
  .ld-more .fx-btn { max-inline-size: 100%; white-space: normal; text-align: center; }
  .ld-narx-hero { padding-block-start: var(--fx-space-10); }
  .ld-narx-h1 { max-inline-size: 18ch; }
  .ld-h3 { margin: var(--fx-space-10) 0 0; font-size: var(--fx-font-size-xl); }
  /* 10 vosita → bitta */
  .ld-merge { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.2fr); gap: var(--fx-space-6); align-items: center; margin-block-start: var(--fx-space-8); }
  .ld-merge__tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-2); margin: 0; padding: 0; list-style: none; }
  .ld-merge__tools li { display: grid; gap: calc(var(--fx-space-1) / 2); padding: var(--fx-space-3); border: var(--fx-border-width-default) dashed var(--fx-border-color-default); border-radius: var(--fx-radius-control); background: var(--fx-bg-surface); font-size: var(--fx-font-size-sm); rotate: calc((var(--i) - 4.5) * 0.4deg); }
  .ld-merge__tools span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-merge__into { display: grid; place-items: center; inline-size: var(--fx-space-12); aspect-ratio: 1; border-radius: var(--fx-radius-circle); background: var(--fx-bg-brand-solid); color: var(--fx-text-on-brand); }
  .ld-merge__into svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .ld-merge__fx { display: grid; gap: var(--fx-space-3); padding: var(--fx-space-6); border: var(--fx-border-width-focus) solid var(--fx-bg-brand-solid); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-lg); }
  .ld-merge__mark { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-display-sm); font-weight: 700; letter-spacing: -0.02em; }
  .ld-merge__fx ul { display: grid; gap: var(--fx-space-2); margin: 0; padding: 0; list-style: none; font-size: var(--fx-font-size-sm); line-height: 1.45; }
  .ld-merge__fx li { display: flex; gap: var(--fx-space-2); }
  .ld-merge__fx li svg { flex: none; inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); margin-block-start: calc(var(--fx-space-1) / 2); color: var(--fx-text-brand); }
  @media (max-width: 839.98px) { .ld-merge { grid-template-columns: minmax(0, 1fr); justify-items: stretch; } .ld-merge__into { justify-self: center; rotate: 90deg; } }
  @media (max-width: 599.98px) { .ld-merge__tools { grid-template-columns: minmax(0, 1fr); } }
  /* kalkulyator */
  .ld-calc { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr); margin-block-start: var(--fx-space-8); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); overflow: hidden; box-shadow: var(--fx-shadow-md); }
  .ld-calc__in { display: grid; align-content: start; gap: var(--fx-space-5); padding: var(--fx-space-6); background: var(--fx-bg-subtle); border-inline-end: var(--fx-border-width-default) solid var(--fx-border-color-surface); }
  .ld-calc__ctl { display: grid; gap: var(--fx-space-2); justify-items: start; }
  .ld-calc__ctl > span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); font-weight: 600; }
  .ld-calc__sum { display: grid; gap: var(--fx-space-1); padding-block-start: var(--fx-space-5); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .ld-calc__sum > span { font-weight: 600; }
  .ld-calc__sum > b { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-display-md); letter-spacing: -0.02em; line-height: 1.1; }
  .ld-calc__sum > p { margin: 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.5; }
  .ld-calc__bars { display: grid; align-content: start; gap: var(--fx-space-5); padding: var(--fx-space-6); }
  .ld-calc__foot { grid-column: 1 / -1; margin: 0; padding: var(--fx-space-4) var(--fx-space-6); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-surface); color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); line-height: 1.5; }
  .ld-bar { display: grid; gap: var(--fx-space-2); }
  .ld-bar__top { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--fx-space-1) var(--fx-space-2); }
  .ld-bar__top span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-bar__top strong { margin-inline-start: auto; font-variant-numeric: tabular-nums; }
  .ld-bar__track { block-size: var(--fx-space-5); border-radius: var(--fx-radius-control); background: var(--fx-bg-muted); overflow: hidden; }
  .ld-bar__track i { display: block; inline-size: var(--w); block-size: 100%; border-radius: inherit; background: var(--fx-border-color-strong); transition: inline-size var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-bar--us .ld-bar__track i { background: var(--fx-bg-brand-solid); }
  @media (max-width: 839.98px) { .ld-calc { grid-template-columns: minmax(0, 1fr); } .ld-calc__in { border-inline-end: 0; border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-surface); } }
  /* taqqoslash jadvali */
  /* position: relative — ichidagi yashirin (fx-sr-only, absolute) matn konteynerdan qochib sahifani kengaytirmasin */
  .ld-cmp-table { position: relative; margin-block-start: var(--fx-space-6); overflow-x: auto; border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); }
  .ld-cmp-table .fx-table { min-inline-size: calc(var(--fx-space-12) * 14); }
  .ld-cmp-table th[scope="row"] { font-weight: 500; text-align: start; }
  .ld-cmp-table td, .ld-cmp-table thead th:not(:first-child) { text-align: center; }
  .ld-cmp-table .ld-us { background: var(--fx-bg-brand-subtle); font-weight: 600; }
  .ld-yes { display: inline-grid; place-items: center; color: var(--fx-fg-success); }
  .ld-yes svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .ld-no { color: var(--fx-text-disabled); }
  .ld-vs-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--fx-space-12) * 4.5)), 1fr)); gap: var(--fx-space-3); margin-block-start: var(--fx-space-6); }
  .ld-vs-link { display: flex; align-items: center; gap: var(--fx-space-2); padding: var(--fx-space-4); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); color: inherit; text-decoration: none; transition: border-color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-vs-link:hover { border-color: var(--fx-border-color-strong); }
  .ld-vs-link span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .ld-vs-link svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); margin-inline-start: auto; color: var(--fx-text-tertiary); }
  .ld-src { margin: var(--fx-space-4) 0 0; max-inline-size: 90ch; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); line-height: 1.6; }
  .ld-src a { color: inherit; }
  .ld-vs-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-8); }
  .ld-vs-card { display: grid; align-content: start; gap: var(--fx-space-2); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); }
  .ld-vs-card--us { border: var(--fx-border-width-focus) solid var(--fx-bg-brand-solid); }
  .ld-vs-card h2 { margin: 0; font-size: var(--fx-font-size-lg); }
  .ld-vs-card p { margin: 0; color: var(--fx-text-secondary); line-height: 1.6; }
  @media (max-width: 839.98px) { .ld-vs-duo { grid-template-columns: minmax(0, 1fr); } }
  /* liboslar: shakl va chegara tugmalari — butun sahifani kiyintiradi */
  .ld-look { display: flex; flex-wrap: wrap; gap: var(--fx-space-4) var(--fx-space-8); margin-block-start: var(--fx-space-6); }
  .ld-look { align-items: start; }
  .ld-look__ctl { display: grid; align-content: start; gap: var(--fx-space-2); justify-items: start; max-inline-size: 100%; }
  .ld-look__ctl > span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-xs); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
  .ld-look__ctl > small { max-inline-size: 46ch; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); line-height: 1.5; }
  .ld-look .fx-segment { max-inline-size: 100%; overflow-x: auto; }
  /* ---------- «FoxUI vs …» sahifalari (scripts/site-vs.mjs): B duel + A hukm + benchmark ---------- */
  .tv-h { margin: 0; font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(var(--fx-font-size-xl), 2.6vw, var(--fx-font-size-display-sm)); line-height: 1.12; letter-spacing: -0.02em; text-wrap: balance; }
  .tv-center { text-align: center; }
  .tv-p { margin: var(--fx-space-4) 0 0; max-inline-size: 52ch; color: var(--fx-text-secondary); font-size: var(--fx-font-size-lg); line-height: 1.55; }
  .tv-chip { display: inline-flex; padding: var(--fx-space-1) var(--fx-space-3); border-radius: var(--fx-radius-pill); background: var(--fx-bg-muted); color: var(--fx-text-secondary); font-size: var(--fx-font-size-xs); }
  .tv-mark { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-xl); font-weight: 700; letter-spacing: -0.02em; color: var(--fx-text-primary); }
  .tv-mark--them { color: var(--fx-text-secondary); font-weight: 600; }
  .tv-yes, .tv-no { display: inline-grid; place-items: center; flex: none; inline-size: var(--fx-space-6); aspect-ratio: 1; border-radius: var(--fx-radius-circle); }
  .tv-yes { background: var(--fx-bg-success-subtle); color: var(--fx-fg-success); }
  .tv-dot { display: inline-grid; place-items: center; inline-size: var(--fx-space-6); aspect-ratio: 1; }
  .tv-dot::before { content: ""; inline-size: var(--fx-space-2); aspect-ratio: 1; border-radius: var(--fx-radius-circle); background: var(--fx-border-color-strong); }
  .tv-no { background: var(--fx-bg-muted); color: var(--fx-text-tertiary); }
  .tv-yes svg, .tv-no svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .tv-cta { justify-content: center; margin-block-start: var(--fx-space-10); }
  .tv-note { margin: var(--fx-space-4) 0 0; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); text-align: center; }
  .tv-center-block { display: grid; justify-items: center; text-align: center; }
  .tv-center-block > .ld-kicker { margin-block-end: var(--fx-space-3); } /* yorliq sarlavhaga yopishmasin (Ustoz 21.10) */
  .tv-center-block .ld-sub { margin-inline: auto; }

  /* hukm (ClickUp «verdict»): chapda xulosa, oʻngda 4 sabab */
  .tv-verdict { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--fx-space-12); margin-block: var(--fx-space-12); padding-block: var(--fx-space-10); border-block: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .tv-reasons { display: grid; margin: 0; padding: 0; list-style: none; counter-reset: tv; }
  .tv-reasons li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--fx-space-1) var(--fx-space-4); padding-block: var(--fx-space-5); border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-default); counter-increment: tv; }
  .tv-reasons li:first-child { padding-block-start: 0; }
  .tv-reasons li::before { content: "0" counter(tv); grid-row: span 2; color: var(--fx-text-brand); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-sm); font-weight: 600; }
  .tv-reasons b { font-size: var(--fx-font-size-lg); }
  .tv-reasons span { color: var(--fx-text-secondary); line-height: 1.55; }
  @media (max-width: 839.98px) { .tv-verdict { grid-template-columns: minmax(0, 1fr); gap: var(--fx-space-8); } }
  .tv-sec-head { display: grid; justify-items: center; gap: var(--fx-space-3); margin-block-end: var(--fx-space-8); text-align: center; }


  /* B · Duel — oʻz kartamiz koʻtarilgan, raqib xira; raqamlar chiziq bilan */
  .tv-b-bg { background: radial-gradient(70% 50% at 50% 0%, var(--fx-bg-brand-subtle), transparent 70%); }
  .tv-b { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; margin-block-start: var(--fx-space-10); }
  .tv-b ul { display: grid; margin: 0; padding: 0; list-style: none; }
  .tv-b li, .tv-b__labels li { display: grid; align-content: center; min-block-size: calc(var(--fx-space-12) * 1.55); }
  .tv-b__cap { display: grid; place-items: center; margin: 0; min-block-size: calc(var(--fx-space-12) * 1.4); }
  .tv-b__labels { padding-block-start: var(--fx-space-6) !important; }
  .tv-b__labels li { padding-inline-end: var(--fx-space-4); border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .tv-b__labels li.tv-b__cap { min-block-size: calc(var(--fx-space-12) * 1.4); border: 0; }
  .tv-b__us, .tv-b__them { display: grid; border-radius: var(--fx-radius-overlay); }
  .tv-b__us { position: relative; z-index: 1; padding: var(--fx-space-6) var(--fx-space-6) var(--fx-space-8); border: var(--fx-border-width-focus) solid var(--fx-bg-brand-solid); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-lg); }
  .tv-b__them { margin-block-start: var(--fx-space-6); padding: 0 var(--fx-space-6) var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-inline-start: 0; border-radius: 0 var(--fx-radius-overlay) var(--fx-radius-overlay) 0; background: color-mix(in oklab, var(--fx-bg-surface) 55%, transparent); color: var(--fx-text-tertiary); }
  .tv-b li { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--fx-space-3); border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .tv-b li:last-child { border-block-end: 0; }
  .tv-b__ico { grid-row: span 2; }
  .tv-b li b { font-size: var(--fx-font-size-md); }
  .tv-b li small { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .tv-b__them li b { color: var(--fx-text-secondary); font-weight: 500; }
  .tv-b__us > .fx-btn { justify-self: stretch; margin-block-start: var(--fx-space-6); }
  @media (max-width: 839.98px) { .tv-b { grid-template-columns: minmax(0, 1fr); gap: var(--fx-space-4); } .tv-b__labels { display: none !important; } .tv-b__them { margin: 0; padding-block-start: var(--fx-space-2); border-inline-start: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-overlay); } }

  .tv-b__labels small { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); line-height: 1.4; }
  .vs-sr { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  @media (max-width: 839.98px) { .vs-sr { position: static; display: block; inline-size: auto; block-size: auto; clip-path: none; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); font-weight: 500; } }
  /* benchmark (CPU/AI taqdimotlari): qorongʻi sahna, bitta katta koʻpaytma, FoxUI chizigʻi yorqin va nurli, raqiblar kulrang.
     Chiziq uzunligi — qiymatga aynan proporsional (Ustoz 19.10: nisbat buzilmasin); koʻrinishga kirganda chapdan toʻladi */
  .vs-bench { --_ink: var(--fx-color-neutral-50); --_dim: color-mix(in oklab, var(--fx-color-neutral-50) 62%, transparent); --_line: color-mix(in oklab, var(--fx-color-neutral-50) 12%, transparent);
    padding-block: calc(var(--fx-space-12) * 1.6); background: radial-gradient(60% 55% at 50% 0%, color-mix(in oklab, var(--fx-bg-brand-solid) 32%, transparent), transparent 70%), var(--fx-color-neutral-950); color: var(--_ink); }
  .vs-bench .ld-kicker { color: color-mix(in oklab, var(--fx-bg-brand-solid) 45%, var(--_ink)); }
  .vs-bench .ld-sub, .vs-bench .tv-note { color: var(--_dim); }
  .vs-bench__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--fx-space-12) * 6.5)), 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-10); }
  .vs-bench__card { display: grid; align-content: start; gap: var(--fx-space-4); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--_line); border-radius: var(--fx-radius-overlay); background: color-mix(in oklab, var(--fx-color-neutral-50) 4%, transparent); }
  .vs-bench__t { margin: 0; color: var(--_dim); font-size: var(--fx-font-size-sm); font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; }
  .vs-bench__big { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--fx-space-1) var(--fx-space-3); margin: 0; }
  .vs-bench__big b { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(calc(var(--fx-font-size-display-sm) * 1.3), 5.5vw, calc(var(--fx-font-size-display-sm) * 2)); font-weight: 700; line-height: 1; letter-spacing: -0.04em; font-variant-numeric: tabular-nums;
    background: linear-gradient(100deg, var(--_ink) 10%, color-mix(in oklab, var(--fx-bg-brand-solid) 55%, var(--_ink))); background-clip: text; color: transparent; }
  .vs-bench__big span { color: var(--_dim); font-size: var(--fx-font-size-md); }
  .vs-bench__bars { display: grid; gap: var(--fx-space-3); margin: 0; padding: 0; list-style: none; }
  .vs-bench__bars li { display: grid; grid-template-columns: minmax(0, 7.5em) minmax(0, 1fr) 4.5em; align-items: center; gap: var(--fx-space-3); color: var(--_dim); font-size: var(--fx-font-size-sm); }
  .vs-bench__nom { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .vs-bench__bars b { font-variant-numeric: tabular-nums; font-weight: 500; text-align: end; white-space: nowrap; }
  .vs-bench__track { display: block; block-size: var(--fx-space-3); border-radius: var(--fx-radius-pill); background: var(--_line); }
  .vs-bench__track i { display: block; inline-size: var(--w); min-inline-size: var(--fx-space-1); block-size: 100%; border-radius: inherit; background: color-mix(in oklab, var(--fx-color-neutral-50) 34%, transparent); transform-origin: left; }
  .vs-bench__bars li.is-us { color: var(--_ink); font-weight: 600; }
  .vs-bench__bars li.is-us b { font-weight: 700; }
  /* FoxUI chizigʻi boshqalar bilan bir xil qalinlikda — farq faqat rangda (Ustoz 21.10: «semirib ketgan»), porlash yoʻq */
  .vs-bench__bars li.is-us i { background: linear-gradient(90deg, var(--fx-bg-brand-solid), color-mix(in oklab, var(--fx-bg-brand-solid) 50%, var(--_ink))); }
  .vs-bench__note { margin: 0; color: var(--_dim); font-size: var(--fx-font-size-xs); }
  @supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) { .vs-bench__track i { animation: vs-fill linear both; animation-timeline: view(); animation-range: entry 10% cover 45%; } }
  }
  @keyframes vs-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  /* «faqat FoxUI'da» roʻyxati, har raqib kartasi */
  .vs-only { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); margin: var(--fx-space-6) 0 0; padding: 0; list-style: none; }
  .vs-only li { display: inline-flex; align-items: center; gap: var(--fx-space-2); padding: var(--fx-space-2) var(--fx-space-4); border-radius: var(--fx-radius-pill); background: var(--fx-bg-brand-subtle); color: var(--fx-text-brand); font-weight: 600; font-size: var(--fx-font-size-sm); }
  .vs-only svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .vs-each { margin-block-start: var(--fx-space-12); }
  .vs-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--fx-space-12) * 5.5)), 1fr)); gap: var(--fx-space-4); }
  .vs-card { display: grid; align-content: start; gap: var(--fx-space-2); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); color: inherit; text-decoration: none; transition: translate var(--fx-motion-fast) var(--fx-ease-standard), box-shadow var(--fx-motion-fast) var(--fx-ease-standard); }
  .vs-card:hover { translate: 0 calc(var(--fx-space-1) * -1); box-shadow: var(--fx-shadow-lg); }
  .vs-card__k { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); text-transform: uppercase; letter-spacing: 0.06em; }
  .vs-card b { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-xl); }
  .vs-card__p { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); line-height: 1.5; }
  .vs-card__p em { font-style: normal; color: var(--fx-text-tertiary); }
  .vs-card__s { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); font-variant-numeric: tabular-nums; }
  .vs-card__go { display: inline-flex; align-items: center; gap: var(--fx-space-1); margin-block-start: var(--fx-space-2); color: var(--fx-text-brand); font-weight: 600; font-size: var(--fx-font-size-sm); }
  .vs-card__go svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  .vs-others { margin-block-start: var(--fx-space-10); }
  /* bosh sahifadagi «FoxUI vs hammasi» (qorongʻi sahnada) */
  .vs-only--dark { justify-content: center; margin-block-start: var(--fx-space-8); }
  .vs-only--dark li { background: color-mix(in oklab, var(--fx-bg-brand-solid) 22%, transparent); color: var(--_ink); }
  .vs-only--dark svg { color: color-mix(in oklab, var(--fx-bg-brand-solid) 45%, var(--_ink)); }
  .ld-vs-home .tv-cta { margin-block-start: var(--fx-space-8); }
  .vs-home-links { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--fx-space-2) var(--fx-space-6); margin-block-start: var(--fx-space-6); font-size: var(--fx-font-size-sm); }
  .vs-home-links a { color: var(--_dim); text-decoration: underline; text-decoration-color: color-mix(in oklab, var(--_ink) 25%, transparent); text-underline-offset: 0.25em; }
  .vs-home-links a:hover { color: var(--_ink); }
  /* Framer'dan: «FoxUI / Raqib ⌄» almashtirgich */
  .vs-switch { display: inline-flex; align-items: center; gap: var(--fx-space-2); margin-block-end: var(--fx-space-5); font-weight: 600; }
  .vs-switch__us { display: inline-flex; align-items: center; gap: var(--fx-space-2); }
  .vs-switch__us svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .vs-switch__sep { color: var(--fx-text-tertiary); font-weight: 400; }
  .vs-switch__btn { display: inline-flex; align-items: center; gap: var(--fx-space-1); padding: var(--fx-space-1) var(--fx-space-2); border: 0; border-radius: var(--fx-radius-control); background: none; color: var(--fx-text-primary); font: inherit; cursor: pointer; transition: background-color var(--fx-motion-fast) var(--fx-ease-standard); }
  .vs-switch__btn:hover, .vs-switch__btn:focus-visible { background: var(--fx-bg-muted); }
  .vs-switch__btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); color: var(--fx-text-tertiary); }
  .vs-switch .fx-menu__item { justify-content: space-between; }
  .vs-switch .fx-menu__item svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); color: var(--fx-text-brand); }
  /* Framer'dan: jonli koʻrinishli 2×2 bento — tepada kichik sahna, ostida sarlavha ↗ va ikki gap */
  .vs-bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-overlay); overflow: hidden; }
  .vs-bento__card { display: grid; align-content: start; gap: var(--fx-space-2); padding: var(--fx-space-6) var(--fx-space-6) var(--fx-space-8); border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .vs-bento__card:nth-child(odd) { border-inline-end: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .vs-bento__card:nth-last-child(-n+2) { border-block-end: 0; }
  .vs-bento__vis { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; align-content: center; gap: var(--fx-space-2); min-block-size: calc(var(--fx-space-12) * 4.2); margin-block-end: var(--fx-space-4); padding: var(--fx-space-5); border-radius: var(--fx-radius-surface); background: radial-gradient(70% 80% at 50% 100%, var(--fx-bg-brand-subtle), transparent 70%), var(--fx-bg-subtle); }
  .vs-bento__card h3 { display: inline-flex; align-items: center; gap: var(--fx-space-2); margin: 0; font-size: var(--fx-font-size-lg); }
  .vs-bento__card h3 svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); color: var(--fx-text-tertiary); transition: translate var(--fx-motion-fast) var(--fx-ease-standard); }
  .vs-bento__card:hover h3 svg { translate: var(--fx-space-1) 0; color: var(--fx-text-brand); }
  .vs-bento__card p { margin: 0; max-inline-size: 46ch; color: var(--fx-text-secondary); line-height: 1.55; }
  .vs-vis-stack code { flex-basis: 100%; text-align: center; margin-block-start: var(--fx-space-2); color: var(--fx-text-tertiary); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-sm); }
  .vs-vis-stack .fx-chip { pointer-events: none; }
  .vs-vis-themes { gap: var(--fx-space-3); }
  .vs-mini { display: grid; justify-items: start; gap: var(--fx-space-2); padding: var(--fx-space-3); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-sm); }
  .vs-mini i { inline-size: calc(var(--fx-space-12) * 1.6); block-size: var(--fx-space-2); border-radius: var(--fx-radius-badge); background: var(--fx-bg-brand-subtle); }
  .vs-mini .fx-btn { pointer-events: none; }
  .vs-mini:nth-child(2) { translate: 0 calc(var(--fx-space-3) * -1); }
  .vs-term { inline-size: 100%; margin: 0; background: var(--fx-color-neutral-950); color: var(--fx-color-neutral-200); font-size: var(--fx-font-size-sm); line-height: 1.7; white-space: pre-wrap; }
  /* «Tirik tizim» — haftalik yoʻl qatorma-qator pastga (Ustoz 19.10): kun belgisi, chiziq bilan bogʻlangan, oxirgisi — chiqish */
  .vs-vis-week { display: grid; gap: 0; inline-size: min(100%, calc(var(--fx-space-12) * 6)); }
  .vs-day { position: relative; display: grid; grid-template-columns: var(--fx-space-8) minmax(0, 1fr); align-items: center; gap: var(--fx-space-3); padding-block: var(--fx-space-1); }
  .vs-day:not(:last-child)::after { content: ""; position: absolute; inset-inline-start: calc(var(--fx-space-8) / 2 - var(--fx-border-width-default) / 2); inset-block: calc(50% + var(--fx-space-4)) calc(-50% + var(--fx-space-4)); inline-size: var(--fx-border-width-default); background: var(--fx-border-color-strong); }
  .vs-day b { display: grid; place-items: center; inline-size: var(--fx-space-8); aspect-ratio: 1; border: var(--fx-border-width-default) solid var(--fx-border-color-strong); border-radius: var(--fx-radius-circle); background: var(--fx-bg-surface); color: var(--fx-text-secondary); font-size: var(--fx-font-size-xs); }
  .vs-day small { font-size: var(--fx-font-size-sm); }
  .vs-day.is-done b { border-color: transparent; background: var(--fx-bg-brand-solid); color: var(--fx-text-on-brand); }
  .vs-day.is-done small { color: var(--fx-text-brand); font-weight: var(--fx-font-weight-semibold); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); }
  @media (max-width: 839.98px) { .vs-bento { grid-template-columns: minmax(0, 1fr); } .vs-bento__card:nth-child(odd) { border-inline-end: 0; } .vs-bento__card:nth-last-child(2) { border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-default); } }
  /* Framer'dan: qisqa javob ikki tomonlama va FAQ */
  .vs-short { display: grid; gap: var(--fx-space-4); margin-block-start: calc(var(--fx-space-12) * 1.5); }
  .vs-short__two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-4); }
  .vs-short__two article { display: grid; gap: var(--fx-space-2); padding: var(--fx-space-6); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-surface); }
  .vs-short__two article p { margin: 0; color: var(--fx-text-secondary); line-height: 1.55; }
  .vs-short__two b { font-size: var(--fx-font-size-lg); }
  .vs-short .vs-short__us { border-color: var(--fx-bg-brand-solid); background: var(--fx-bg-brand-subtle); }
  .vs-short .vs-short__us b { color: var(--fx-text-brand); }
  .vs-faq { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--fx-space-10); margin-block-start: calc(var(--fx-space-12) * 1.5); }
  @media (max-width: 839.98px) { .vs-short__two, .vs-faq { grid-template-columns: minmax(0, 1fr); gap: var(--fx-space-4); } }
  .tv-b__labels li { grid-template-columns: minmax(0, 1fr); align-content: center; gap: 0; }
  .vs-after-bench > .ld-wrap > .tv-verdict:first-child { margin-block-start: 0; padding-block-start: 0; border-block-start: 0; }
  /* 4 karta — 2×2, 5 karta — 3 + 2 (yetim karta qolmasin) */
  @media (min-width: 840px) {
    .vs-bench__grid[data-n="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vs-bench__grid[data-n="5"] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .vs-bench__grid[data-n="5"] > * { grid-column: span 2; }
    .vs-bench__grid[data-n="5"] > :nth-child(n+4) { grid-column: span 3; }
  }
  /* galereya progresslari: asta toʻlish (site.js qiymat beradi) */
  .ld-theme .fx-progress::before, .ld-theme .fx-progress::after { transition-duration: calc(var(--fx-motion-base) * 7); }
  /* liboslar «lupa» infografikasi: chapda tugmalar va raqamli izohlar, oʻngda kattalashtirilgan blok va nuqtalar */
  /* Libos koʻrgazmasiga havola (Ustoz 21.10: koʻrgazma — /liboslar/korgazma/, bosh sahifaga sigʻmaydi) */
  .ld-roomcta { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--fx-space-5); margin-block-start: var(--fx-space-8); padding: var(--fx-space-5) var(--fx-space-6); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); color: var(--fx-text-primary); text-decoration: none; transition: translate var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-roomcta:hover { translate: 0 calc(var(--fx-space-1) * -1); }
  .ld-roomcta:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-focus); }
  .ld-roomcta__ics { display: flex; }
  .ld-roomcta__ics > i { flex: none; display: grid; place-items: center; inline-size: var(--fx-space-10); block-size: var(--fx-space-10); margin-inline-start: calc(var(--fx-space-2) * -1); border: var(--fx-border-width-focus) solid var(--fx-bg-surface); border-radius: var(--fx-radius-circle); background: var(--fx-bg-subtle); color: var(--fx-text-secondary); }
  .ld-roomcta__ics > i:first-child { margin-inline-start: 0; }
  .ld-roomcta__ics svg { inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); }
  .ld-roomcta__t { display: grid; gap: var(--fx-space-1); min-inline-size: 0; }
  .ld-roomcta__t b { font-size: var(--fx-font-size-lg); }
  .ld-roomcta__t small { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .ld-roomcta .fx-btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  @media (max-width: 839.98px) { .ld-roomcta { grid-template-columns: minmax(0, 1fr); } .ld-roomcta .fx-btn { justify-self: start; } }
  /* Shakl va chegara (Ustoz 21.10: «raqamli roʻyxatni tushunishmaydi — ikonli tugma; namuna oʻta goʻzal boʻlsin»):
     chapda ikonli plitkalar (burchak shakli va chegara sxemasi chizilgan), oʻngda jonli sayohat kartasi — hamma qismi libosdan */
  .ld-shps-g { display: grid; gap: var(--fx-space-2); }
  .ld-shps-g__k { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); font-weight: var(--fx-font-weight-semibold); letter-spacing: 0.06em; text-transform: uppercase; }
  .ld-shps { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(var(--fx-space-12) * 2), 1fr)); gap: var(--fx-space-2); }
  .ld-shp { display: grid; justify-items: center; gap: var(--fx-space-2); padding: var(--fx-space-4) var(--fx-space-2) var(--fx-space-3); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); color: var(--fx-text-secondary); font: inherit; font-size: var(--fx-font-size-sm); font-weight: var(--fx-font-weight-medium); cursor: pointer; transition: border-color var(--fx-motion-fast) var(--fx-ease-standard), color var(--fx-motion-fast) var(--fx-ease-standard), scale var(--fx-motion-instant) var(--fx-ease-standard); }
  .ld-shp:hover { border-color: var(--fx-border-color-strong); color: var(--fx-text-primary); }
  .ld-shp:active { scale: var(--fx-motion-press); }
  .ld-shp:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-default); }
  .ld-shp[aria-pressed="true"] { border-color: var(--fx-bg-brand-solid); outline: var(--fx-border-width-default) solid var(--fx-bg-brand-solid); outline-offset: calc(var(--fx-border-width-default) * -2); color: var(--fx-text-brand); }
  .ld-shp__ic { inline-size: var(--fx-space-10); block-size: var(--fx-space-10); }
  .ld-shp__ic > svg { display: block; inline-size: 100%; block-size: 100%; }
  /* sinov maydonida oʻng oyna — sayohat kartasi sahnasi (avvalgi «Shakl va chegara» boʻlimidan) */
  .ld-play__demo:has(> .ld-anat__stage) { display: grid; padding: 0; background: none; box-shadow: none; }
  /* oʻng oyna chap ustun balandligigacha toʻladi (Ustoz 21.10), karta markazda; plitka guruhlari ham boshqa boshqaruvlar kabi oraliq bilan */
  .ld-play:has(.ld-anat__stage) { align-items: stretch; }
  .ld-play__ctl > .ld-shps-g { margin-block-start: var(--fx-space-5); }
  /* oʻng oyna foni tepadan va pastdan qirqilgan — «Tizimsiz» tasmasiga tegmaydi (Ustoz 24.10); sahna grid ichida oʻzi choʻziladi */
  .ld-play__demo:has(> .ld-anat__stage) { padding-block: var(--fx-space-10); }
  /* chegara qatori — ikon va matn yonma-yon (Ustoz 21.10) */
  .ld-shps[data-row] .ld-shp { grid-template-columns: auto auto; justify-content: center; align-items: center; gap: var(--fx-space-3); padding: var(--fx-space-3) var(--fx-space-4); }
  .ld-shps[data-row] .ld-shp__ic { inline-size: var(--fx-space-8); block-size: var(--fx-space-8); }
  .ld-anat__stage { display: grid; place-items: center; padding: var(--fx-space-10) var(--fx-space-8); border-radius: var(--fx-radius-overlay); background: radial-gradient(60% 70% at 80% 10%, var(--fx-bg-brand-subtle), transparent 70%), radial-gradient(50% 60% at 10% 100%, var(--fx-bg-category-yellow-subtle), transparent 70%), var(--fx-bg-subtle); }
  /* sayohat kartasi */
  .ld-trip { display: grid; inline-size: 100%; max-inline-size: calc(var(--fx-space-12) * 8); padding: var(--fx-space-2); overflow: hidden; transition: border-radius var(--fx-motion-base) var(--fx-ease-standard); }
  .ld-trip__img { position: relative; aspect-ratio: 2.1; overflow: hidden; border-radius: calc(var(--fx-radius-surface) - var(--fx-space-1)); background: linear-gradient(180deg, color-mix(in oklab, var(--fx-bg-brand-solid) 28%, var(--fx-color-pastel-yellow)) 0%, var(--fx-color-pastel-yellow) 55%, var(--fx-color-pastel-coral) 100%); }
  .ld-trip__img > svg { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; }
  .ld-trip__sun { fill: var(--fx-bg-static-light); opacity: 0.85; }
  .ld-trip__far { fill: color-mix(in oklab, var(--fx-bg-brand-solid) 25%, var(--fx-color-pastel-coral)); opacity: 0.45; }
  .ld-trip__near { fill: color-mix(in oklab, var(--fx-bg-brand-solid) 55%, var(--fx-color-pastel-coral)); opacity: 0.92; }
  .ld-trip__arch { fill: var(--fx-color-pastel-yellow); opacity: 0.9; }
  .ld-trip__tag { position: absolute; inset-block-start: var(--fx-space-3); inset-inline-start: var(--fx-space-3); background: var(--fx-bg-surface); }
  .ld-trip__fav { position: absolute; inset-block-start: var(--fx-space-2); inset-inline-end: var(--fx-space-2); background: var(--fx-bg-surface); }
  .ld-trip__body { display: grid; gap: var(--fx-space-3); padding: var(--fx-space-4) var(--fx-space-3) var(--fx-space-3); }
  .ld-trip__head { display: flex; align-items: start; justify-content: space-between; gap: var(--fx-space-3); }
  .ld-trip__head > div { display: grid; gap: calc(var(--fx-space-1) / 2); }
  .ld-trip__t { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: var(--fx-font-size-lg); }
  .ld-trip__r { color: var(--fx-fg-warning); font-size: var(--fx-font-size-sm); font-weight: var(--fx-font-weight-semibold); }
  .ld-trip__r small { color: var(--fx-text-tertiary); font-weight: var(--fx-font-weight-regular); }
  .ld-trip__price { display: grid; justify-items: end; line-height: 1.1; }
  .ld-trip__price b { font-size: var(--fx-font-size-lg); font-variant-numeric: tabular-nums; }
  .ld-trip__price small { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-trip__chips { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  .ld-trip__inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--fx-space-3); padding: var(--fx-space-3) var(--fx-space-4); box-shadow: none; }
  .ld-trip__inner span { display: grid; gap: calc(var(--fx-space-1) / 2); font-size: var(--fx-font-size-sm); }
  .ld-trip__inner small { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .ld-trip__act { display: grid; grid-template-columns: 1.6fr 1fr; gap: var(--fx-space-2); }
  @media (max-width: 599.98px) { .ld-anat__stage { padding: var(--fx-space-5) var(--fx-space-3); } .ld-shps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  /* FoxUI'da ishlayotgan loyihalar — logotiplar sekin oqadi (fx-marquee, data-speed) */
  /* logotiplar qatori — sahifa fonida (Ustoz 20.10: «oq blok qoʻyishdan ma'no yoʻq, shundoq ham light fonda turibdi») */
  .ld-logos { display: grid; justify-items: center; gap: var(--fx-space-5); padding-block: var(--fx-space-10); }
  /* sarlavha — boʻlim sarlavhasidek (Ustoz 19.10); logotiplar ustiga kelganda ham toʻxtamaydi (data-pause="none") */
  .ld-logos__h { margin: 0; padding-inline: var(--fx-space-4); color: var(--fx-text-primary); font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(var(--fx-font-size-xl), 2.4vw, var(--fx-font-size-display-sm)); font-weight: var(--fx-font-weight-semibold); line-height: 1.2; letter-spacing: -0.02em; text-align: center; text-wrap: balance; }
  /* haqiqiy loyihalar soni — rangli, koʻrinishga kirganda sanab chiqadi (Ustoz 21.10; oʻz-oʻzidan oshib boradigan soxta son emas) */
  .ld-logos__n { display: inline-block; margin-inline-start: var(--fx-space-2); padding: 0 var(--fx-space-4); border-radius: var(--fx-radius-pill); background: var(--fx-bg-brand-subtle); color: var(--fx-text-brand); font-variant-numeric: tabular-nums; }
  .ld-logos .fx-marquee { inline-size: 100%; mask-image: linear-gradient(90deg, transparent, black 12%, black 88%, transparent); }
  .ld-logos .fx-marquee__track { align-items: center; }
  .ld-logos li { display: grid; place-items: center; padding-inline: var(--fx-space-6); }
  .ld-logo { display: block; inline-size: auto; block-size: calc(var(--fx-space-1) * var(--_h, 8)); max-inline-size: none; }
  .ld-logo--dark { display: none; }
  [data-fx-scheme="dark"] .ld-logo--light { display: none; }
  [data-fx-scheme="dark"] .ld-logo--dark { display: block; }
  .ld-logos__more { display: inline-flex; align-items: center; gap: var(--fx-space-1); color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); text-decoration: none; }
  .ld-logos__more:hover { color: var(--fx-text-primary); }
  .ld-logos__more svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); transition: translate var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-logos__more:hover svg { translate: calc(var(--fx-space-1) / 2) 0; }

  /* ---------- «Standart holatda sayqallangan» — jonli kichik namunalar toʻri (Ustoz 20.10) ---------- */
  .ld-pol .ld-h2 { max-inline-size: 26ch; }
  .ld-h2__dim { color: var(--fx-text-tertiary); }
  .ld-pol__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fx-space-5); margin-block-start: var(--fx-space-10); }
  @media (max-width: 1199.98px) { .ld-pol__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 599.98px) { .ld-pol__grid { grid-template-columns: minmax(0, 1fr); } }
  .ld-pol__card { display: grid; grid-template-rows: auto auto; overflow: hidden; border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); color: inherit; text-decoration: none; transition: border-color var(--fx-motion-fast) var(--fx-ease-standard), translate var(--fx-motion-fast) var(--fx-ease-standard), box-shadow var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-pol__card:hover { border-color: var(--fx-border-color-strong); box-shadow: var(--fx-shadow-md); translate: 0 calc(var(--fx-space-1) * -1); }
  .ld-pol__card:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-space-1); }
  /* namuna maydoni: qat'iy balandlik, pastga qarab soʻnadi */
  .ld-pol__demo { box-sizing: border-box; block-size: calc(var(--fx-space-12) * 5.5); overflow: hidden; padding: var(--fx-space-6) var(--fx-space-6) 0; background: linear-gradient(180deg, var(--fx-bg-subtle), var(--fx-bg-surface)); mask-image: linear-gradient(180deg, var(--fx-color-black) 72%, transparent); font-size: var(--fx-font-size-sm); }
  .ld-pol__foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 var(--fx-space-3); padding: var(--fx-space-4) var(--fx-space-5); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .ld-pol__foot b { font-weight: var(--fx-font-weight-semibold); }
  .ld-pol__foot span { grid-column: 1; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .ld-pol__foot svg { grid-column: 2; grid-row: 1 / span 2; inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); color: var(--fx-text-tertiary); transition: translate var(--fx-motion-fast) var(--fx-ease-standard), color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-pol__card:hover .ld-pol__foot svg { color: var(--fx-text-primary); translate: calc(var(--fx-space-1) / 2) calc(var(--fx-space-1) / -2); }
  .ld-pol__all { display: flex; justify-content: center; margin: var(--fx-space-8) 0 0; }
  .ld-pol__all .fx-btn svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  /* 1 — buyruqlar oynasi */
  .ld-pol__cmd { display: grid; gap: var(--fx-space-2); padding: var(--fx-space-2); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); box-shadow: var(--fx-shadow-lg); }
  .ld-pol__q { display: flex; align-items: center; gap: var(--fx-space-2); padding: var(--fx-space-2) var(--fx-space-3); border-block-end: var(--fx-border-width-default) solid var(--fx-border-color-default); color: var(--fx-text-primary); }
  .ld-pol__q svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); color: var(--fx-text-tertiary); }
  .ld-pol__q span { flex: 1; }
  .ld-pol__q span::after { content: ""; display: inline-block; inline-size: var(--fx-border-width-default); block-size: 1.1em; margin-inline-start: calc(var(--fx-space-1) / 2); vertical-align: text-bottom; background: var(--fx-text-brand); animation: ld-caret calc(var(--fx-duration-pulse) / 2) var(--fx-ease-standard) infinite alternate; }
  @keyframes ld-caret { to { opacity: 0; } }
  .ld-pol__cmd .fx-listbox { padding: 0; border: 0; box-shadow: none; background: none; }
  .ld-pol__cmd .fx-option svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  /* 2 — doska */
  .ld-pol__board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ld-pol__board [data-ld-lift] { rotate: -2deg; translate: calc(var(--fx-space-2) * -1) 0; box-shadow: var(--fx-shadow-lg); }
  /* 3 — koʻrsatkichlar */
  .ld-pol__stats { display: grid; gap: var(--fx-space-3); }
  .ld-pol__stats > .fx-stat { padding: var(--fx-space-4); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); }
  .ld-pol__two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fx-space-3); }
  /* 4 — filtrlar */
  .ld-pol__filters { display: grid; gap: var(--fx-space-3); }
  .ld-pol__chips { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  /* 5 — kun va vaqt */
  .ld-pol__agenda { display: grid; gap: var(--fx-space-4); }
  .ld-pol__agenda .fx-timeslots { inline-size: 100%; }
  /* 6 — jadval */
  .ld-pol__demo .fx-table { inline-size: 100%; }
  .ld-pol__who { display: inline-flex; align-items: center; gap: var(--fx-space-2); white-space: nowrap; }
  .ld-pol__sum { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
}

/* oz:boshi — «Oʻzingiz qursangiz» hisoblagichi va /mcp/ (Ustoz 21.10; scripts/site-ozingiz.mjs). Faqat tokenlar;
   chiziqlar koʻrinishga kirganda oʻsadi, raqamlar sanaladi; harakat oʻchiq boʻlsa — darhol. */
@layer fx.utilities {
  .oz-h1 { max-inline-size: 20ch; font-size: clamp(var(--fx-font-size-display-sm), 5vw, var(--fx-font-size-display-lg)); }
  .oz-big { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fx-space-4); margin-block-start: var(--fx-space-10); }
  .oz-big > div { display: grid; gap: var(--fx-space-1); padding: var(--fx-space-6); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); }
  .oz-big strong { font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(var(--fx-font-size-2xl), 5vw, var(--fx-font-size-display-md)); line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
  .oz-big span { color: var(--fx-text-secondary); }
  .oz-big .oz-big__us { background: var(--fx-bg-brand-solid); border-color: transparent; color: var(--fx-text-on-brand); }
  .oz-big .oz-big__us span { color: color-mix(in oklab, var(--fx-text-on-brand) 80%, transparent); }
  @media (max-width: 599.98px) { .oz-big { grid-template-columns: minmax(0, 1fr); } }

  .oz-calc { display: grid; gap: var(--fx-space-8); margin-block-start: var(--fx-space-8); padding: var(--fx-space-8); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-surface); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); }
  .oz-calc__ctl { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--fx-space-12) * 5)), 1fr)); gap: var(--fx-space-6); }
  .oz-ctl { display: grid; gap: var(--fx-space-2); align-content: start; }
  .oz-ctl__top { display: flex; justify-content: space-between; gap: var(--fx-space-3); color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .oz-ctl__top b { color: var(--fx-text-primary); font-variant-numeric: tabular-nums; }
  .oz-calc__ctl > * { min-inline-size: 0; }
  .oz-ctl .fx-segment { inline-size: 100%; max-inline-size: 100%; overflow-x: auto; scrollbar-width: none; }
  .oz-ctl .fx-segment__item { flex: 1; }

  .oz-lanes { display: grid; gap: var(--fx-space-5); }
  .oz-lane { display: grid; gap: var(--fx-space-2); }
  .oz-lane__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--fx-space-1) var(--fx-space-3); }
  .oz-lane__head span { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .oz-lane__row { display: grid; grid-template-columns: calc(var(--fx-space-12)) minmax(0, 1fr) calc(var(--fx-space-12) * 3.4); gap: var(--fx-space-3); align-items: center; }
  .oz-lane__k { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-xs); }
  .oz-lane__track { block-size: var(--fx-space-3); border-radius: var(--fx-radius-pill); background: var(--fx-bg-muted); overflow: hidden; }
  .oz-lane__track > i { display: block; block-size: 100%; inline-size: var(--w); border-radius: inherit; background: var(--fx-color-neutral-400); transition: inline-size var(--fx-motion-slow) var(--fx-ease-standard); }
  .oz-lane__track--pul > i { background: var(--fx-color-neutral-500); }
  .oz-lane--us .oz-lane__track > i { background: var(--fx-bg-brand-solid); }
  .oz-lane--us .oz-lane__head b { color: var(--fx-text-brand); }
  .oz-lane__row strong { font-variant-numeric: tabular-nums; text-align: end; white-space: nowrap; }
  .oz-lane__row small { color: var(--fx-text-tertiary); font-weight: var(--fx-font-weight-regular); }
  /* koʻrinishga kirguncha chiziqlar 0 dan oʻsadi */
  [data-oz-calc]:not([data-in]) .oz-lane__track > i { inline-size: 0; }
  @media (max-width: 599.98px) {
    .oz-calc { padding: var(--fx-space-5); }
    /* telefonda qiymat chiziq ustida — chiziqlar bir xil uzunlikda */
    .oz-lane__row { grid-template-columns: minmax(0, 1fr); gap: var(--fx-space-1); }
    .oz-lane__row strong { order: -1; text-align: start; }
    .oz-lane__k { display: none; }
  }

  .oz-token { display: grid; gap: var(--fx-space-3); padding-block-start: var(--fx-space-6); border-block-start: var(--fx-border-width-default) solid var(--fx-border-color-default); }
  .oz-token__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--fx-space-2); }
  .oz-token__head > span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .oz-token__bar { display: flex; block-size: var(--fx-space-4); border-radius: var(--fx-radius-pill); overflow: hidden; background: var(--fx-bg-muted); }
  .oz-token__bar > i { inline-size: var(--w); transition: inline-size var(--fx-motion-slow) var(--fx-ease-standard); }
  [data-oz-calc]:not([data-in]) .oz-token__bar > i { inline-size: 0; }
  .oz-token__kesh { background: var(--fx-color-neutral-300); }
  .oz-token__yangi { background: var(--fx-color-neutral-500); }
  .oz-token__chiq { background: var(--fx-bg-error-solid); }
  .oz-token__leg { display: flex; flex-wrap: wrap; gap: var(--fx-space-2) var(--fx-space-5); margin: 0; padding: 0; list-style: none; color: var(--fx-text-secondary); font-size: var(--fx-font-size-xs); }
  .oz-token__leg li { display: inline-flex; align-items: center; gap: var(--fx-space-2); }
  .oz-token__leg i { inline-size: var(--fx-space-3); block-size: var(--fx-space-3); border-radius: var(--fx-radius-circle); }

  .oz-verdict { display: grid; gap: var(--fx-space-3); justify-items: start; margin-block-start: var(--fx-space-8); padding: var(--fx-space-8); border-radius: var(--fx-radius-overlay); background: var(--fx-bg-brand-subtle); }
  .oz-verdict__big { margin: 0; font-family: var(--fx-font-family-display); font-size-adjust: var(--fx-font-adjust-display); font-size: clamp(var(--fx-font-size-xl), 4vw, var(--fx-font-size-display-sm)); font-weight: var(--fx-font-weight-semibold); color: var(--fx-text-brand); }
  .oz-verdict p { margin: 0; max-inline-size: 60ch; }
  .oz-verdict__cta { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); margin-block-start: var(--fx-space-2); }

  .oz-yana { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(var(--fx-space-12) * 7)), 1fr)); gap: var(--fx-space-3); margin: var(--fx-space-8) 0 0; padding: 0; list-style: none; }
  .oz-yana li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--fx-space-3); align-items: start; padding: var(--fx-space-4); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); }
  .oz-yana div { display: grid; gap: calc(var(--fx-space-1) / 2); }
  .oz-yana div span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .oz-yana strong { color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); white-space: nowrap; font-variant-numeric: tabular-nums; }
  .oz-yana__ok { display: grid; place-items: center; inline-size: var(--fx-space-6); block-size: var(--fx-space-6); border-radius: var(--fx-radius-circle); background: var(--fx-bg-success-subtle); color: var(--fx-fg-success); }
  .oz-yana__ok > svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); fill: currentColor; }
  .oz-yana[data-ld-reveal] li, .oz-vos[data-ld-reveal] li { opacity: 0; translate: 0 var(--fx-space-3); transition: opacity var(--fx-motion-slow) var(--fx-ease-standard), translate var(--fx-motion-slow) var(--fx-ease-standard); transition-delay: calc(var(--fx-duration-stagger) * var(--i)); }
  .oz-yana[data-in] li, .oz-vos[data-in] li { opacity: 1; translate: none; }

  .oz-usul { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--fx-space-12) * 6)), 1fr)); gap: var(--fx-space-4); margin-block: var(--fx-space-8); }
  .oz-usul > div { padding: var(--fx-space-5); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); }
  .oz-usul h3 { margin: 0 0 var(--fx-space-2); font-size: var(--fx-font-size-md); }
  .oz-usul p { margin: var(--fx-space-2) 0 0; color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .oz-izoh { margin: var(--fx-space-4) 0 0; color: var(--fx-text-tertiary); font-size: var(--fx-font-size-sm); }
  .oz-calc--mini { gap: var(--fx-space-6); }

  /* /mcp/ */
  .oz-mcp { display: grid; gap: var(--fx-space-4); margin-block-start: var(--fx-space-8); }
  .oz-mcp__tabs { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  .oz-mcp__tab { padding: var(--fx-space-2) var(--fx-space-4); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-control); background: var(--fx-bg-surface); color: var(--fx-text-secondary); font: inherit; font-weight: var(--fx-font-weight-medium); cursor: pointer; }
  .oz-mcp__tab[aria-selected="true"] { border-color: transparent; background: var(--fx-text-primary); color: var(--fx-bg-page); }
  .oz-mcp__tab:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-default); }
  .oz-mcp__joy { margin: 0 0 var(--fx-space-2); color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .oz-code { position: relative; }
  .oz-code pre { margin: 0; padding: var(--fx-space-5) calc(var(--fx-space-12) * 2.4) var(--fx-space-5) var(--fx-space-5); overflow-x: auto; border-radius: var(--fx-radius-surface); background: var(--fx-color-neutral-950); color: var(--fx-color-neutral-100); font-family: var(--fx-font-family-mono); font-size-adjust: var(--fx-font-adjust-mono); font-size: var(--fx-font-size-sm); line-height: 1.6; }
  .oz-code__copy { color: var(--fx-color-neutral-100); }
  .oz-code__copy:hover { background: color-mix(in oklab, var(--fx-color-neutral-100) 12%, transparent); }

  .oz-code__copy { position: absolute; inset-block-start: var(--fx-space-2); inset-inline-end: var(--fx-space-2); }
  .oz-vos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(var(--fx-space-12) * 6)), 1fr)); gap: var(--fx-space-3); margin: var(--fx-space-8) 0 0; padding: 0; list-style: none; }
  .oz-vos li { display: grid; gap: var(--fx-space-1); padding: var(--fx-space-5); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); }
  .oz-vos code { color: var(--fx-text-brand); font-size: var(--fx-font-size-sm); }
  .oz-vos span { color: var(--fx-text-secondary); font-size: var(--fx-font-size-sm); }
  .oz-prompts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(var(--fx-space-12) * 7)), 1fr)); gap: var(--fx-space-3); margin-block: var(--fx-space-8) var(--fx-space-4); }
  .oz-prompt { display: flex; gap: var(--fx-space-3); align-items: start; justify-content: space-between; padding: var(--fx-space-4) var(--fx-space-5); border-radius: var(--fx-radius-surface); background: var(--fx-bg-surface); border: var(--fx-border-width-default) solid var(--fx-border-color-surface); }
  .oz-prompt p { margin: 0; }
  @media (prefers-reduced-motion: reduce) { .oz-lane__track > i, .oz-token__bar > i, .oz-yana li, .oz-vos li { transition: none; } }
}
/* oz:oxiri */

/* Sinov maydoni: libos (tayyor xarakter) + rang mavzusi (libos ichidagi rang toʻplami) — Ustoz 24.10 */
@layer fx.utilities {
  .ld-ctl__izoh { color: var(--fx-text-tertiary); font-weight: var(--fx-font-weight-regular); text-transform: none; letter-spacing: 0; }
  .ld-libs { display: grid; grid-template-columns: repeat(auto-fill, minmax(calc(var(--fx-space-12) * 3.2), 1fr)); gap: var(--fx-space-2); }
  .ld-lib { display: grid; gap: var(--fx-space-1); align-content: start; padding: var(--fx-space-3); border: var(--fx-border-width-default) solid var(--fx-border-color-default); border-radius: var(--fx-radius-control); background: var(--fx-bg-surface); color: var(--fx-text-primary); font: inherit; text-align: start; cursor: pointer; transition: border-color var(--fx-motion-fast) var(--fx-ease-standard); }
  .ld-lib:hover { border-color: var(--fx-border-color-strong); }
  .ld-lib[aria-pressed="true"] { border-color: var(--fx-text-primary); box-shadow: var(--fx-shadow-sm); }
  .ld-lib:focus-visible, .ld-pal:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-focus); }
  .ld-lib b { font-size: var(--fx-font-size-sm); }
  .ld-lib small { color: var(--fx-text-secondary); font-size: var(--fx-font-size-xs); line-height: 1.4; }
  .ld-lib__pal, .ld-pal__sw { display: flex; overflow: hidden; border-radius: var(--fx-radius-badge); }
  .ld-lib__pal { block-size: var(--fx-space-3); margin-block-end: var(--fx-space-1); }
  .ld-lib__pal > i, .ld-pal__sw > i { flex: 1; }
  .ld-pals { display: flex; flex-wrap: wrap; gap: var(--fx-space-2); }
  .ld-pal { display: inline-grid; gap: var(--fx-space-1); justify-items: center; padding: var(--fx-space-2); border: var(--fx-border-width-default) solid transparent; border-radius: var(--fx-radius-control); background: none; color: var(--fx-text-secondary); font: inherit; font-size: var(--fx-font-size-xs); cursor: pointer; }
  .ld-pal__sw { inline-size: calc(var(--fx-space-12) * 1.2); block-size: var(--fx-space-6); outline: var(--fx-border-width-default) solid var(--fx-border-color-default); outline-offset: calc(var(--fx-border-width-default) * -1); }
  .ld-pal:hover { color: var(--fx-text-primary); }
  .ld-pal[aria-pressed="true"] { border-color: var(--fx-text-primary); color: var(--fx-text-primary); }
}