/* FoxUI tokenlari — avtomatik yaratilgan (scripts/build.mjs). Qo'lda tahrirlamang. */
@layer fx.reset, fx.tokens, fx.base, fx.components, fx.utilities;
@property --fx-knob-pill { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --fx-knob-density { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --fx-knob-depth { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --fx-knob-motion { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --fx-knob-blur { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --fx-knob-outline { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --fx-knob-field-fill { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --fx-knob-motion-press { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --fx-knob-motion-lift { syntax: "<number>"; inherits: true; initial-value: 0; }
@property --fx-knob-page-tint { syntax: "<number>"; inherits: true; initial-value: 0; }
@layer fx.tokens {
:root {
  --fx-color-gray-25: #FCFCFD;
  --fx-color-gray-50: #F9FAFB;
  --fx-color-gray-100: #F2F4F7;
  --fx-color-gray-200: #E4E7EC;
  --fx-color-gray-300: #D0D5DD;
  --fx-color-gray-400: #98A2B3;
  --fx-color-gray-500: #667085;
  --fx-color-gray-600: #475467;
  --fx-color-gray-700: #344054;
  --fx-color-gray-800: #1D2939;
  --fx-color-gray-900: #101828;
  --fx-color-gray-950: #0C111D;
  --fx-color-neutral-25: var(--fx-color-gray-25);
  --fx-color-neutral-50: var(--fx-color-gray-50);
  --fx-color-neutral-100: var(--fx-color-gray-100);
  --fx-color-neutral-200: var(--fx-color-gray-200);
  --fx-color-neutral-300: var(--fx-color-gray-300);
  --fx-color-neutral-400: var(--fx-color-gray-400);
  --fx-color-neutral-500: var(--fx-color-gray-500);
  --fx-color-neutral-600: var(--fx-color-gray-600);
  --fx-color-neutral-700: var(--fx-color-gray-700);
  --fx-color-neutral-800: var(--fx-color-gray-800);
  --fx-color-neutral-900: var(--fx-color-gray-900);
  --fx-color-neutral-950: var(--fx-color-gray-950);
  --fx-color-pastel-yellow: #F5D77E;
  --fx-color-pastel-pink: #F3BBD4;
  --fx-color-pastel-blue: #AECBF2;
  --fx-color-pastel-coral: #F4A688;
  --fx-color-pastel-green: #BEDDB2;
  --fx-color-pastel-purple: #CFC0F3;
  --fx-color-red-50: #FEF3F2;
  --fx-color-red-300: #FDA29B;
  --fx-color-red-600: #D92D20;
  --fx-color-red-700: #B42318;
  --fx-color-green-50: #ECFDF3;
  --fx-color-green-300: #75E0A7;
  --fx-color-green-700: #067647;
  --fx-color-amber-300: #FEC84B;
  --fx-color-amber-700: #B54708;
  --fx-color-white: #FFFFFF;
  --fx-color-black: #000000;
  --fx-color-brand-50: var(--fx-color-neutral-50);
  --fx-color-brand-300: var(--fx-color-neutral-300);
  --fx-color-brand-400: var(--fx-color-neutral-400);
  --fx-color-brand-500: var(--fx-color-neutral-500);
  --fx-color-brand-600: var(--fx-color-neutral-600);
  --fx-color-brand-700: var(--fx-color-neutral-700);
  --fx-space-1: 4px;
  --fx-space-2: 8px;
  --fx-space-3: 12px;
  --fx-space-4: 16px;
  --fx-space-5: 20px;
  --fx-space-6: 24px;
  --fx-space-8: 32px;
  --fx-space-12: 48px;
  --fx-font-family-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fx-font-family-display: var(--fx-font-family-sans);
  --fx-font-family-mono: ui-monospace, "SFMono-Regular", Consolas, monospace;
  --fx-font-size-xs: 12px;
  --fx-font-size-sm: 14px;
  --fx-font-size-md: 16px;
  --fx-font-size-lg: 18px;
  --fx-font-size-xl: 20px;
  --fx-font-size-2xl: 24px;
  --fx-font-weight-medium: 500;
  --fx-font-weight-semibold: 600;
  --fx-font-adjust-sans: ex-height 0.52;
  --fx-font-adjust-display: var(--fx-font-adjust-sans);
  --fx-font-adjust-mono: ex-height 0.52;
  --fx-duration-fast: 120ms;
  --fx-duration-base: 200ms;
  --fx-duration-slow: 360ms;
  --fx-duration-pulse: 1600ms;
  --fx-duration-spin: 800ms;
  --fx-duration-instant: 60ms;
  --fx-duration-slower: 500ms;
  --fx-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --fx-ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --fx-ease-spring: linear(0, 0.044, 0.149, 0.283, 0.424, 0.558, 0.677, 0.776, 0.856, 0.917, 0.961, 0.992, 1.011, 1.022, 1.027, 1.028, 1.027, 1.023, 1.019, 1.015, 1.012, 1.008, 1.006, 1.004, 1);
  --fx-text-primary: var(--fx-color-neutral-900);
  --fx-text-secondary: var(--fx-color-neutral-600);
  --fx-text-tertiary: var(--fx-color-neutral-500);
  --fx-text-disabled: var(--fx-color-neutral-400);
  --fx-text-on-brand: var(--fx-color-white);
  --fx-text-on-category: var(--fx-color-neutral-900);
  --fx-text-brand: var(--fx-color-neutral-900);
  --fx-text-on-error: var(--fx-color-white);
  --fx-text-on-static-light: var(--fx-color-neutral-900);
  --fx-bg-page: color-mix(in oklab, var(--fx-color-neutral-100) calc(var(--fx-knob-page-tint) * 100%), var(--fx-color-neutral-25));
  --fx-bg-surface: var(--fx-color-white);
  --fx-bg-subtle: var(--fx-color-neutral-50);
  --fx-bg-muted: var(--fx-color-neutral-100);
  --fx-bg-brand-solid: var(--fx-color-neutral-900);
  --fx-bg-brand-solid-hover: var(--fx-color-neutral-700);
  --fx-bg-error-subtle: var(--fx-color-red-50);
  --fx-bg-success-subtle: var(--fx-color-green-50);
  --fx-bg-category-yellow: var(--fx-color-pastel-yellow);
  --fx-bg-category-pink: var(--fx-color-pastel-pink);
  --fx-bg-category-blue: var(--fx-color-pastel-blue);
  --fx-bg-category-coral: var(--fx-color-pastel-coral);
  --fx-bg-category-green: var(--fx-color-pastel-green);
  --fx-bg-category-purple: var(--fx-color-pastel-purple);
  --fx-bg-category-purple-subtle: color-mix(in oklab, var(--fx-color-pastel-purple) 20%, var(--fx-bg-page));
  --fx-bg-brand-subtle: var(--fx-color-neutral-100);
  --fx-bg-error-solid: var(--fx-color-red-600);
  --fx-bg-static-light: var(--fx-color-neutral-25);
  --fx-fg-success: var(--fx-color-green-700);
  --fx-fg-warning: var(--fx-color-amber-700);
  --fx-fg-error: var(--fx-color-red-700);
  --fx-border-color-default: var(--fx-color-neutral-200);
  --fx-border-color-strong: var(--fx-color-neutral-300);
  --fx-border-color-focus: var(--fx-color-neutral-900);
  --fx-border-color-error: var(--fx-color-red-600);
  --fx-border-width-default: 1px;
  --fx-border-width-focus: 2px;
  --fx-shadow-color: var(--fx-color-neutral-900);
  --fx-knob-pill: 0;
  --fx-knob-density: 1;
  --fx-knob-depth: 1;
  --fx-knob-motion: 1;
  --fx-knob-blur: 1;
  --fx-knob-outline: 1;
  --fx-knob-field-fill: 0;
  --fx-knob-motion-press: 1;
  --fx-knob-motion-lift: 0;
  --fx-knob-page-tint: 0;
  --fx-radius-control: 8px;
  --fx-radius-surface: 12px;
  --fx-radius-overlay: 16px;
  --fx-radius-badge: 6px;
  --fx-radius-tag: var(--fx-radius-badge);
  --fx-radius-circle: 50%;
  --fx-radius-pill: 999px;
  --fx-size-control-sm: 36px;
  --fx-size-control-md: 44px;
  --fx-size-control-lg: 52px;
  --fx-size-min-target: 24px;
  --fx-size-touch-target: 44px;
  --fx-size-avatar-sm: 22px;
  --fx-size-avatar-md: 36px;
  --fx-size-avatar-lg: 56px;
  --fx-size-status-dot-sm: 8px;
  --fx-size-icon-sm: 16px;
  --fx-size-icon-md: 20px;
  --fx-size-icon-lg: 24px;
  --fx-motion-shift-sm: var(--fx-space-1);
  --fx-motion-shift-md: var(--fx-space-2);
  --fx-motion-scale-enter: 0.96;
  --fx-motion-scale-press: 0.97;
}
[data-fx-scheme="light"] {
  --fx-text-primary: var(--fx-color-neutral-900);
  --fx-text-secondary: var(--fx-color-neutral-600);
  --fx-text-tertiary: var(--fx-color-neutral-500);
  --fx-text-disabled: var(--fx-color-neutral-400);
  --fx-text-on-brand: var(--fx-color-white);
  --fx-text-on-category: var(--fx-color-neutral-900);
  --fx-text-brand: var(--fx-color-neutral-900);
  --fx-text-on-error: var(--fx-color-white);
  --fx-bg-page: color-mix(in oklab, var(--fx-color-neutral-100) calc(var(--fx-knob-page-tint) * 100%), var(--fx-color-neutral-25));
  --fx-bg-surface: var(--fx-color-white);
  --fx-bg-subtle: var(--fx-color-neutral-50);
  --fx-bg-muted: var(--fx-color-neutral-100);
  --fx-bg-brand-solid: var(--fx-color-neutral-900);
  --fx-bg-brand-solid-hover: var(--fx-color-neutral-700);
  --fx-bg-error-subtle: var(--fx-color-red-50);
  --fx-bg-success-subtle: var(--fx-color-green-50);
  --fx-bg-category-yellow: var(--fx-color-pastel-yellow);
  --fx-bg-category-pink: var(--fx-color-pastel-pink);
  --fx-bg-category-blue: var(--fx-color-pastel-blue);
  --fx-bg-category-coral: var(--fx-color-pastel-coral);
  --fx-bg-category-green: var(--fx-color-pastel-green);
  --fx-bg-category-purple: var(--fx-color-pastel-purple);
  --fx-bg-category-purple-subtle: color-mix(in oklab, var(--fx-color-pastel-purple) 20%, var(--fx-bg-page));
  --fx-bg-brand-subtle: var(--fx-color-neutral-100);
  --fx-bg-error-solid: var(--fx-color-red-600);
  --fx-fg-success: var(--fx-color-green-700);
  --fx-fg-warning: var(--fx-color-amber-700);
  --fx-fg-error: var(--fx-color-red-700);
  --fx-border-color-default: var(--fx-color-neutral-200);
  --fx-border-color-strong: var(--fx-color-neutral-300);
  --fx-border-color-focus: var(--fx-color-neutral-900);
  --fx-border-color-error: var(--fx-color-red-600);
  --fx-shadow-color: var(--fx-color-neutral-900);
}
@media (prefers-color-scheme: dark) {
:root:not([data-fx-scheme="light"]) {
    --fx-text-primary: var(--fx-color-neutral-50);
    --fx-text-secondary: var(--fx-color-neutral-300);
    --fx-text-tertiary: var(--fx-color-neutral-400);
    --fx-text-disabled: var(--fx-color-neutral-600);
    --fx-text-on-brand: var(--fx-color-neutral-900);
    --fx-text-on-category: var(--fx-color-neutral-50);
    --fx-text-brand: var(--fx-color-neutral-50);
    --fx-text-on-error: var(--fx-color-white);
    --fx-bg-page: var(--fx-color-neutral-950);
    --fx-bg-surface: var(--fx-color-neutral-900);
    --fx-bg-subtle: var(--fx-color-neutral-900);
    --fx-bg-muted: var(--fx-color-neutral-800);
    --fx-bg-brand-solid: var(--fx-color-neutral-50);
    --fx-bg-brand-solid-hover: var(--fx-color-neutral-200);
    --fx-bg-error-subtle: color-mix(in oklab, var(--fx-color-red-300) 16%, var(--fx-bg-surface));
    --fx-bg-success-subtle: color-mix(in oklab, var(--fx-color-green-300) 16%, var(--fx-bg-surface));
    --fx-bg-category-yellow: color-mix(in oklab, var(--fx-color-pastel-yellow) 45%, var(--fx-color-neutral-950));
    --fx-bg-category-pink: color-mix(in oklab, var(--fx-color-pastel-pink) 45%, var(--fx-color-neutral-950));
    --fx-bg-category-blue: color-mix(in oklab, var(--fx-color-pastel-blue) 45%, var(--fx-color-neutral-950));
    --fx-bg-category-coral: color-mix(in oklab, var(--fx-color-pastel-coral) 45%, var(--fx-color-neutral-950));
    --fx-bg-category-green: color-mix(in oklab, var(--fx-color-pastel-green) 45%, var(--fx-color-neutral-950));
    --fx-bg-category-purple: color-mix(in oklab, var(--fx-color-pastel-purple) 45%, var(--fx-color-neutral-950));
    --fx-bg-category-purple-subtle: color-mix(in oklab, var(--fx-color-pastel-purple) 10%, var(--fx-bg-page));
    --fx-bg-brand-subtle: color-mix(in oklab, var(--fx-bg-brand-solid) 20%, var(--fx-bg-surface));
    --fx-bg-error-solid: var(--fx-color-red-600);
    --fx-fg-success: var(--fx-color-green-300);
    --fx-fg-warning: var(--fx-color-amber-300);
    --fx-fg-error: var(--fx-color-red-300);
    --fx-border-color-default: var(--fx-color-neutral-800);
    --fx-border-color-strong: var(--fx-color-neutral-700);
    --fx-border-color-focus: var(--fx-color-neutral-50);
    --fx-border-color-error: var(--fx-color-red-300);
    --fx-shadow-color: var(--fx-color-black);
}
}
[data-fx-scheme="dark"] {
  --fx-text-primary: var(--fx-color-neutral-50);
  --fx-text-secondary: var(--fx-color-neutral-300);
  --fx-text-tertiary: var(--fx-color-neutral-400);
  --fx-text-disabled: var(--fx-color-neutral-600);
  --fx-text-on-brand: var(--fx-color-neutral-900);
  --fx-text-on-category: var(--fx-color-neutral-50);
  --fx-text-brand: var(--fx-color-neutral-50);
  --fx-text-on-error: var(--fx-color-white);
  --fx-bg-page: var(--fx-color-neutral-950);
  --fx-bg-surface: var(--fx-color-neutral-900);
  --fx-bg-subtle: var(--fx-color-neutral-900);
  --fx-bg-muted: var(--fx-color-neutral-800);
  --fx-bg-brand-solid: var(--fx-color-neutral-50);
  --fx-bg-brand-solid-hover: var(--fx-color-neutral-200);
  --fx-bg-error-subtle: color-mix(in oklab, var(--fx-color-red-300) 16%, var(--fx-bg-surface));
  --fx-bg-success-subtle: color-mix(in oklab, var(--fx-color-green-300) 16%, var(--fx-bg-surface));
  --fx-bg-category-yellow: color-mix(in oklab, var(--fx-color-pastel-yellow) 45%, var(--fx-color-neutral-950));
  --fx-bg-category-pink: color-mix(in oklab, var(--fx-color-pastel-pink) 45%, var(--fx-color-neutral-950));
  --fx-bg-category-blue: color-mix(in oklab, var(--fx-color-pastel-blue) 45%, var(--fx-color-neutral-950));
  --fx-bg-category-coral: color-mix(in oklab, var(--fx-color-pastel-coral) 45%, var(--fx-color-neutral-950));
  --fx-bg-category-green: color-mix(in oklab, var(--fx-color-pastel-green) 45%, var(--fx-color-neutral-950));
  --fx-bg-category-purple: color-mix(in oklab, var(--fx-color-pastel-purple) 45%, var(--fx-color-neutral-950));
  --fx-bg-category-purple-subtle: color-mix(in oklab, var(--fx-color-pastel-purple) 10%, var(--fx-bg-page));
  --fx-bg-brand-subtle: color-mix(in oklab, var(--fx-bg-brand-solid) 20%, var(--fx-bg-surface));
  --fx-bg-error-solid: var(--fx-color-red-600);
  --fx-fg-success: var(--fx-color-green-300);
  --fx-fg-warning: var(--fx-color-amber-300);
  --fx-fg-error: var(--fx-color-red-300);
  --fx-border-color-default: var(--fx-color-neutral-800);
  --fx-border-color-strong: var(--fx-color-neutral-700);
  --fx-border-color-focus: var(--fx-color-neutral-50);
  --fx-border-color-error: var(--fx-color-red-300);
  --fx-shadow-color: var(--fx-color-black);
}
:root, [data-fx-scheme], [data-fx-theme], [data-fx-body], [data-fx-font], [data-fx-personality], [data-fx-edge], [data-fx-density], [data-fx-motion] {
  --fx-control-h-sm: max(var(--fx-size-min-target), calc(var(--fx-size-control-sm) * var(--fx-knob-density)));
  --fx-control-h-md: max(var(--fx-size-min-target), calc(var(--fx-size-control-md) * var(--fx-knob-density)));
  --fx-control-h-lg: max(var(--fx-size-min-target), calc(var(--fx-size-control-lg) * var(--fx-knob-density)));
  --fx-shadow-sm: 0 1px calc(2px * var(--fx-knob-blur)) 0 color-mix(in oklab, var(--fx-shadow-color) calc(var(--fx-knob-depth) * 10%), transparent);
  --fx-shadow-md: 0 4px calc(8px * var(--fx-knob-blur)) -2px color-mix(in oklab, var(--fx-shadow-color) calc(var(--fx-knob-depth) * 10%), transparent), 0 2px calc(4px * var(--fx-knob-blur)) -2px color-mix(in oklab, var(--fx-shadow-color) calc(var(--fx-knob-depth) * 6%), transparent);
  --fx-shadow-lg: 0 12px calc(16px * var(--fx-knob-blur)) -4px color-mix(in oklab, var(--fx-shadow-color) calc(var(--fx-knob-depth) * 8%), transparent), 0 4px calc(6px * var(--fx-knob-blur)) -2px color-mix(in oklab, var(--fx-shadow-color) calc(var(--fx-knob-depth) * 3%), transparent), 0 24px calc(48px * var(--fx-knob-blur)) -12px color-mix(in oklab, var(--fx-shadow-color) calc(var(--fx-knob-depth) * 12%), transparent);
  --fx-motion-fast: calc(var(--fx-duration-fast) * var(--fx-knob-motion));
  --fx-motion-base: calc(var(--fx-duration-base) * var(--fx-knob-motion));
  --fx-motion-slow: calc(var(--fx-duration-slow) * var(--fx-knob-motion));
  --fx-motion-instant: calc(var(--fx-duration-instant) * var(--fx-knob-motion));
  --fx-motion-press: calc(1 - (1 - var(--fx-motion-scale-press)) * var(--fx-knob-motion-press));
}
@media (pointer: coarse) {
:root, [data-fx-scheme], [data-fx-theme], [data-fx-body], [data-fx-font], [data-fx-personality], [data-fx-edge], [data-fx-density], [data-fx-motion] {
    --fx-control-h-sm: max(var(--fx-size-touch-target), calc(var(--fx-size-control-sm) * var(--fx-knob-density)));
    --fx-control-h-md: max(var(--fx-size-touch-target), calc(var(--fx-size-control-md) * var(--fx-knob-density)));
}
}
}

@layer fx.base {
  .fx-assistant [hidden]:not([hidden="until-found"]), .fx-assistant[hidden] { display: none !important; }
  .fx-assistant { font-family: var(--assistant-font, inherit); line-height: 1.5; }
  .fx-assistant *, .fx-assistant *::before, .fx-assistant *::after { box-sizing: border-box; }
  @keyframes fx-pulse { 50% { opacity: 0.35; } }
  @keyframes fx-spin { to { rotate: 1turn; } }
  @keyframes fx-fade-in { from { opacity: 0; } }
  @keyframes fx-shimmer-text { from { background-position: 100% 0; } to { background-position: 0 0; } }
  @keyframes fx-stagger-in { from { opacity: 0; translate: 0 var(--fx-motion-shift-md); } }
  @keyframes fx-glow-spin { to { --fx-glow-angle: 360deg; } }
}
@layer fx.components {
  /* Shar (orb) — AI yordamchining abstrakt «yuzi» (Siri sharidan ilhom, Ustoz 17.10): yuz, qoʻl, koʻz yoʻq — chizgi xatosi boʻlmaydi.
     Bitta rangdan (standart — brend; data-color — 6 toifa rangi; AI yordamchi ichida — saytning brend rangi) toʻq yadro + uchta suzuvchi rang toʻlqini + yaltiroq.
     Holatlar (data-state): idle — sekin nafas · thinking — toʻlqinlar tezlashib buraladi · talking — urib turadi · handoff — bir marta chaqnaydi.
     Faqat CSS, 0 bayt JS; oʻlcham konteyner birligida (cqi) — har oʻlchamda bir xil koʻrinadi. */
  .fx-orb {
    --_o: var(--fx-bg-brand-solid);
    --_t: 1;
    position: relative;
    display: inline-block;
    flex: none;
    inline-size: var(--fx-size-avatar-md);
    aspect-ratio: 1;
    container-type: inline-size;
    border-radius: var(--fx-radius-circle);
    overflow: hidden;
    isolation: isolate;
    /* toʻlqin ranglari brenddan: ton bir tomonga (−35°, −70°) aylantiriladi — iliq brendda yashil «kir» chiqmaydi, yorugʻlik va toʻyinganlik qotiriladi — brend och, toʻq yoki kulrang boʻlsa ham shar yorqin */
    --_w1: oklch(from var(--_o) 0.78 max(c, 0.2) h);
    --_w2: oklch(from var(--_o) 0.72 max(c, 0.24) calc(h - 35));
    --_w3: oklch(from var(--_o) 0.74 max(c, 0.22) calc(h - 70));
    --_k1: oklch(from var(--_o) 0.42 max(c, 0.16) calc(h - 35));
    --_k2: oklch(from var(--_o) 0.2 max(c, 0.1) calc(h - 50));
    background: radial-gradient(circle at 50% 50%, var(--_k1), var(--_k2) 78%);
    animation: fx-orb-breath calc(var(--fx-duration-pulse) * 2.5 * var(--_t)) var(--fx-ease-standard) infinite;
  }
  .fx-orb[data-color="coral"] { --_o: var(--fx-bg-category-coral); }
  .fx-orb[data-color="pink"] { --_o: var(--fx-bg-category-pink); }
  .fx-orb[data-color="blue"] { --_o: var(--fx-bg-category-blue); }
  .fx-orb[data-color="green"] { --_o: var(--fx-bg-category-green); }
  .fx-orb[data-color="yellow"] { --_o: var(--fx-bg-category-yellow); }
  .fx-orb[data-color="purple"] { --_o: var(--fx-bg-category-purple); }
  .fx-orb[data-size="sm"] { inline-size: var(--fx-size-avatar-sm); }
  .fx-orb[data-size="lg"] { inline-size: var(--fx-size-avatar-lg); }
  .fx-orb[data-size="xl"] { inline-size: calc(var(--fx-size-avatar-lg) * 2); }
  /* uchta rang toʻlqini — har biri oʻz tezligi va yoʻnalishida aylanadi */
  .fx-orb__wave { position: absolute; inset: -20%; border-radius: var(--fx-radius-circle); filter: blur(7cqi); mix-blend-mode: screen; animation: fx-orb-spin calc(var(--fx-duration-pulse) * 5 * var(--_t)) linear infinite; }
  .fx-orb__wave:nth-child(1) { background: radial-gradient(ellipse 60% 44% at 32% 36%, var(--_w1) 0 18%, transparent 62%); }
  .fx-orb__wave:nth-child(2) { background: radial-gradient(ellipse 46% 58% at 68% 56%, var(--_w2) 0 16%, transparent 62%); animation-duration: calc(var(--fx-duration-pulse) * 7 * var(--_t)); animation-direction: reverse; }
  .fx-orb__wave:nth-child(3) { background: radial-gradient(ellipse 54% 40% at 46% 74%, var(--_w3) 0 14%, transparent 60%); animation-duration: calc(var(--fx-duration-pulse) * 9 * var(--_t)); }
  /* ovoz toʻlqinlari (JS: data-fx-orb → canvas, Siri kabi lentalar) — gradient ustida, yaltiroq ostida */
  .fx-orb__lines { position: absolute; inset: 0; z-index: 1; inline-size: 100%; block-size: 100%; mix-blend-mode: screen; }
  .fx-orb::after { z-index: 2; }
  /* yaltiroq — shishasimon hajm */
  .fx-orb::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle at 50% 50%, transparent 60%, color-mix(in oklab, var(--_w1) 30%, transparent) 70%, transparent 74%), radial-gradient(circle at 36% 28%, color-mix(in oklab, var(--fx-bg-static-light) 28%, transparent) 0 6%, transparent 26%); pointer-events: none; }
  /* holatlar */
  .fx-orb[data-state="thinking"] { --_t: 0.35; }
  .fx-orb[data-state="thinking"] .fx-orb__wave { scale: 0.8; transition: scale var(--fx-motion-slow) var(--fx-ease-standard); }
  .fx-orb[data-state="talking"] { --_t: 0.6; animation: fx-orb-talk calc(var(--fx-duration-pulse) / 4) var(--fx-ease-standard) 4; }
  .fx-orb[data-state="handoff"] { animation: fx-orb-flash var(--fx-duration-slower) var(--fx-ease-standard) 1; }
  @keyframes fx-orb-spin { to { rotate: 1turn; } }
  @keyframes fx-orb-breath { 50% { scale: 1.04; } }
  @keyframes fx-orb-talk { 50% { scale: 1.08; } }
  @keyframes fx-orb-flash { 40% { filter: brightness(1.6) saturate(1.3); scale: 1.08; } }
  @media (prefers-reduced-motion: reduce) { .fx-orb, .fx-orb__wave { animation: none; } }
  @media (forced-colors: active) { .fx-orb { background: CanvasText; } .fx-orb__wave, .fx-orb::after { display: none; } }
}

@layer fx.components {
  /* AI yordamchi widget’i («Guli saytda»): oʻng pastda dumaloq tugma (personaj sloti) → suhbat oynasi. Har sayt — sozlama (nom, rang,
     endpoint, til). Holatlar: idle · open · sending · error · handoff (menejerga — Telegram/telefon). Telefonda (< 640 px) — toʻliq ekran.
     Personaj: tinch holatda yengil «nafas», sahifada bir marta qoʻl silkitadi (data-mascot="wave"); harakat kamaytirilsa — yoʻq. */
  .fx-assistant { --_c: var(--fx-bg-brand-solid); --_edge: var(--fx-space-5); /* pufak yoyi chegaralangan: «Aylana» uslubida ham pufak shakli buzilmaydi */ --_r: min(var(--fx-radius-overlay), var(--fx-space-5)); --_rt: min(var(--fx-radius-badge), var(--fx-space-1)); position: fixed; inset: auto max(var(--_edge), env(safe-area-inset-right, 0px)) max(var(--_edge), env(safe-area-inset-bottom, 0px)) auto; z-index: 50; display: grid; justify-items: end; gap: var(--fx-space-3); font-size: var(--fx-font-size-sm); color: var(--fx-text-primary); }
  /* och doira (data-color="light") — qora konturli personaj ikkala rejimda ham aniq koʻrinsin */
  .fx-assistant[data-color="light"] { --_c: var(--fx-bg-static-light); }
  .fx-assistant[data-color="light"] :is(.fx-assistant__launcher, .fx-assistant__avatar) { color: var(--fx-text-on-static-light); }
  /* panel ranglari saytning oʻz tokenidan: --assistant-surface / --assistant-text yoki saytdagi --surface (--bg) / --text; boʻlmasa — FoxUI.
     Shunda qorongʻi saytda panel sayt fonida turadi (NomLab: iliq qora), FoxUI’ning koʻkimtir qorasi emas */
  .fx-assistant {
    --_surface: var(--assistant-surface, var(--surface, var(--bg, var(--fx-bg-surface))));
    --_fg: var(--assistant-text, var(--text, var(--fx-text-primary)));
    --_muted: color-mix(in oklab, var(--_fg) 7%, var(--_surface));
    --_line: color-mix(in oklab, var(--_fg) 12%, var(--_surface));
    --_dim: color-mix(in oklab, var(--_fg) 58%, var(--_surface));
  }
  .fx-assistant > .fx-assistant__mascot { display: none; } /* manba — JS nusxa oladi */
  .fx-assistant__launcher {
    position: relative; display: grid; place-items: center; inline-size: calc(var(--fx-space-12) + var(--fx-space-2)); block-size: calc(var(--fx-space-12) + var(--fx-space-2)); padding: 0; border: 0; border-radius: var(--fx-radius-circle);
    background: var(--_c); color: var(--_ink, var(--fx-text-on-category)); box-shadow: var(--fx-shadow-lg); cursor: pointer;
    transition: scale var(--fx-motion-instant) var(--fx-ease-standard), translate var(--fx-motion-base) var(--fx-ease-spring);
  }
  .fx-assistant__launcher:hover { translate: 0 calc(var(--fx-space-1) * -0.5); }
  .fx-assistant__launcher:active { scale: var(--fx-motion-press); }
  .fx-assistant__launcher:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: var(--fx-border-width-focus); }
  .fx-assistant__launcher > .fx-assistant__face { position: absolute; inset: var(--fx-space-1); inline-size: calc(100% - var(--fx-space-1) * 2); block-size: calc(100% - var(--fx-space-1) * 2); border-radius: var(--fx-radius-circle); object-fit: cover; }
  .fx-assistant__launcher > .fx-assistant__face:not(img, svg, canvas) { display: grid; place-items: center; font-size: var(--fx-font-size-lg); font-weight: var(--fx-font-weight-semibold); }
  .fx-assistant__icon { display: none; }
  .fx-assistant__launcher[aria-expanded="true"] > .fx-assistant__face { opacity: 0; }
  .fx-assistant__launcher[aria-expanded="true"] .fx-assistant__icon { display: grid; }
  .fx-assistant__icon > svg { inline-size: var(--fx-size-icon-lg); block-size: var(--fx-size-icon-lg); }
  .fx-assistant__glyph > svg { inline-size: var(--fx-size-icon-lg); block-size: var(--fx-size-icon-lg); }
  .fx-assistant__badge { position: absolute; inset-block-start: 0; inset-inline-end: 0; min-inline-size: var(--fx-size-icon-md); block-size: var(--fx-size-icon-md); border-radius: var(--fx-radius-circle); background: var(--fx-bg-error-solid); color: var(--fx-text-on-error); font-size: var(--fx-font-size-xs); font-weight: var(--fx-font-weight-semibold); line-height: var(--fx-size-icon-md); outline: var(--fx-border-width-focus) solid var(--fx-bg-page); }
  /* personaj harakati: tinch «nafas» (loop knob), bir martalik qoʻl silkitish; tab yashirinsa — pauza */
  .fx-assistant[data-mascot="idle"] .fx-assistant__launcher > .fx-assistant__face:not(svg, .fx-orb) { animation: fx-assistant-breath calc(var(--fx-duration-pulse) * 2.5) var(--fx-ease-standard) infinite; }
  .fx-assistant[data-mascot="wave"] .fx-assistant__launcher > .fx-assistant__face:not(svg, .fx-orb) { transform-origin: 70% 90%; animation: fx-assistant-wave calc(var(--fx-motion-slow) * 4) var(--fx-ease-standard) 1; }
  .fx-assistant[data-paused] .fx-assistant__launcher > .fx-assistant__face { animation-play-state: paused; }
  /* ichki SVG animatsiyalari ham: tab yashirin yoki oyna ochiq (tugmadagi personaj koʻrinmaydi) — pauza, CPU tejaladi */
  .fx-assistant[data-paused] .fx-assistant__launcher > .fx-assistant__face :is(*, *::before, *::after), .fx-assistant__launcher[aria-expanded="true"] > .fx-assistant__face :is(*, *::before, *::after) { animation-play-state: paused !important; }
  .fx-assistant[data-paused] .fx-assistant__avatar :is(*, *::before, *::after) { animation-play-state: paused !important; }
  .fx-assistant[data-mascot="thinking"] .fx-assistant__launcher > .fx-assistant__face:not(svg, .fx-orb) { animation: fx-pulse var(--fx-duration-pulse) var(--fx-ease-standard) infinite; }
  .fx-assistant[data-mascot="talking"] .fx-assistant__launcher > .fx-assistant__face:not(svg, .fx-orb) { animation: fx-assistant-breath var(--fx-motion-slow) var(--fx-ease-spring) 2; }
  /* jonli personaj (inline SVG) oʻzi harakatlanadi — tashqi tebranish ikkilanmasin; holatni .salom/.oylayapti/.gapiryapti/.uzatyapti sinflari beradi */
  .fx-assistant:is([data-mascot="idle"], [data-mascot="wave"], [data-mascot="thinking"], [data-mascot="talking"], [data-mascot="handoff"]) .fx-assistant__launcher > svg.fx-assistant__face { animation: none; }
  /* abstrakt shar (data-face="orb") — tugmani toʻliq egallaydi, rangi saytning brend rangi; harakatni sharning oʻzi beradi */
  .fx-assistant .fx-orb { --_o: var(--_c); }
  .fx-assistant__launcher > .fx-orb.fx-assistant__face { inset: 0; inline-size: 100%; block-size: 100%; }
  .fx-assistant__avatar > .fx-orb { inline-size: 100%; }
  @keyframes fx-assistant-breath { 50% { scale: 1.04; } }
  @keyframes fx-assistant-wave { 15%, 45% { rotate: -12deg; } 30%, 60% { rotate: 10deg; } 75% { rotate: 0deg; } }
  @media (prefers-reduced-motion: reduce) { .fx-assistant__launcher > .fx-assistant__face { animation: none !important; } }
  /* salom pufakchasi */
  /* salom pufakchasi: panel bilan bir oila — yumshoq soya, chiziq, matn toza */
  .fx-assistant__greet { color: var(--_fg); display: flex; align-items: center; gap: var(--fx-space-2); max-inline-size: calc(var(--fx-space-12) * 6); padding: var(--fx-space-3) var(--fx-space-2) var(--fx-space-3) var(--fx-space-4); border: var(--fx-border-width-default) solid var(--_line); border-radius: var(--_r); border-end-end-radius: var(--_rt); background: var(--_surface); box-shadow: var(--fx-shadow-lg); line-height: 1.45; cursor: pointer; animation: fx-stagger-in var(--fx-motion-base) var(--fx-ease-enter); }
  .fx-assistant__x { display: grid; place-items: center; flex: none; inline-size: var(--fx-space-8); block-size: var(--fx-space-8); padding: 0; border: 0; border-radius: var(--fx-radius-circle); background: none; color: var(--_dim); cursor: pointer; transition: background-color var(--fx-motion-fast) var(--fx-ease-standard), color var(--fx-motion-fast) var(--fx-ease-standard); }
  .fx-assistant__x[hidden], .fx-assistant__reset[hidden] { display: none; }
  .fx-assistant__x:focus-visible { outline: var(--fx-border-width-focus) solid var(--fx-border-color-focus); outline-offset: calc(var(--fx-border-width-focus) * -1); }
  .fx-assistant__x:hover { background: var(--_muted); color: var(--_fg); }
  .fx-assistant__x > svg { inline-size: var(--fx-size-icon-sm); block-size: var(--fx-size-icon-sm); }
  /* telefonda: salom pufakchasi 2 qatordan oshmaydi; panel ochiq boʻlsa (har qanday holatda — xato, menejer ham) shar tugmasi yashiriladi, «Yuborish»ni yopmaydi */
  @media (max-width: 640px) {
    .fx-assistant__greet { max-inline-size: min(calc(100vw - var(--_edge) * 3 - var(--fx-control-h-lg)), calc(var(--fx-space-12) * 5)); padding-block: var(--fx-space-2); font-size: var(--fx-font-size-sm); }
    .fx-assistant__greet > span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
    .fx-assistant:has(> .fx-assistant__panel:not([hidden])) .fx-assistant__launcher { display: none; }
  }
}

