html[data-newapi-apple-theme='on'] {
  --background: #f5f5f7;
  --foreground: #1d1d1f;
  --card: #ffffff;
  --card-foreground: #1d1d1f;
  --popover: #ffffff;
  --popover-foreground: #1d1d1f;
  --primary: #167858;
  --primary-foreground: #ffffff;
  --secondary: #f0f1f2;
  --secondary-foreground: #343437;
  --muted: #f0f1f2;
  --muted-foreground: #6e6e73;
  --accent: #e9f3ef;
  --accent-foreground: #0f6247;
  --border: #dedee3;
  --input: #d2d2d7;
  --ring: #16845b;
  --sidebar: #ffffff;
  --sidebar-foreground: #343437;
  --sidebar-primary: #167858;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #edf5f1;
  --sidebar-accent-foreground: #0f6247;
  --sidebar-border: #e5e5ea;
  --sidebar-ring: #16845b;
  --overview-accent-1: #167858;
  --overview-accent-2: #4f7466;
  --overview-accent-3: #899a93;
  --chart-1: #167858;
  --chart-2: #4d7768;
  --chart-3: #7c9189;
  --chart-4: #2f966f;
  --chart-5: #a0aaa6;
  --newapi-surface: #ffffff;
  --newapi-surface-subtle: #fafafa;
  --newapi-surface-raised: #ffffff;
  --newapi-border-strong: #c7c7cc;
  --newapi-shadow: 0 1px 2px rgba(29, 29, 31, 0.04), 0 12px 32px rgba(29, 29, 31, 0.055);
  --newapi-shadow-menu: 0 18px 48px rgba(29, 29, 31, 0.14);
  color-scheme: light;
}

html.dark[data-newapi-apple-theme='on'] {
  --background: #000000;
  --foreground: #f5f5f7;
  --card: #1c1c1e;
  --card-foreground: #f5f5f7;
  --popover: #1c1c1e;
  --popover-foreground: #f5f5f7;
  --primary: #45bd8a;
  --primary-foreground: #07140e;
  --secondary: #2c2c2e;
  --secondary-foreground: #f5f5f7;
  --muted: #2c2c2e;
  --muted-foreground: #a1a1a6;
  --accent: #17382b;
  --accent-foreground: #8ce0ba;
  --border: #38383a;
  --input: #48484a;
  --ring: #45bd8a;
  --sidebar: #1c1c1e;
  --sidebar-foreground: #f5f5f7;
  --sidebar-primary: #45bd8a;
  --sidebar-primary-foreground: #07140e;
  --sidebar-accent: #203c30;
  --sidebar-accent-foreground: #8ce0ba;
  --sidebar-border: #38383a;
  --sidebar-ring: #45bd8a;
  --overview-accent-1: #45bd8a;
  --overview-accent-2: #78a895;
  --overview-accent-3: #63736d;
  --chart-1: #45bd8a;
  --chart-2: #6fa48f;
  --chart-3: #91a49c;
  --chart-4: #57ce99;
  --chart-5: #727c78;
  --newapi-surface: #1c1c1e;
  --newapi-surface-subtle: #242426;
  --newapi-surface-raised: #242426;
  --newapi-border-strong: #545458;
  --newapi-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 16px 40px rgba(0, 0, 0, 0.28);
  --newapi-shadow-menu: 0 20px 56px rgba(0, 0, 0, 0.46);
  color-scheme: dark;
}

html[data-newapi-apple-theme='on'],
html[data-newapi-apple-theme='on'] body,
html[data-newapi-apple-theme='on'] #root {
  min-height: 100%;
  background: var(--background);
  color: var(--foreground);
}

