html:root {
  --theme-font-family: Manrope, Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;

  --presentation: 242 241 236;
  --text-primary: 13 14 16;
  --text-secondary: 62 64 68;
  --text-secondary-alt: 88 90 94;
  --text-tertiary: 88 90 94;
  --text-muted: 88 90 94;

  --accent-primary: 74 93 0;
  --accent-primary-hover: 52 66 0;
  --link: 74 93 0;
  --link-hover: 52 66 0;
  --ring-primary: 13 14 16;

  --header-primary: 242 241 236;
  --header-hover: 235 234 228;
  --header-button-hover: 229 228 222;

  --surface-primary: 242 241 236;
  --surface-primary-alt: 235 234 228;
  --surface-primary-contrast: 231 230 224;
  --surface-secondary: 250 249 246;
  --surface-secondary-alt: 229 228 222;
  --surface-tertiary: 231 230 224;
  --surface-tertiary-alt: 250 249 246;
  --surface-dialog: 250 249 246;
  --surface-chat: 242 241 236;
  --surface-active: 224 223 216;
  --surface-active-alt: 229 228 222;
  --surface-hover: 229 228 222;
  --surface-hover-alt: 219 218 211;
  --surface-composer-hover: 229 228 222;
  --chart-widget-surface: 250 249 246;
  --chart-widget-stroke: 224 223 216;

  --surface-submit: 200 240 60;
  --surface-submit-hover: 184 222 40;
  --surface-inverted: 13 14 16;
  --surface-inverted-hover: 38 41 46;
  --text-inverted: 242 241 236;

  --border-light: 224 223 216;
  --border-medium: 208 207 199;
  --border-medium-alt: 208 207 199;
  --border-heavy: 128 129 122;
  --border-xheavy: 96 97 92;
}

html.dark {
  --presentation: 13 14 16;
  --text-primary: 242 241 236;
  --text-secondary: 205 204 198;
  --text-secondary-alt: 165 165 158;
  --text-tertiary: 165 165 158;
  --text-muted: 160 161 156;

  --accent-primary: 200 240 60;
  --accent-primary-hover: 222 250 120;
  --link: 200 240 60;
  --link-hover: 222 250 120;
  --ring-primary: 200 240 60;

  --header-primary: 13 14 16;
  --header-hover: 34 37 42;
  --header-button-hover: 34 37 42;

  --surface-primary: 13 14 16;
  --surface-primary-alt: 22 24 27;
  --surface-primary-contrast: 22 24 27;
  --surface-secondary: 28 30 34;
  --surface-secondary-alt: 28 30 34;
  --surface-tertiary: 38 41 46;
  --surface-tertiary-alt: 38 41 46;
  --surface-dialog: 22 24 27;
  --surface-chat: 38 41 46;
  --surface-active: 49 53 59;
  --surface-active-alt: 38 41 46;
  --surface-hover: 34 37 42;
  --surface-hover-alt: 49 53 59;
  --surface-composer-hover: 49 53 59;
  --chart-widget-surface: 22 24 27;
  --chart-widget-stroke: 38 41 46;

  --surface-submit: 200 240 60;
  --surface-submit-hover: 184 222 40;
  --surface-inverted: 242 241 236;
  --surface-inverted-hover: 224 223 216;
  --text-inverted: 13 14 16;

  --border-light: 38 41 46;
  --border-medium: 52 56 62;
  --border-medium-alt: 52 56 62;
  --border-heavy: 78 83 91;
  --border-xheavy: 120 125 133;
}

html,
body,
.font-sans,
.font-theme-ui {
  font-family: var(--theme-font-family);
}

html,
body,
html.dark,
html.dark body {
  background-color: rgb(var(--surface-primary));
}

.webkit-dark-styles,
.webkit-dark-styles:focus {
  -webkit-box-shadow: 0 0 0 50vh rgb(var(--surface-primary)) inset;
  box-shadow: 0 0 0 50vh rgb(var(--surface-primary)) inset;
}
html.dark .webkit-dark-styles,
html.dark .webkit-dark-styles:focus {
  -webkit-text-fill-color: rgb(var(--text-primary));
}

.bg-surface-submit {
  color: rgb(13 14 16);
}

#send-button:not(:disabled) {
  background-color: rgb(200 240 60);
}
#send-button:not(:disabled):hover {
  background-color: rgb(184 222 40);
}
#send-button svg {
  color: rgb(13 14 16);
}

html:not(.dark) .bg-surface-submit {
  box-shadow: inset 0 0 0 1px rgb(13 14 16 / 0.35);
}

