@import url(https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap);
.w-md-editor {
  background-color: var(--color-background, #fff) !important;
  box-shadow: none !important;
  font-family: var(--font-sans, "Inter", system-ui, sans-serif) !important;
  border: none !important;
  border-radius: .75rem !important;
}

.dark .w-md-editor {
  background-color: var(--color-dark-surface, #111827) !important;
  color: var(--color-dark-text, #e2e8f0) !important;
}

.w-md-editor-toolbar {
  scrollbar-width: none;
  background-color: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  flex-wrap: nowrap !important;
  min-height: 40px !important;
  padding: 6px 8px !important;
  overflow: auto hidden !important;
}

.w-md-editor-toolbar::-webkit-scrollbar {
  display: none;
}

.w-md-editor-toolbar ul {
  flex-wrap: nowrap !important;
}

.dark .w-md-editor-toolbar {
  background-color: var(--color-dark-card, #151c28) !important;
  border-bottom-color: var(--color-dark-border, #2a3141) !important;
}

.w-md-editor-toolbar li > button {
  color: #64748b !important;
  border-radius: 6px !important;
  flex-shrink: 0 !important;
  width: 28px !important;
  height: 28px !important;
}

.w-md-editor-toolbar li > button:hover {
  color: var(--color-primary, #2d3670) !important;
  background-color: #f1f5f9 !important;
}

.dark .w-md-editor-toolbar li > button {
  color: #94a3b8 !important;
}

.dark .w-md-editor-toolbar li > button:hover {
  color: var(--color-primary-300, #a5b1db) !important;
  background-color: var(--color-dark-hover, #1c2535) !important;
}

.w-md-editor-toolbar li.active > button {
  color: var(--color-primary, #2d3670) !important;
  background-color: #2d367014 !important;
}

.dark .w-md-editor-toolbar li.active > button {
  color: var(--color-primary-300, #a5b1db) !important;
  background-color: #a5b1db1a !important;
}

.w-md-editor-toolbar-divider {
  background-color: #e2e8f0 !important;
  flex-shrink: 0 !important;
}

.dark .w-md-editor-toolbar-divider {
  background-color: var(--color-dark-border, #2a3141) !important;
}

.w-md-editor-content {
  background-color: #fff !important;
}

.dark .w-md-editor-content {
  background-color: var(--color-dark-surface, #111827) !important;
}

.w-md-editor-text, .w-md-editor-text-input, .w-md-editor-text-pre, .w-md-editor-text-pre > code {
  letter-spacing: normal !important;
  -moz-tab-size: 2 !important;
  tab-size: 2 !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.w-md-editor-text-input {
  color: #1e293b !important;
  caret-color: var(--color-primary, #2d3670) !important;
}

.dark .w-md-editor-text-input {
  color: var(--color-dark-text, #e2e8f0) !important;
}

.w-md-editor-preview {
  background-color: #fafbfc !important;
  border-left: 1px solid #e2e8f0 !important;
  padding: 12px 16px !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.dark .w-md-editor-preview {
  background-color: var(--color-dark-card, #151c28) !important;
  border-left-color: var(--color-dark-border, #2a3141) !important;
}

.wmde-markdown {
  font-family: var(--font-sans, "Inter", system-ui, sans-serif) !important;
  color: #334155 !important;
  background-color: #0000 !important;
  font-size: 13px !important;
}

.dark .wmde-markdown {
  color: #cbd5e1 !important;
}

.wmde-markdown h1, .wmde-markdown h2, .wmde-markdown h3, .wmde-markdown h4 {
  color: #0f172a !important;
  border-bottom: none !important;
}

.dark .wmde-markdown h1, .dark .wmde-markdown h2, .dark .wmde-markdown h3, .dark .wmde-markdown h4 {
  color: var(--color-dark-text, #e2e8f0) !important;
}

.wmde-markdown code {
  background-color: #f1f5f9 !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
}

.dark .wmde-markdown code {
  background-color: var(--color-dark-elevated, #1a2234) !important;
}

.wmde-markdown pre {
  background-color: #f1f5f9 !important;
  border-radius: 8px !important;
}

.dark .wmde-markdown pre {
  background-color: var(--color-dark-elevated, #1a2234) !important;
}

.wmde-markdown blockquote {
  border-left: 3px solid var(--color-primary, #2d3670) !important;
  color: #64748b !important;
}

.dark .wmde-markdown blockquote {
  color: #94a3b8 !important;
}

.wmde-markdown table th {
  background-color: #f8fafc !important;
}

.dark .wmde-markdown table th {
  background-color: var(--color-dark-card, #151c28) !important;
}

.wmde-markdown table td, .wmde-markdown table th {
  border-color: #e2e8f0 !important;
}

.dark .wmde-markdown table td, .dark .wmde-markdown table th {
  border-color: var(--color-dark-border, #2a3141) !important;
}

.w-md-editor-text-pre > code > span:first-child:before {
  color: #94a3b8 !important;
}

@custom-variant dark (& :is(. dark * ));

@theme inline {
    --font-display: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif; --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif; --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;   --radius-2xl: 1rem; --radius-xl: .75rem; --radius-lg: .5rem; --radius-md: .375rem; --radius-sm: .25rem; --radius-button: .5rem;   --ease-editorial: cubic-bezier(.2, .8, .2, 1) ; --ease-precise: cubic-bezier(.4, 0, .2, 1) ; --ease-spring: cubic-bezier(.34, 1.56, .64, 1) ; --duration-fast: .12s; --duration-base: .22s; --duration-slow: .42s;     --color-primary: var(--primary) ; --color-primary-hover: var(--primary-hover) ; --color-primary-50: #f0f2f9; --color-primary-100: #e1e5f3; --color-primary-200: #c3cbe7; --color-primary-300: #a5b1db; --color-primary-400: #8797cf; --color-primary-500: #2d3670; --color-primary-600: #242b5a; --color-primary-700: #1b2044; --color-primary-800: #12152e; --color-primary-900: #090a18; --color-primary-950: #04050c;   --color-background: var(--background) ; --color-foreground: var(--foreground) ; --color-card: var(--card) ; --color-card-foreground: var(--card-foreground) ; --color-popover: var(--popover) ; --color-popover-foreground: var(--popover-foreground) ; --color-primary-foreground: var(--primary-foreground) ; --color-secondary: var(--secondary) ; --color-secondary-foreground: var(--secondary-foreground) ; --color-muted: var(--muted) ; --color-muted-foreground: var(--muted-foreground) ; --color-accent: var(--accent) ; --color-accent-foreground: var(--accent-foreground) ; --color-destructive: var(--destructive) ; --color-destructive-foreground: var(--destructive-foreground) ; --color-border: var(--border) ; --color-input: var(--input) ; --color-ring: var(--ring) ;   --color-surface-raised: var(--surface-raised) ; --color-surface-sunken: var(--surface-sunken) ; --color-hairline: var(--hairline) ; --color-hairline-strong: var(--hairline-strong) ;   --color-signal-nominal: var(--signal-nominal) ; --color-signal-anomaly: var(--signal-anomaly) ; --color-signal-critical: var(--signal-critical) ;   --color-dark-bg: #0b0f19; --color-dark-surface: #111827; --color-dark-surface-hover: #1a2234; --color-dark-card: #151c28; --color-dark-elevated: #1a2234; --color-dark-border: #2a3141; --color-dark-hover: #1c2535; --color-dark-text: #e2e8f0; --color-dark-text-secondary: #94a3b8;   --color-dark-canvas: #1c2538;   --color-app-bg: #f5f7fd;   --shadow-custom: 0 0 12px 0 #0f172a0d, 0 1px 2px 0 #0f172a0a; --shadow-custom-dark: 0 0 12px 0 #0000004d; --shadow-sm: 0 1px 2px #0f172a0d; --shadow-md: 0 4px 14px #0f172a14; --shadow-lg: 0 12px 32px #0f172a1f; --shadow-editorial: 0 1px 0 0 var(--hairline), 0 12px 32px -12px #0f172a1f;   --chart-1: var(--primary) ; --chart-2: #58acad; --chart-3: #c2954f; --chart-4: #913263; --chart-5: #0d8c60; --chart-6: #057cc1;   --badge-success-bg: #ecfdf5; --badge-success-bg-dark: #22c55e1a; --badge-success-text: #166534; --badge-success-text-dark: #4ade80; --badge-success-dot: #22c55e; --badge-success-border: #bbf7d0; --badge-success-border-dark: #22c55e33; --badge-danger-bg: #fef2f2; --badge-danger-bg-dark: #ef44441a; --badge-danger-text: #991b1b; --badge-danger-text-dark: #fca5a5; --badge-danger-dot: #ef4444; --badge-danger-border: #fecaca; --badge-danger-border-dark: #ef444433; --badge-warning-bg: #fffbeb; --badge-warning-bg-dark: #f59e0b1a; --badge-warning-text: #92400e; --badge-warning-text-dark: #fbbf24; --badge-warning-dot: #f59e0b; --badge-warning-border: #fde68a; --badge-warning-border-dark: #f59e0b33; --badge-info-bg: #eff6ff; --badge-info-bg-dark: #0ea5e91a; --badge-info-text: #1e40af; --badge-info-text-dark: #38bdf8; --badge-info-dot: #0ea5e9; --badge-info-border: #bfdbfe; --badge-info-border-dark: #0ea5e933; --badge-orange-bg: #fff7ed; --badge-orange-bg-dark: #f973161a; --badge-orange-text: #9a3412; --badge-orange-text-dark: #fb923c; --badge-orange-dot: #f97316; --badge-orange-border: #fed7aa; --badge-orange-border-dark: #f9731633; --badge-neutral-bg: #f8fafc; --badge-neutral-bg-dark: #64748b1a; --badge-neutral-text: #475569; --badge-neutral-text-dark: #94a3b8; --badge-neutral-dot: #94a3b8; --badge-neutral-border: #e2e8f0; --badge-neutral-border-dark: #64748b33;
}

@layer base {
  *, :before, :after {
    border-color: var(--border);
  }

  html {
    scroll-behavior: smooth;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  body {
    background-color: var(--background);
    color: var(--foreground);
    font-family: var(--font-sans);
    font-feature-settings: "ss01", "cv01", "cv11";
    font-optical-sizing: auto;
    letter-spacing: -.005em;
    font-weight: 400;
  }

  h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    letter-spacing: -.022em;
    font-weight: 700;
  }

  strong, b {
    font-weight: 700;
  }

  .tnum, table, kbd, [data-tabular], [data-kpi], button {
    font-variant-numeric: tabular-nums;
  }

  code, kbd, pre, samp, .font-mono, [class~="font-mono"] {
    font-family: var(--font-mono);
    font-variant-numeric: slashed-zero tabular-nums;
    font-feature-settings: "zero", "ss01";
  }

  ::selection {
    background-color: color-mix(in srgb, var(--primary) 30%, transparent);
    color: var(--primary-foreground);
  }

  :focus-visible {
    outline: 2px solid var(--ring);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
  }

  * {
    scrollbar-width: thin;
    scrollbar-color: var(--hairline-strong) transparent;
  }

  ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }

  ::-webkit-scrollbar-track {
    background: none;
  }

  ::-webkit-scrollbar-thumb {
    background: var(--hairline-strong);
    background-clip: padding-box;
    border: 2px solid #0000;
    border-radius: 9999px;
  }

  ::-webkit-scrollbar-thumb:hover {
    background: var(--muted-foreground);
    background-clip: padding-box;
  }

  a, button, summary, [role="button"], [role="tab"], [role="menuitem"], [role="option"], [role="switch"], [role="checkbox"], [role="radio"], input, select, textarea, label {
    transition: color var(--duration-fast) var(--ease-precise), background-color var(--duration-fast) var(--ease-precise), border-color var(--duration-fast) var(--ease-precise), box-shadow var(--duration-fast) var(--ease-precise), outline-color var(--duration-fast) var(--ease-precise), opacity var(--duration-fast) var(--ease-precise);
  }

  @media (prefers-reduced-motion: reduce) {
    *, :before, :after {
      scroll-behavior: auto !important;
      transition-duration: .01ms !important;
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
    }
  }

  :root {
    --primary-hover: color-mix(in oklab, var(--primary) 88%, #000);
  }

  :root, [data-theme="iohealth"] {
    --background: #f5f7fd;
    --foreground: #2d3670;
    --card: #fff;
    --card-foreground: #1e293b;
    --popover: #fff;
    --popover-foreground: #1e293b;
    --primary: #2d3670;
    --primary-foreground: #fff;
    --secondary: #913263;
    --secondary-foreground: #fff;
    --muted: #f1f5f9;
    --muted-foreground: #64748b;
    --accent: #f0f2f9;
    --accent-foreground: #2d3670;
    --destructive: #ef4444;
    --destructive-foreground: #fff;
    --border: #e2e8f0;
    --input: #e2e8f0;
    --ring: #2d3670;
    --surface-raised: #fff;
    --surface-sunken: #edf1f9;
    --hairline: #e2e8f0;
    --hairline-strong: #cbd5e1;
    --signal-nominal: #10b981;
    --signal-anomaly: #f59e0b;
    --signal-critical: #ef4444;
    --radius: .75rem;
  }

  [data-theme="digital-twin"] {
    --background: #f8f9fb;
    --foreground: #214545;
    --primary: #58acad;
    --primary-foreground: #fff;
    --muted: #ddeeef;
    --accent: #ddeeef;
    --accent-foreground: #214545;
    --border: #ddeeef;
    --input: #ddeeef;
    --ring: #58acad;
    --surface-raised: #fff;
    --surface-sunken: #ebf4f4;
    --hairline: #ddeeef;
    --hairline-strong: #b8d9d9;
    --signal-nominal: #58acad;
    --signal-anomaly: #c2954f;
    --signal-critical: #be2424;
  }

  [data-theme="digital-twin-sehhati"] {
    --background: #f4f7fc;
    --foreground: #000;
    --primary: #057cc1;
    --primary-foreground: #fff;
    --muted: #e6f5fe;
    --accent: #e6f5fe;
    --accent-foreground: #000;
    --border: #c7d6ee;
    --input: #c7d6ee;
    --ring: #057cc1;
    --surface-raised: #fff;
    --surface-sunken: #e6eef8;
    --hairline: #c7d6ee;
    --hairline-strong: #94abd0;
    --signal-nominal: #10b981;
    --signal-anomaly: #f59e0b;
    --signal-critical: #be2424;
  }

  [data-theme="modern"] {
    --background: #f5f7fd;
    --foreground: #13285a;
    --primary: #13285a;
    --primary-foreground: #fff;
    --destructive: #be2424;
    --muted: #f0f3f5;
    --accent: #f0f3f5;
    --accent-foreground: #13285a;
    --border: #e7ecf0;
    --input: #e7ecf0;
    --ring: #13285a;
    --surface-raised: #fff;
    --surface-sunken: #e9edf5;
    --hairline: #e7ecf0;
    --hairline-strong: #c9d1dc;
    --signal-nominal: #10b981;
    --signal-anomaly: #f59e0b;
    --signal-critical: #be2424;
    --radius: .5rem;
  }

  [data-theme="modern-moh"] {
    --background: #f5f7fd;
    --foreground: #424866;
    --primary: #0d8c60;
    --primary-foreground: #fff;
    --destructive: #be2424;
    --muted: #f0f3f5;
    --accent: #f3fbf8;
    --accent-foreground: #424866;
    --border: #e7ecf0;
    --input: #e7ecf0;
    --ring: #0d8c60;
    --surface-raised: #fff;
    --surface-sunken: #e9edf5;
    --hairline: #e7ecf0;
    --hairline-strong: #c9d1dc;
    --signal-nominal: #0d8c60;
    --signal-anomaly: #c2954f;
    --signal-critical: #be2424;
    --radius: .5rem;
  }

  [data-theme="modern"].dark, [data-theme="modern-moh"].dark, .dark {
    --background: #0b0f19;
    --foreground: #e2e8f0;
    --card: #111827;
    --card-foreground: #e2e8f0;
    --popover: #111827;
    --popover-foreground: #e2e8f0;
    --primary: #424c71;
    --primary-foreground: #0b0f19;
    --primary-hover: color-mix(in oklab, var(--primary) 86%, #fff);
    --secondary: #913263;
    --secondary-foreground: #fff;
    --muted: #1a2234;
    --muted-foreground: #94a3b8;
    --accent: #1a2234;
    --accent-foreground: #e2e8f0;
    --destructive: #ef4444;
    --destructive-foreground: #fff;
    --border: #2a3141;
    --input: #2a3141;
    --ring: #a5b1db;
    --surface-raised: #111827;
    --surface-sunken: #0b0f19;
    --hairline: #2a3141;
    --hairline-strong: #3a4356;
    --signal-nominal: #34d399;
    --signal-anomaly: #fbbf24;
    --signal-critical: #f87171;
  }

  button, a[href], summary, label[for], select, [role="button"], [role="tab"], [role="link"], [role="menuitem"], [role="option"], [role="switch"], [role="checkbox"], [role="radio"], [tabindex]:not([tabindex="-1"]) {
    cursor: pointer;
  }

  button:disabled, a[aria-disabled="true"], [role="button"][aria-disabled="true"], [aria-disabled="true"], [disabled] {
    cursor: not-allowed;
  }

  input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="url"], input[type="tel"], input[type="number"], textarea, [contenteditable="true"] {
    cursor: text;
  }
}

@layer utilities {
  .bg-grain {
    isolation: isolate;
    position: relative;
  }

  .bg-grain:after {
    content: "";
    pointer-events: none;
    z-index: 0;
    opacity: .08;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 width=%27160%27 height=%27160%27><filter id=%27n%27><feTurbulence type=%27fractalNoise%27 baseFrequency=%270.9%27 numOctaves=%272%27 stitchTiles=%27stitch%27/><feColorMatrix values=%270 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.6 0%27/></filter><rect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23n%29%27/></svg>");
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .dark .bg-grain:after {
    opacity: .04;
    mix-blend-mode: screen;
  }

  .bg-grid {
    background-image: linear-gradient(to right, color-mix(in srgb, currentColor 8%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in srgb, currentColor 8%, transparent) 1px, transparent 1px);
    background-size: 32px 32px;
  }

  .bg-grid-sm {
    background-image: linear-gradient(to right, color-mix(in srgb, currentColor 6%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in srgb, currentColor 6%, transparent) 1px, transparent 1px);
    background-size: 16px 16px;
  }

  .bracket-frame {
    position: relative;
  }

  .bracket-frame:before, .bracket-frame:after {
    content: "";
    border-color: var(--primary);
    opacity: .4;
    pointer-events: none;
    width: 12px;
    height: 12px;
    position: absolute;
  }

  .bracket-frame:before {
    border-top: 1px solid;
    border-left: 1px solid;
    top: 0;
    left: 0;
  }

  .bracket-frame:after {
    border-bottom: 1px solid;
    border-right: 1px solid;
    bottom: 0;
    right: 0;
  }

  .rule-h {
    background: var(--hairline);
    border: 0;
    height: 1px;
  }

  .rule-v {
    background: var(--hairline);
    border: 0;
    width: 1px;
  }

  .eyebrow {
    font-family: var(--font-mono);
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--muted-foreground);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
  }

  .font-display {
    font-family: var(--font-display);
    font-optical-sizing: auto;
  }

  .numerics {
    font-variant-numeric: tabular-nums slashed-zero;
    font-feature-settings: "zero", "ss01";
  }

  .scanlines {
    position: relative;
  }

  .scanlines:after {
    content: "";
    pointer-events: none;
    background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 2px, color-mix(in srgb, var(--foreground) 4%, transparent) 2px, color-mix(in srgb, var(--foreground) 4%, transparent) 3px);
    opacity: .25;
    mix-blend-mode: overlay;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .ring-editorial {
    box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
  }

  @keyframes uix-reveal-up {
    from {
      opacity: 0;
      transform: translateY(8px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes uix-fade-in {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  @keyframes uix-scale-in {
    from {
      opacity: 0;
      transform: scale(.96);
    }

    to {
      opacity: 1;
      transform: scale(1);
    }
  }

  @keyframes uix-slide-in-right {
    from {
      opacity: 0;
      transform: translateX(12px);
    }

    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @keyframes uix-slide-in-left {
    from {
      opacity: 0;
      transform: translateX(-12px);
    }

    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @keyframes uix-slide-in-down {
    from {
      opacity: 0;
      transform: translateY(-8px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes uix-soft-pulse {
    0%, 100% {
      opacity: 1;
    }

    50% {
      opacity: .55;
    }
  }

  @keyframes uix-float {
    0%, 100% {
      transform: translateY(0);
    }

    50% {
      transform: translateY(-4px);
    }
  }

  @keyframes uix-ticker {
    from {
      transform: translateX(0);
    }

    to {
      transform: translateX(-50%);
    }
  }

  @keyframes uix-pulse-ring {
    0% {
      opacity: .75;
      transform: scale(1);
    }

    80% {
      opacity: 0;
      transform: scale(2.2);
    }

    100% {
      opacity: 0;
      transform: scale(2.2);
    }
  }

  @keyframes uix-shimmer {
    0% {
      background-position: -200% 0;
    }

    100% {
      background-position: 200% 0;
    }
  }

  .animate-reveal-up {
    animation: uix-reveal-up var(--duration-slow) var(--ease-editorial) both;
  }

  .animate-fade-in {
    animation: uix-fade-in var(--duration-base) var(--ease-editorial) both;
  }

  .animate-scale-in {
    animation: uix-scale-in var(--duration-base) var(--ease-spring) both;
  }

  .animate-slide-in-right {
    animation: uix-slide-in-right var(--duration-base) var(--ease-editorial) both;
  }

  .animate-slide-in-left {
    animation: uix-slide-in-left var(--duration-base) var(--ease-editorial) both;
  }

  .animate-slide-in-down {
    animation: uix-slide-in-down var(--duration-base) var(--ease-editorial) both;
  }

  .animate-soft-pulse {
    animation: uix-soft-pulse 2.4s var(--ease-precise) infinite;
  }

  .animate-float {
    animation: uix-float 3.2s var(--ease-precise) infinite;
  }

  .animate-ticker {
    animation: 40s linear infinite uix-ticker;
  }

  .animate-pulse-ring {
    animation: uix-pulse-ring 1.8s var(--ease-precise) infinite;
  }

  .animate-shimmer {
    background: linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--primary) 12%, transparent) 50%, transparent 100%);
    animation: uix-shimmer 2.4s var(--ease-editorial) infinite;
    background-size: 200% 100%;
  }

  .stagger > * {
    animation: uix-reveal-up var(--duration-slow) var(--ease-editorial) both;
  }

  .stagger > :first-child {
    animation-delay: 0s;
  }

  .stagger > :nth-child(2) {
    animation-delay: 60ms;
  }

  .stagger > :nth-child(3) {
    animation-delay: .12s;
  }

  .stagger > :nth-child(4) {
    animation-delay: .18s;
  }

  .stagger > :nth-child(5) {
    animation-delay: .24s;
  }

  .stagger > :nth-child(6) {
    animation-delay: .3s;
  }

  .stagger > :nth-child(7) {
    animation-delay: .36s;
  }

  .stagger > :nth-child(8) {
    animation-delay: .42s;
  }

  @keyframes uix-page-enter {
    from {
      opacity: 0;
      transform: translateY(6px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes uix-page-exit {
    from {
      opacity: 1;
      transform: translateY(0);
    }

    to {
      opacity: 0;
      transform: translateY(-4px);
    }
  }

  .page-transition {
    animation: uix-page-enter var(--duration-slow) var(--ease-editorial) both;
    will-change: opacity, transform;
  }
}

html, body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
}

input, textarea, select, button, optgroup, fieldset, legend {
  font-family: inherit;
}

.font-sans {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
}

[class~="text-[10px]"], [class~="text-[9px]"], [class~="text-[8px]"], .uppercase.tracking-widest, .uppercase.tracking-wider, .uppercase.tracking-wide, .uppercase[class*="tracking-["] {
  font-weight: 700;
}

button:where(:not([class*="font-"])) {
  font-weight: 600;
}

[role="button"]:where(:not([class*="font-"])) {
  font-weight: 600;
}

strong, b, h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
}

.dark .react-flow__controls {
  background-color: var(--color-dark-elevated);
  border: 1px solid var(--color-dark-border);
  border-radius: .5rem;
  overflow: hidden;
  box-shadow: 0 1px 2px #0003;
}

.dark .react-flow__controls-button {
  background-color: var(--color-dark-elevated);
  border-bottom: 1px solid var(--color-dark-border);
  color: var(--color-dark-text);
}

.dark .react-flow__controls-button:hover {
  background-color: var(--color-dark-hover);
}

.dark .react-flow__controls-button svg {
  fill: var(--color-dark-text);
}

@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root) {
    animation-duration: var(--duration-slow);
    animation-timing-function: var(--ease-editorial);
    mix-blend-mode: normal;
    animation-fill-mode: both;
  }

  ::view-transition-new(root) {
    animation-duration: var(--duration-slow);
    animation-timing-function: var(--ease-editorial);
    mix-blend-mode: normal;
    animation-fill-mode: both;
  }

  ::view-transition-old(root) {
    animation-name: uix-page-exit;
  }

  ::view-transition-new(root) {
    animation-name: uix-page-enter;
  }
}

@source "../src";

@source "../vendor/uix/src";

[data-sonner-toaster] {
  --offset-top: 4.5rem !important;
  --mobile-offset-top: 4.5rem !important;
  --width: 23rem !important;
}

[data-sonner-toaster] li[data-sonner-toast] {
  --toast-accent: var(--color-slate-400);
  --toast-icon-margin-start: 0;
  --toast-icon-margin-end: 0;
  width: var(--width);
  border-radius: var(--radius-xl);
  font-family: var(--font-sans);
  box-shadow: inset 3px 0 0 0 var(--toast-accent), 0 10px 30px -12px #0f172a47, 0 2px 6px -2px #0f172a1f;
  align-items: center;
  gap: .75rem;
  padding: .875rem 1rem;
  display: flex;
}

.dark [data-sonner-toaster] li[data-sonner-toast] {
  box-shadow: inset 3px 0 0 0 var(--toast-accent), 0 12px 32px -12px #000000a6;
}

@media (max-width: 600px) {
  [data-sonner-toaster] li[data-sonner-toast] {
    width: calc(100% - var(--mobile-offset-left) * 2);
  }
}

[data-sonner-toaster] li[data-sonner-toast][data-type="success"] {
  --toast-accent: var(--color-emerald-500);
}

[data-sonner-toaster] li[data-sonner-toast][data-type="error"] {
  --toast-accent: var(--color-red-500);
}

[data-sonner-toaster] li[data-sonner-toast][data-type="warning"] {
  --toast-accent: var(--color-amber-500);
}

[data-sonner-toaster] li[data-sonner-toast][data-type="info"] {
  --toast-accent: var(--color-blue-500);
}

[data-sonner-toaster] li[data-sonner-toast] [data-icon] {
  width: 1.125rem;
  height: 1.125rem;
  color: var(--toast-accent);
}

[data-sonner-toaster] li[data-sonner-toast] [data-title] {
  letter-spacing: -.01em;
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.45;
}

[data-sonner-toaster] li[data-sonner-toast] [data-description] {
  font-size: .75rem;
  font-weight: 400;
  line-height: 1.5;
}