html[data-newapi-apple-theme='on'] body,
html[data-newapi-apple-theme='on'] button,
html[data-newapi-apple-theme='on'] input,
html[data-newapi-apple-theme='on'] textarea,
html[data-newapi-apple-theme='on'] select {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "PingFang SC", "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

html[data-newapi-apple-theme='on'] a {
  text-underline-offset: 3px;
}

html[data-newapi-apple-theme='on'] a:hover {
  color: var(--primary);
}

html[data-newapi-apple-theme='on'] header {
  background: color-mix(in srgb, var(--newapi-surface) 88%, transparent) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  box-shadow: none !important;
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
}

html[data-newapi-apple-theme='on'] header > div {
  max-width: 1280px !important;
}

html[data-newapi-apple-theme='on'] header nav {
  min-height: 64px;
}

html[data-newapi-apple-theme='on'] header nav a {
  border-radius: 8px !important;
  color: var(--muted-foreground);
  font-weight: 560;
  transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

html[data-newapi-apple-theme='on'] header nav a:hover,
html[data-newapi-apple-theme='on'] header nav a:focus-visible {
  color: var(--foreground);
  background: var(--muted);
}

html[data-newapi-apple-theme='on'] header nav a.active,
html[data-newapi-apple-theme='on'] header nav a[data-status='active'],
html[data-newapi-apple-theme='on'] header nav a[aria-current='page'] {
  color: var(--foreground) !important;
  background: var(--muted) !important;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--foreground) !important;
  text-decoration: none !important;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand > div:first-child,
html[data-newapi-apple-theme='on'] .newapi-app-brand > span:first-child {
  display: inline-flex !important;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(29, 29, 31, 0.12);
}

html[data-newapi-apple-theme='on'] .newapi-app-brand img {
  width: 100%;
  height: 100%;
  border-radius: 8px;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand > div:first-child:has([data-slot='skeleton']) {
  background: #167858 url('/homepage-assets/newapi-relay-logo.svg') center / cover no-repeat !important;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand > div:first-child:has([data-slot='skeleton']) [data-slot='skeleton'] {
  opacity: 0 !important;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand > [data-slot='skeleton']:last-child,
html[data-newapi-apple-theme='on'] .newapi-app-brand > span:last-child:has([data-slot='skeleton']) {
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  animation: none !important;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand > [data-slot='skeleton']:last-child::after,
html[data-newapi-apple-theme='on'] .newapi-app-brand > span:last-child:has([data-slot='skeleton'])::after {
  content: 'New API';
  color: var(--foreground);
  font-size: 0.9375rem;
  font-weight: 680;
  line-height: 1;
}

html[data-newapi-apple-theme='on'] .newapi-app-brand > span:last-child:has([data-slot='skeleton']) [data-slot='skeleton'] {
  display: none !important;
}

html[data-newapi-apple-theme='on'] [data-slot='button'],
html[data-newapi-apple-theme='on'] button {
  border-radius: 8px !important;
  box-shadow: none;
  font-weight: 560;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 120ms ease;
}

html[data-newapi-apple-theme='on'] [data-slot='button']:not([class*='size-']) {
  min-height: 40px;
}

html[data-newapi-apple-theme='on'] [data-slot='button'][class*='bg-primary'],
html[data-newapi-apple-theme='on'] button[class*='bg-primary'] {
  border-color: var(--primary) !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  box-shadow: 0 1px 2px rgba(22, 120, 88, 0.18);
}

html[data-newapi-apple-theme='on'] [data-slot='button'][class*='bg-primary']:hover,
html[data-newapi-apple-theme='on'] button[class*='bg-primary']:hover {
  background: color-mix(in srgb, var(--primary) 88%, #000000) !important;
}

html[data-newapi-apple-theme='on'] [data-slot='button']:active,
html[data-newapi-apple-theme='on'] button:active {
  transform: translateY(1px) scale(0.99);
}

html[data-newapi-apple-theme='on'] [data-slot='button']:focus-visible,
html[data-newapi-apple-theme='on'] button:focus-visible,
html[data-newapi-apple-theme='on'] input:focus-visible,
html[data-newapi-apple-theme='on'] textarea:focus-visible,
html[data-newapi-apple-theme='on'] select:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ring) 58%, transparent) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}

html[data-newapi-apple-theme='on'] input:not([type='checkbox']):not([type='radio']):not([type='range']),
html[data-newapi-apple-theme='on'] textarea,
html[data-newapi-apple-theme='on'] select,
html[data-newapi-apple-theme='on'] [data-slot='form-control'] {
  min-height: 42px;
  border: 1px solid var(--input) !important;
  border-radius: 8px !important;
  background: var(--newapi-surface) !important;
  color: var(--foreground) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

html[data-newapi-apple-theme='on'] textarea {
  min-height: 96px;
}

html[data-newapi-apple-theme='on'] input::placeholder,
html[data-newapi-apple-theme='on'] textarea::placeholder {
  color: color-mix(in srgb, var(--muted-foreground) 78%, transparent) !important;
  opacity: 1;
}

html[data-newapi-apple-theme='on'] [data-slot='form-label'] {
  color: var(--foreground);
  font-size: 0.8125rem;
  font-weight: 600;
}

html[data-newapi-apple-theme='on'] [data-slot='card'],
html[data-newapi-apple-theme='on'] [class*='rounded-2xl'][class*='border'],
html[data-newapi-apple-theme='on'] [class*='rounded-xl'][class*='border'] {
  border-color: var(--border) !important;
  border-radius: 8px !important;
  background: var(--card) !important;
  box-shadow: var(--newapi-shadow) !important;
}

html[data-newapi-apple-theme='on'] [class*='shadow-xs'],
html[data-newapi-apple-theme='on'] [class*='shadow-sm'],
html[data-newapi-apple-theme='on'] [class*='shadow-md'] {
  box-shadow: var(--newapi-shadow) !important;
}

html[data-newapi-apple-theme='on'] [data-slot='dropdown-menu-content'],
html[data-newapi-apple-theme='on'] [data-slot='popover-content'],
html[data-newapi-apple-theme='on'] [data-slot='dialog-content'],
html[data-newapi-apple-theme='on'] [data-slot='select-content'],
html[data-newapi-apple-theme='on'] [role='dialog'],
html[data-newapi-apple-theme='on'] [role='menu'] {
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--popover) !important;
  box-shadow: var(--newapi-shadow-menu) !important;
}

html[data-newapi-apple-theme='on'] [data-slot='dropdown-menu-item'],
html[data-newapi-apple-theme='on'] [data-slot='select-item'] {
  border-radius: 6px !important;
}

html[data-newapi-apple-theme='on'] [data-slot='dropdown-menu-item']:focus,
html[data-newapi-apple-theme='on'] [data-slot='select-item']:focus,
html[data-newapi-apple-theme='on'] [data-highlighted] {
  background: var(--muted) !important;
  color: var(--foreground) !important;
}

html[data-newapi-apple-theme='on'] [data-slot='badge'] {
  border-color: var(--border) !important;
  font-weight: 560;
}

html[data-newapi-apple-theme='on'] [data-slot='tabs-list'] {
  border-radius: 8px !important;
  background: var(--muted) !important;
  padding: 3px;
}

html[data-newapi-apple-theme='on'] [data-slot='tabs-trigger'] {
  border-radius: 6px !important;
  color: var(--muted-foreground);
}

html[data-newapi-apple-theme='on'] [data-slot='tabs-trigger'][data-state='active'] {
  background: var(--newapi-surface) !important;
  color: var(--foreground) !important;
  box-shadow: 0 1px 3px rgba(29, 29, 31, 0.1) !important;
}

html[data-newapi-apple-theme='on'] table,
html[data-newapi-apple-theme='on'] [data-slot='table'] {
  border-collapse: separate;
  border-spacing: 0;
  color: var(--foreground);
}

html[data-newapi-apple-theme='on'] thead,
html[data-newapi-apple-theme='on'] [data-slot='table-header'] {
  background: var(--newapi-surface-subtle);
}

html[data-newapi-apple-theme='on'] th,
html[data-newapi-apple-theme='on'] [data-slot='table-head'] {
  color: var(--muted-foreground) !important;
  font-size: 0.75rem;
  font-weight: 620 !important;
}

html[data-newapi-apple-theme='on'] tr,
html[data-newapi-apple-theme='on'] [data-slot='table-row'] {
  border-color: var(--border) !important;
}

html[data-newapi-apple-theme='on'] tbody tr:hover,
html[data-newapi-apple-theme='on'] [data-slot='table-row']:hover {
  background: color-mix(in srgb, var(--muted) 66%, transparent) !important;
}

html[data-newapi-apple-theme='on'] [data-slot='skeleton'] {
  background: color-mix(in srgb, var(--muted) 86%, var(--newapi-surface)) !important;
}

html[data-newapi-apple-theme='on'] [data-sonner-toast][data-styled='true'] {
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--newapi-surface-raised) !important;
  box-shadow: var(--newapi-shadow-menu) !important;
}

html[data-newapi-dashboard-theme='on'] [data-slot='avatar-fallback'] {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
}

html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-inner'] {
  border-right: 1px solid var(--sidebar-border);
  background: var(--sidebar) !important;
  box-shadow: none !important;
}

html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-group-label'] {
  color: var(--muted-foreground) !important;
  font-size: 0.6875rem;
  font-weight: 620;
  letter-spacing: 0 !important;
}