html p.whitespace-pre-wrap a,
html li a,
html.dark p.whitespace-pre-wrap a,
html.dark li a {
  color: rgb(var(--link));
}
html p.whitespace-pre-wrap a:hover,
html li a:hover,
html.dark p.whitespace-pre-wrap a:hover,
html.dark li a:hover {
  color: rgb(var(--link-hover));
}

html.dark :focus-visible {
  outline-color: rgb(200 240 60);
}

.studio-nav,
.studio-nav-m {
  position: fixed;
  z-index: 30;
  display: none;
  font: 600 0.8125rem/1.2 var(--theme-font-family);
}
.studio-nav a,
.studio-nav-m a,
.studio-nav-m summary {
  color: rgb(var(--text-primary));
  text-decoration: none;
}

.studio-nav {
  top: 0.5rem;
  right: 4.25rem;
  box-sizing: border-box;
  height: 2.25rem;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid rgb(var(--border-medium));
  border-radius: 9999px;
  background-color: rgb(var(--surface-secondary));
}
.studio-nav a {
  display: inline-flex;
  align-items: center;
  height: 100%;
  padding: 0 0.8rem;
  border-radius: 9999px;
  color: rgb(var(--text-secondary));
  transition: background-color 150ms ease, color 150ms ease;
}
@media (min-width: 1100px) {
  .studio-nav {
    display: inline-flex;
  }
}

.studio-nav-sep {
  flex: none;
  width: 1px;
  height: 1rem;
  margin: 0 0.2rem;
  background-color: rgb(var(--border-medium));
}

.studio-nav-m {
  right: 1rem;
  bottom: 0.45rem;
}
.studio-nav-m > summary {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0.8rem;
  border: 1px solid rgb(var(--border-medium));
  border-radius: 9999px;
  background-color: rgb(var(--surface-secondary));
  cursor: pointer;
  list-style: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.studio-nav-m > summary::-webkit-details-marker {
  display: none;
}
.studio-nav-m > summary::after {
  content: '';
  width: 0.38rem;
  height: 0.38rem;
  margin-top: -0.2rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-135deg);
  transition: transform 150ms ease;
}
.studio-nav-m[open] > summary::after {
  margin-top: 0.1rem;
  transform: rotate(45deg);
}

.studio-nav-m[open] > summary::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
}
.studio-nav-m nav {
  position: absolute;
  right: 0;
  bottom: calc(100% + 0.5rem);
  display: flex;
  flex-direction: column;
  min-width: 10.5rem;
  padding: 0.25rem;
  border: 1px solid rgb(var(--border-medium));
  border-radius: 0.9rem;
  background-color: rgb(var(--surface-dialog));
  box-shadow: 0 8px 24px rgb(0 0 0 / 0.25);
}
.studio-nav-m nav a {
  padding: 0.6rem 0.8rem;
  border-radius: 0.6rem;
}
.studio-nav-m nav .studio-nav-sep {
  width: auto;
  height: 1px;
  margin: 0.25rem 0.5rem;
}
@media (max-width: 1099px) {
  .studio-nav-m {
    display: block;
  }
}
@media (max-width: 639px) {
  .studio-nav-m {
    right: auto;
    left: 6.25rem;
    bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  }
  .studio-nav-m nav {
    right: auto;
    left: 0;
  }
}

.studio-nav a:hover,
.studio-nav-m nav a:hover,
.studio-nav-m > summary:hover {
  background-color: rgb(var(--surface-hover));
  color: rgb(var(--text-primary));
}
.studio-nav a[aria-current='page'],
.studio-nav-m nav a[aria-current='page'] {
  background-color: rgb(200 240 60);
  color: rgb(13 14 16);
}
.studio-nav a:focus-visible,
.studio-nav-m a:focus-visible,
.studio-nav-m summary:focus-visible {
  outline: 2px solid rgb(var(--ring-primary));
  outline-offset: 2px;
}

body:has(.w-authPageWidth) .studio-nav,
body:has(.w-authPageWidth) .studio-nav-m,
body:has(div.fixed.inset-y-0.left-0.translate-x-0) .studio-nav-m {
  display: none;
}

div.min-h-screen.justify-center:has(> p.text-lg.font-semibold) {
  min-height: 0;
  padding-top: 1.5rem;
}
div.min-h-screen.justify-center > p.text-lg.font-semibold {
  font-size: 0;
}
div.min-h-screen.justify-center > p.text-lg.font-semibold::before {
  content: 'Opening the Arlee Labs sign-in…';
  font-size: 1rem;
  font-weight: 500;
  color: rgb(var(--text-secondary));
}

div:has(> div > #language-selector-label),
div:has(> #language-selector-label) {
  display: none !important;
}