/* =====================================================================
   OZON — Design tokens
   Brend: crimson #BD0D37 + oq; ikkinchi aksent — dorixona yashili #1FA35F.
   Mavzu: :root (yorug') · @media dark (auto) · [data-theme="dark"] (majburiy).
   Sahifalar faqat shu tokenlardan foydalanadi — xom HEX yozilmaydi.
   ===================================================================== */

:root {
  color-scheme: light;

  /* ---------- Brend --------------------------------------------------- */
  --brand: #BD0D37;
  --brand-hover: #A80C31;
  --brand-press: #8F0A2A;
  --brand-ink: #A30B30;            /* brend rangidagi matn (AA: oq/glass ustida 7:1) */
  --brand-strong: #7E0824;
  --brand-soft: rgba(189, 13, 55, .10);
  --brand-softer: rgba(189, 13, 55, .055);
  --brand-line: rgba(189, 13, 55, .22);
  --brand-glow: rgba(189, 13, 55, .30);
  --brand-grad: linear-gradient(140deg, #DA1B4C 0%, #BD0D37 46%, #970A2C 100%);
  --on-brand: #FFFFFF;

  --green: #1FA35F;                /* ikkinchi aksent: ijobiy holat, "dorixona" belgisi */
  --green-ink: #10734A;
  --green-soft: rgba(31, 163, 95, .13);

  /* ---------- Neytral (iliq, pushti tusli) ---------------------------- */
  --bg: #F7F2F3;
  --bg-2: #FFFFFF;
  --surface-solid: #FFFFFF;        /* shaffofliksiz rejim uchun */
  --surface-solid-2: #FBF7F8;
  --ink: #1B1014;                  /* asosiy matn */
  --ink-2: #47363C;                /* ikkinchi darajali matn */
  --ink-3: #66555B;                /* izoh, meta (glass ustida ham ≥ 4.5:1) */
  --ink-4: #9C8B91;                /* faqat dekorativ / o'chirilgan */
  --line: rgba(74, 22, 38, .10);
  --line-2: rgba(74, 22, 38, .16);
  --line-strong: rgba(74, 22, 38, .26);
  --fill-1: rgba(74, 22, 38, .035);
  --fill-2: rgba(74, 22, 38, .065);
  --fill-3: rgba(74, 22, 38, .10);
  --hover: rgba(74, 22, 38, .05);
  --press: rgba(74, 22, 38, .09);
  --scrim: rgba(36, 10, 18, .28);
  --selection: rgba(189, 13, 55, .18);
  --focus: #BD0D37;
  --focus-halo: rgba(255, 255, 255, .9);

  /* ---------- Holat ranglari (brend crimson'dan farqli) --------------- */
  --ok: #1FA35F;       --ok-ink: #10734A;      --ok-soft: rgba(31, 163, 95, .13);   --ok-line: rgba(31, 163, 95, .32);
  --warn: #E9A21A;     --warn-ink: #8A5600;    --warn-soft: rgba(233, 162, 26, .17); --warn-line: rgba(233, 162, 26, .42);
  --crit: #E2401F;     --crit-ink: #B2260F;    --crit-soft: rgba(226, 64, 31, .12);  --crit-line: rgba(226, 64, 31, .34);
  --info: #4F46C8;     --info-ink: #3E36AE;    --info-soft: rgba(79, 70, 200, .11);  --info-line: rgba(79, 70, 200, .30);
  --neutral: #8C7E83;  --neutral-ink: #5D4F55; --neutral-soft: rgba(110, 92, 99, .12); --neutral-line: rgba(110, 92, 99, .28);

  /* ---------- Grafik palitrasi (validatsiyadan o'tgan, tartib qat'iy) - */
  --c1: #BD0D37;  /* crimson */
  --c2: #4F46C8;  /* indigo */
  --c3: #0A9396;  /* teal */
  --c4: #E07020;  /* orange */
  --c5: #C2389A;  /* magenta */
  --chart-grid: rgba(74, 22, 38, .09);
  --chart-track: rgba(74, 22, 38, .08);
  --chart-surface: #FFFFFF;        /* bo'laklar orasidagi 2px "surface gap" */
  --chart-area-opacity: .14;

  /* ---------- Bo'lim ranglari (avatar, chip) -------------------------- */
  --dept-ceo: #BD0D37;
  --dept-finance: #4F46C8;
  --dept-sales: #D9601A;
  --dept-marketing: #C2389A;
  --dept-hr: #0A8F8A;
  --dept-warehouse: #7247B8;
  --dept-supply: #B7791F;
  --dept-bi: #3D6A9E;
  --dept-planned: #8C7E83;

  /* ---------- Liquid Glass materiallari ------------------------------- */
  --glass-blur: 26px;
  --glass-sat: 175%;
  --glass-fill: linear-gradient(160deg, rgba(255, 255, 255, .76) 0%, rgba(255, 255, 255, .52) 100%);
  --glass-fill-hover: linear-gradient(160deg, rgba(255, 255, 255, .86) 0%, rgba(255, 255, 255, .62) 100%);
  --glass-thin-fill: linear-gradient(180deg, rgba(255, 255, 255, .62) 0%, rgba(255, 255, 255, .46) 100%);
  --glass-thick-fill: linear-gradient(165deg, rgba(255, 255, 255, .92) 0%, rgba(255, 252, 253, .82) 100%);
  --glass-tint-fill: linear-gradient(140deg, rgba(222, 32, 78, .94) 0%, rgba(189, 13, 55, .92) 48%, rgba(150, 9, 43, .94) 100%);
  --glass-inner-fill: rgba(255, 255, 255, .55);   /* glass ichidagi kichik plitkalar */
  --glass-rim: linear-gradient(150deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .55) 22%, rgba(255, 255, 255, .12) 52%, rgba(255, 255, 255, .45) 78%, rgba(255, 255, 255, .95) 100%);
  --glass-rim-tint: linear-gradient(150deg, rgba(255, 255, 255, .75) 0%, rgba(255, 255, 255, .18) 40%, rgba(255, 255, 255, .06) 60%, rgba(255, 255, 255, .45) 100%);
  --glass-edge: 0 0 0 .5px rgba(120, 30, 52, .10);
  --glass-inset: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(255, 255, 255, .35), inset 0 -14px 28px -18px rgba(255, 255, 255, .9);
  --glass-inset-tint: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 -1px 0 rgba(255, 255, 255, .12), inset 0 -16px 26px -18px rgba(255, 170, 190, .55);
  --glass-shadow: 0 1px 2px rgba(80, 10, 30, .05), 0 10px 24px -8px rgba(110, 14, 44, .12), 0 28px 56px -22px rgba(110, 14, 44, .16);
  --glass-shadow-hover: 0 2px 4px rgba(80, 10, 30, .06), 0 16px 32px -10px rgba(110, 14, 44, .17), 0 36px 72px -26px rgba(110, 14, 44, .22);
  --glass-shadow-thin: 0 1px 2px rgba(80, 10, 30, .05), 0 12px 32px -14px rgba(110, 14, 44, .16);
  --glass-shadow-thick: 0 2px 6px rgba(60, 8, 24, .08), 0 32px 80px -24px rgba(70, 8, 28, .34);
  --glass-shadow-tint: 0 1px 2px rgba(120, 8, 36, .25), 0 10px 26px -8px rgba(189, 13, 55, .55);
  --glass-sheen: rgba(255, 255, 255, .70);
  --glass-sheen-tint: rgba(255, 220, 230, .38);
  --glass-highlight: radial-gradient(120% 70% at 50% -20%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 60%);

  /* ---------- Sahna (fon) --------------------------------------------- */
  --scene-base: radial-gradient(140% 90% at 85% -10%, #FCE6EB 0%, rgba(252, 230, 235, 0) 55%), linear-gradient(180deg, #FBF6F7 0%, #F5EEF0 100%);
  --blob-1: rgba(214, 22, 70, .36);   /* crimson */
  --blob-2: rgba(255, 150, 175, .55); /* rose */
  --blob-3: rgba(255, 214, 224, .85); /* blush */
  --blob-4: rgba(110, 222, 168, .42); /* mint */
  --blob-5: rgba(255, 186, 160, .30); /* peach */
  --scene-ring: rgba(189, 13, 55, .07);
  --scene-ring-edge: rgba(189, 13, 55, .10);
  --o3-1: rgba(189, 13, 55, .14);
  --o3-2: rgba(255, 255, 255, .80);
  --o3-3: rgba(189, 13, 55, .10);
  --noise-opacity: .05;

  /* ---------- Shrift va tipografiya ----------------------------------- */
  --font: "Inter", "InterVariable", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --fs-2xs: 11px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 15px;
  --fs-md: 16px;
  --fs-lg: 18px;
  --fs-xl: 21px;
  --fs-2xl: 26px;
  --fs-3xl: clamp(28px, 2.2vw + 16px, 36px);
  --fs-4xl: clamp(32px, 3vw + 16px, 46px);
  --fs-display: clamp(40px, 4.2vw + 18px, 64px);
  --lh-tight: 1.12;
  --lh-snug: 1.3;
  --lh-base: 1.55;
  --tracking-display: -0.032em;
  --tracking-title: -0.022em;
  --tracking-tight: -0.011em;
  --tracking-caps: 0.08em;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-heavy: 800;

  /* ---------- Bo'shliq (4px qadam) ------------------------------------ */
  --s-0: 2px;
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-7: 28px;
  --s-8: 32px;
  --s-10: 40px;
  --s-12: 48px;
  --s-16: 64px;
  --s-20: 80px;

  /* ---------- Radiuslar ------------------------------------------------ */
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-2xl: 34px;
  --r-pill: 999px;

  /* ---------- Harakat -------------------------------------------------- */
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.36, .64, 1);
  --ease-spring-soft: cubic-bezier(.3, 1.18, .6, 1);
  --dur-1: 120ms;
  --dur-2: 180ms;
  --dur-3: 240ms;
  --dur-4: 360ms;
  --dur-page: 420ms;

  /* ---------- Qatlamlar (z-index) ------------------------------------- */
  --z-scene: 0;
  --z-content: 1;
  --z-sticky: 20;
  --z-nav: 40;
  --z-popover: 60;
  --z-overlay: 80;
  --z-toast: 100;
  --z-tooltip: 120;

  /* ---------- Layout ----------------------------------------------------- */
  --sidebar-w: 272px;
  --shell-gap: 14px;
  --topbar-h: 60px;
  --content-max: 1440px;
  --page-pad: clamp(16px, 2.4vw, 36px);
  --tabbar-h: 66px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

/* Prujina (spring) — linear() qo'llab-quvvatlansa, haqiqiy tebranish bilan. */
@supports (transition-timing-function: linear(0, 1)) {
  :root {
    --ease-spring: linear(0, 0.0117, 0.0442 2.1%, 0.1709 4.5%, 0.6215 10.9%, 0.8318 14.2%, 0.9746 17.6%, 1.0367 20.3%, 1.0715 23.2%, 1.0812 25.4%, 1.0786 28.2%, 1.0482 34.8%, 1.0111 43.3%, 0.9976 51.2%, 0.9958 59.1%, 1.0006 80.7%, 1);
    --ease-spring-soft: linear(0, 0.0228, 0.0856 3.4%, 0.3123 7.3%, 0.7104 14.1%, 0.8693 17.9%, 0.9694 21.9%, 1.0185 25.9%, 1.0335 29.9%, 1.0295 35.3%, 1.0062 49.9%, 0.9987 63.9%, 1);
  }
}

/* =====================================================================
   Qorong'i mavzu — 1) OS sozlamasi (auto), 2) majburiy [data-theme=dark].
   Ikkala blok bir xil — biri o'zgarsa, ikkinchisini ham o'zgartiring.
   ===================================================================== */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --brand: #C8123F;
    --brand-hover: #D41C4A;
    --brand-press: #A70D33;
    --brand-ink: #FF6F8F;
    --brand-strong: #FF8FA8;
    --brand-soft: rgba(255, 70, 110, .16);
    --brand-softer: rgba(255, 70, 110, .08);
    --brand-line: rgba(255, 90, 125, .34);
    --brand-glow: rgba(224, 30, 80, .45);
    --brand-grad: linear-gradient(140deg, #E2245A 0%, #C8123F 46%, #8E0A2B 100%);
    --green: #2FBF74; --green-ink: #5ED896; --green-soft: rgba(47, 191, 116, .16);

    --bg: #12080B;
    --bg-2: #1A0E12;
    --surface-solid: #22141A;
    --surface-solid-2: #2A1920;
    --ink: #F8EEF1;
    --ink-2: #D9C6CC;
    --ink-3: #AD979E;
    --ink-4: #7A666C;
    --line: rgba(255, 220, 230, .09);
    --line-2: rgba(255, 220, 230, .14);
    --line-strong: rgba(255, 220, 230, .24);
    --fill-1: rgba(255, 225, 233, .04);
    --fill-2: rgba(255, 225, 233, .07);
    --fill-3: rgba(255, 225, 233, .11);
    --hover: rgba(255, 225, 233, .06);
    --press: rgba(255, 225, 233, .10);
    --scrim: rgba(5, 1, 3, .55);
    --selection: rgba(255, 80, 120, .30);
    --focus: #FF6F8F;
    --focus-halo: rgba(18, 8, 11, .9);

    --ok: #2FBF74;    --ok-ink: #5ED896;    --ok-soft: rgba(47, 191, 116, .16);   --ok-line: rgba(47, 191, 116, .40);
    --warn: #F2B33D;  --warn-ink: #F6C462;  --warn-soft: rgba(242, 179, 61, .16); --warn-line: rgba(242, 179, 61, .42);
    --crit: #FF5A36;  --crit-ink: #FF8466;  --crit-soft: rgba(255, 90, 54, .16);  --crit-line: rgba(255, 90, 54, .42);
    --info: #8D87F5;  --info-ink: #ABA6FF;  --info-soft: rgba(141, 135, 245, .17); --info-line: rgba(141, 135, 245, .40);
    --neutral: #9D8F95; --neutral-ink: #C3B5BA; --neutral-soft: rgba(190, 172, 179, .13); --neutral-line: rgba(190, 172, 179, .32);

    --c1: #E0305A; --c2: #8079F0; --c3: #13A39E; --c4: #DD7428; --c5: #D455A8;
    --chart-grid: rgba(255, 220, 230, .09);
    --chart-track: rgba(255, 220, 230, .10);
    --chart-surface: #1F1317;
    --chart-area-opacity: .22;

    --dept-ceo: #E0305A; --dept-finance: #8079F0; --dept-sales: #E4782F; --dept-marketing: #D455A8;
    --dept-hr: #19A9A3; --dept-warehouse: #9B78E0; --dept-supply: #D49A3A; --dept-bi: #6D97C9; --dept-planned: #8E7F85;

    --glass-blur: 28px;
    --glass-sat: 160%;
    --glass-fill: linear-gradient(160deg, rgba(62, 34, 44, .62) 0%, rgba(32, 16, 22, .50) 100%);
    --glass-fill-hover: linear-gradient(160deg, rgba(72, 40, 51, .68) 0%, rgba(38, 19, 26, .56) 100%);
    --glass-thin-fill: linear-gradient(180deg, rgba(48, 26, 34, .58) 0%, rgba(28, 14, 19, .48) 100%);
    --glass-thick-fill: linear-gradient(165deg, rgba(50, 28, 36, .90) 0%, rgba(30, 16, 21, .86) 100%);
    --glass-tint-fill: linear-gradient(140deg, rgba(232, 40, 88, .86) 0%, rgba(196, 16, 60, .82) 48%, rgba(130, 8, 38, .88) 100%);
    --glass-inner-fill: rgba(255, 235, 240, .05);
    --glass-rim: linear-gradient(150deg, rgba(255, 255, 255, .34) 0%, rgba(255, 255, 255, .10) 24%, rgba(255, 255, 255, .03) 52%, rgba(255, 255, 255, .08) 78%, rgba(255, 210, 222, .26) 100%);
    --glass-rim-tint: linear-gradient(150deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .12) 40%, rgba(255, 255, 255, .04) 60%, rgba(255, 200, 215, .35) 100%);
    --glass-edge: 0 0 0 .5px rgba(0, 0, 0, .45);
    --glass-inset: inset 0 1px 0 rgba(255, 255, 255, .13), inset 0 -1px 0 rgba(255, 255, 255, .03), inset 0 -18px 30px -22px rgba(255, 120, 150, .22);
    --glass-inset-tint: inset 0 1px 0 rgba(255, 255, 255, .38), inset 0 -1px 0 rgba(255, 255, 255, .08), inset 0 -16px 26px -18px rgba(255, 140, 170, .45);
    --glass-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 12px 28px -10px rgba(0, 0, 0, .55), 0 30px 60px -28px rgba(120, 6, 34, .45);
    --glass-shadow-hover: 0 2px 4px rgba(0, 0, 0, .4), 0 18px 36px -12px rgba(0, 0, 0, .6), 0 36px 72px -28px rgba(160, 10, 46, .55);
    --glass-shadow-thin: 0 1px 2px rgba(0, 0, 0, .35), 0 14px 34px -14px rgba(0, 0, 0, .6);
    --glass-shadow-thick: 0 2px 8px rgba(0, 0, 0, .45), 0 40px 90px -24px rgba(0, 0, 0, .75);
    --glass-shadow-tint: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 30px -8px rgba(224, 30, 80, .55);
    --glass-sheen: rgba(255, 200, 215, .16);
    --glass-sheen-tint: rgba(255, 210, 225, .30);
    --glass-highlight: radial-gradient(120% 70% at 50% -20%, rgba(255, 210, 222, .10), rgba(255, 210, 222, 0) 60%);

    --scene-base: radial-gradient(120% 80% at 80% -10%, #3A0A1A 0%, rgba(58, 10, 26, 0) 60%), linear-gradient(180deg, #160A0E 0%, #0E0609 100%);
    --blob-1: rgba(214, 22, 70, .42);
    --blob-2: rgba(140, 10, 50, .50);
    --blob-3: rgba(255, 90, 130, .16);
    --blob-4: rgba(40, 190, 130, .13);
    --blob-5: rgba(110, 40, 160, .20);
    --scene-ring: rgba(255, 60, 100, .06);
    --scene-ring-edge: rgba(255, 90, 125, .12);
    --o3-1: rgba(255, 60, 100, .16);
    --o3-2: rgba(255, 220, 230, .07);
    --o3-3: rgba(255, 60, 100, .11);
    --noise-opacity: .07;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --brand: #C8123F;
  --brand-hover: #D41C4A;
  --brand-press: #A70D33;
  --brand-ink: #FF6F8F;
  --brand-strong: #FF8FA8;
  --brand-soft: rgba(255, 70, 110, .16);
  --brand-softer: rgba(255, 70, 110, .08);
  --brand-line: rgba(255, 90, 125, .34);
  --brand-glow: rgba(224, 30, 80, .45);
  --brand-grad: linear-gradient(140deg, #E2245A 0%, #C8123F 46%, #8E0A2B 100%);
  --green: #2FBF74; --green-ink: #5ED896; --green-soft: rgba(47, 191, 116, .16);

  --bg: #12080B;
  --bg-2: #1A0E12;
  --surface-solid: #22141A;
  --surface-solid-2: #2A1920;
  --ink: #F8EEF1;
  --ink-2: #D9C6CC;
  --ink-3: #AD979E;
  --ink-4: #7A666C;
  --line: rgba(255, 220, 230, .09);
  --line-2: rgba(255, 220, 230, .14);
  --line-strong: rgba(255, 220, 230, .24);
  --fill-1: rgba(255, 225, 233, .04);
  --fill-2: rgba(255, 225, 233, .07);
  --fill-3: rgba(255, 225, 233, .11);
  --hover: rgba(255, 225, 233, .06);
  --press: rgba(255, 225, 233, .10);
  --scrim: rgba(5, 1, 3, .55);
  --selection: rgba(255, 80, 120, .30);
  --focus: #FF6F8F;
  --focus-halo: rgba(18, 8, 11, .9);

  --ok: #2FBF74;    --ok-ink: #5ED896;    --ok-soft: rgba(47, 191, 116, .16);   --ok-line: rgba(47, 191, 116, .40);
  --warn: #F2B33D;  --warn-ink: #F6C462;  --warn-soft: rgba(242, 179, 61, .16); --warn-line: rgba(242, 179, 61, .42);
  --crit: #FF5A36;  --crit-ink: #FF8466;  --crit-soft: rgba(255, 90, 54, .16);  --crit-line: rgba(255, 90, 54, .42);
  --info: #8D87F5;  --info-ink: #ABA6FF;  --info-soft: rgba(141, 135, 245, .17); --info-line: rgba(141, 135, 245, .40);
  --neutral: #9D8F95; --neutral-ink: #C3B5BA; --neutral-soft: rgba(190, 172, 179, .13); --neutral-line: rgba(190, 172, 179, .32);

  --c1: #E0305A; --c2: #8079F0; --c3: #13A39E; --c4: #DD7428; --c5: #D455A8;
  --chart-grid: rgba(255, 220, 230, .09);
  --chart-track: rgba(255, 220, 230, .10);
  --chart-surface: #1F1317;
  --chart-area-opacity: .22;

  --dept-ceo: #E0305A; --dept-finance: #8079F0; --dept-sales: #E4782F; --dept-marketing: #D455A8;
  --dept-hr: #19A9A3; --dept-warehouse: #9B78E0; --dept-supply: #D49A3A; --dept-bi: #6D97C9; --dept-planned: #8E7F85;

  --glass-blur: 28px;
  --glass-sat: 160%;
  --glass-fill: linear-gradient(160deg, rgba(62, 34, 44, .62) 0%, rgba(32, 16, 22, .50) 100%);
  --glass-fill-hover: linear-gradient(160deg, rgba(72, 40, 51, .68) 0%, rgba(38, 19, 26, .56) 100%);
  --glass-thin-fill: linear-gradient(180deg, rgba(48, 26, 34, .58) 0%, rgba(28, 14, 19, .48) 100%);
  --glass-thick-fill: linear-gradient(165deg, rgba(50, 28, 36, .90) 0%, rgba(30, 16, 21, .86) 100%);
  --glass-tint-fill: linear-gradient(140deg, rgba(232, 40, 88, .86) 0%, rgba(196, 16, 60, .82) 48%, rgba(130, 8, 38, .88) 100%);
  --glass-inner-fill: rgba(255, 235, 240, .05);
  --glass-rim: linear-gradient(150deg, rgba(255, 255, 255, .34) 0%, rgba(255, 255, 255, .10) 24%, rgba(255, 255, 255, .03) 52%, rgba(255, 255, 255, .08) 78%, rgba(255, 210, 222, .26) 100%);
  --glass-rim-tint: linear-gradient(150deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .12) 40%, rgba(255, 255, 255, .04) 60%, rgba(255, 200, 215, .35) 100%);
  --glass-edge: 0 0 0 .5px rgba(0, 0, 0, .45);
  --glass-inset: inset 0 1px 0 rgba(255, 255, 255, .13), inset 0 -1px 0 rgba(255, 255, 255, .03), inset 0 -18px 30px -22px rgba(255, 120, 150, .22);
  --glass-inset-tint: inset 0 1px 0 rgba(255, 255, 255, .38), inset 0 -1px 0 rgba(255, 255, 255, .08), inset 0 -16px 26px -18px rgba(255, 140, 170, .45);
  --glass-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 12px 28px -10px rgba(0, 0, 0, .55), 0 30px 60px -28px rgba(120, 6, 34, .45);
  --glass-shadow-hover: 0 2px 4px rgba(0, 0, 0, .4), 0 18px 36px -12px rgba(0, 0, 0, .6), 0 36px 72px -28px rgba(160, 10, 46, .55);
  --glass-shadow-thin: 0 1px 2px rgba(0, 0, 0, .35), 0 14px 34px -14px rgba(0, 0, 0, .6);
  --glass-shadow-thick: 0 2px 8px rgba(0, 0, 0, .45), 0 40px 90px -24px rgba(0, 0, 0, .75);
  --glass-shadow-tint: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 30px -8px rgba(224, 30, 80, .55);
  --glass-sheen: rgba(255, 200, 215, .16);
  --glass-sheen-tint: rgba(255, 210, 225, .30);
  --glass-highlight: radial-gradient(120% 70% at 50% -20%, rgba(255, 210, 222, .10), rgba(255, 210, 222, 0) 60%);

  --scene-base: radial-gradient(120% 80% at 80% -10%, #3A0A1A 0%, rgba(58, 10, 26, 0) 60%), linear-gradient(180deg, #160A0E 0%, #0E0609 100%);
  --blob-1: rgba(214, 22, 70, .42);
  --blob-2: rgba(140, 10, 50, .50);
  --blob-3: rgba(255, 90, 130, .16);
  --blob-4: rgba(40, 190, 130, .13);
  --blob-5: rgba(110, 40, 160, .20);
  --scene-ring: rgba(255, 60, 100, .06);
  --scene-ring-edge: rgba(255, 90, 125, .12);
  --o3-1: rgba(255, 60, 100, .16);
  --o3-2: rgba(255, 220, 230, .07);
  --o3-3: rgba(255, 60, 100, .11);
  --noise-opacity: .07;
}