html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-menu-button'] {
  min-height: 38px;
  border-radius: 7px !important;
}

html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-menu-button'].active,
html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-menu-button'][data-active='true'] {
  color: var(--sidebar-accent-foreground) !important;
  background: var(--sidebar-accent) !important;
  box-shadow: inset 3px 0 0 var(--primary);
}

html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-inset'] {
  margin: 0 !important;
  border-radius: 0 !important;
  background: var(--background) !important;
  box-shadow: none !important;
}

html[data-newapi-auth-theme='on'] body,
html[data-newapi-auth-theme='on'] #root,
html[data-newapi-auth-theme='on'] #root > .relative.grid {
  min-height: 100dvh !important;
  background: var(--background) !important;
}

html[data-newapi-auth-theme='on'] #root > .relative.grid > .newapi-app-brand {
  top: 28px !important;
  left: 32px !important;
}

html[data-newapi-auth-theme='on'] #root > .relative.grid > .container {
  display: flex;
  min-height: 100dvh;
  align-items: center;
  justify-content: center;
  padding: 88px 24px 40px !important;
}

html[data-newapi-auth-theme='on'] #root > .relative.grid > .container > div {
  width: min(100%, 440px) !important;
  margin: 0 auto;
  padding: 38px !important;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--newapi-surface);
  box-shadow: var(--newapi-shadow);
}

html[data-newapi-auth-theme='on'] #root > .relative.grid > .container > div > div {
  gap: 26px;
}

html[data-newapi-auth-theme='on'] #root h2 {
  color: var(--foreground);
  font-size: 1.75rem !important;
  font-weight: 680 !important;
  line-height: 1.15;
  text-align: left !important;
}

html[data-newapi-auth-theme='on'] #root h2 + p {
  color: var(--muted-foreground) !important;
  line-height: 1.6;
}

html[data-newapi-auth-theme='on'] #root form {
  gap: 18px !important;
}

html[data-newapi-auth-theme='on'] #root form [data-slot='button'][type='submit'] {
  min-height: 42px;
  margin-top: 4px !important;
}

html[data-newapi-public-theme='on'] #root > div[class*='min-h-svh'] {
  background: var(--background) !important;
}

html[data-newapi-public-theme='on'] main {
  color: var(--foreground);
}

html[data-newapi-overview-theme='on'] [class*='bg-[radial-gradient'] {
  background: linear-gradient(112deg, #ffffff 0%, #f7f8f8 56%, #edf4f1 100%) !important;
  opacity: 1 !important;
}

html.dark[data-newapi-overview-theme='on'] [class*='bg-[radial-gradient'] {
  background: linear-gradient(112deg, #1c1c1e 0%, #202522 56%, #173228 100%) !important;
}

html[data-newapi-overview-theme='on'] [class*='bg-[linear-gradient(135deg'] {
  background: #f1f6f4 !important;
}

html.dark[data-newapi-overview-theme='on'] [class*='bg-[linear-gradient(135deg'] {
  background: #203329 !important;
}

html[data-newapi-overview-theme='on'] [class*='text-overview-accent-1'],
html[data-newapi-overview-theme='on'] [class*='text-overview-accent-2'],
html[data-newapi-overview-theme='on'] [class*='text-overview-accent-3'] {
  color: var(--primary) !important;
}

html[data-newapi-overview-theme='on'] main h2,
html[data-newapi-overview-theme='on'] main h3 {
  color: var(--foreground);
  letter-spacing: 0 !important;
}

html[data-newapi-overview-theme='on'] main h2 {
  font-weight: 680;
}

html[data-newapi-overview-theme='on'] main pre,
html[data-newapi-overview-theme='on'] main code {
  font-variant-ligatures: none;
}

html[data-newapi-overview-theme='on'] main [class*='backdrop-blur'] {
  backdrop-filter: none !important;
}

@media (max-width: 767px) {
  html[data-newapi-apple-theme='on'] header nav {
    min-height: 56px;
  }

  html[data-newapi-apple-theme='on'] .newapi-app-brand > div:first-child,
  html[data-newapi-apple-theme='on'] .newapi-app-brand > span:first-child {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
  }

  html[data-newapi-rankings-theme='on'] [class*='max-w-[1280px]'][class*='pt-16'] {
    padding-top: 5rem !important;
  }

  html[data-newapi-auth-theme='on'] #root > .relative.grid > .newapi-app-brand {
    top: 20px !important;
    left: 20px !important;
  }

  html[data-newapi-auth-theme='on'] #root > .relative.grid > .container {
    padding: 76px 16px 24px !important;
  }

  html[data-newapi-auth-theme='on'] #root > .relative.grid > .container > div {
    padding: 28px 22px !important;
  }

  html[data-newapi-auth-theme='on'] #root h2 {
    font-size: 1.5rem !important;
  }

  html[data-newapi-dashboard-theme='on'] [data-slot='sidebar-inset'] > main > div:first-child {
    padding-top: 0.75rem !important;
  }

  html[data-newapi-overview-theme='on'] main h2 {
    font-size: 1.0625rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-newapi-apple-theme='on'] *,
  html[data-newapi-apple-theme='on'] *::before,
  html[data-newapi-apple-theme='on'] *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
