:root,
html {
  --melbury-coral: #ff7f64;
  --melbury-coral-light: #ff9e8a;
  --melbury-coral-pale: #fff0ed;
  --melbury-yellow: #ffc86b;
  --melbury-yellow-pale: #fff6e5;
  --melbury-green: #6baa7d;
  --melbury-green-pale: #e8f5eb;
  --melbury-navy: #4d6b8a;
  --melbury-navy-dark: #10233a;
  --melbury-cream: #f3f5f7;
  --melbury-warm: #fffaf7;
  --melbury-text: #1a1a2e;

  --text-primary: var(--melbury-text);
  --text-secondary: #43556d;
  --text-secondary-alt: #647287;
  --text-tertiary: #8792a1;
  --ring-primary: var(--melbury-coral);
  --header-primary: rgba(255, 250, 247, 0.92);
  --header-hover: var(--melbury-coral-pale);
  --header-button-hover: var(--melbury-coral-pale);
  --surface-active: var(--melbury-green-pale);
  --surface-active-alt: #fff0ed;
  --surface-hover: #fff0ed;
  --surface-hover-alt: #fff6e5;
  --surface-primary: #fffdfb;
  --surface-primary-alt: #f3f5f7;
  --surface-primary-contrast: #fff0ed;
  --surface-secondary: #eef3f6;
  --surface-secondary-alt: #e8f5eb;
  --surface-tertiary: #fff6e5;
  --surface-tertiary-alt: #ffffff;
  --surface-dialog: #fffdfb;
  --surface-submit: var(--melbury-coral);
  --surface-submit-hover: #f0644f;
  --surface-chat: var(--melbury-warm);
  --border-light: #e5edf2;
  --border-medium-alt: #cad7e1;
  --border-medium: #cad7e1;
  --border-heavy: #8da1b4;
  --border-xheavy: var(--melbury-navy);
  --background: 210 20% 96%;
  --foreground: 238 28% 14%;
  --card: 0 0% 100%;
  --card-foreground: 238 28% 14%;
  --popover: 0 0% 100%;
  --popover-foreground: 238 28% 14%;
  --primary: 10 100% 70%;
  --primary-foreground: 0 0% 100%;
  --secondary: 210 25% 97%;
  --secondary-foreground: 207 32% 24%;
  --muted: 210 24% 94%;
  --muted-foreground: 215 12% 46%;
  --accent: 10 100% 96%;
  --accent-foreground: 207 32% 24%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --border: 204 31% 88%;
  --input: 204 31% 88%;
  --ring: 10 100% 70%;
  --radius: 0.75rem;
}

.dark {
  --text-primary: #f8f7f2;
  --text-secondary: #d9d5ca;
  --text-secondary-alt: #bcb8ad;
  --text-tertiary: #96958d;
  --header-primary: #1f2630;
  --header-hover: #2d343f;
  --header-button-hover: #2d343f;
  --surface-active: #304739;
  --surface-active-alt: #3a3032;
  --surface-hover: #2a313a;
  --surface-hover-alt: #34363a;
  --surface-primary: #1b222b;
  --surface-primary-alt: #202936;
  --surface-primary-contrast: #3a3032;
  --surface-secondary: #242d38;
  --surface-secondary-alt: #293743;
  --surface-tertiary: #3d3a32;
  --surface-tertiary-alt: #202936;
  --surface-dialog: #202936;
  --surface-submit: var(--melbury-coral);
  --surface-submit-hover: var(--melbury-coral-light);
  --surface-chat: #171c24;
  --border-light: #344354;
  --border-medium-alt: #42556a;
  --border-medium: #42556a;
  --border-heavy: #63768a;
  --border-xheavy: #9aabb9;
  --background: 220 22% 12%;
  --foreground: 43 28% 96%;
  --card: 218 23% 17%;
  --card-foreground: 43 28% 96%;
  --popover: 218 23% 17%;
  --popover-foreground: 43 28% 96%;
  --primary: 10 100% 70%;
  --primary-foreground: 0 0% 100%;
  --secondary: 215 20% 20%;
  --secondary-foreground: 43 28% 96%;
  --muted: 215 18% 23%;
  --muted-foreground: 42 13% 72%;
  --accent: 145 18% 27%;
  --accent-foreground: 43 28% 96%;
  --destructive: 0 75% 58%;
  --destructive-foreground: 0 0% 100%;
  --border: 213 23% 31%;
  --input: 213 23% 31%;
  --ring: 10 100% 70%;
}

html,
body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html:not(.dark) body {
  background:
    linear-gradient(180deg, rgba(243, 245, 247, 0.92) 0%, rgba(255, 250, 247, 0.98) 42%),
    #ffffff;
}

html.dark body {
  background: #171c24;
}

.bg-surface-submit,
button.bg-surface-submit,
[type="submit"].bg-surface-submit {
  background: var(--melbury-coral) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 24px rgba(255, 127, 100, 0.22);
}

.bg-surface-submit:hover,
button.bg-surface-submit:hover,
[type="submit"].bg-surface-submit:hover {
  background: #f0644f !important;
}

.text-green-500,
.text-green-600,
.dark .text-green-500,
.dark .text-green-600 {
  color: var(--melbury-coral) !important;
}

.bg-green-500,
.bg-green-600,
.bg-green-700,
.dark .bg-green-500,
.dark .bg-green-600,
.dark .bg-green-700 {
  background-color: var(--melbury-coral) !important;
}

.border-green-500,
.border-green-600,
.dark .border-green-500,
.dark .border-green-600 {
  border-color: var(--melbury-coral) !important;
}

textarea,
input,
[contenteditable="true"] {
  caret-color: var(--melbury-coral);
}

textarea:focus,
input:focus,
[contenteditable="true"]:focus {
  border-color: var(--melbury-coral) !important;
  box-shadow: 0 0 0 2px rgba(255, 127, 100, 0.16) !important;
}

.dark .bg-background {
  background-color: hsl(var(--background)) !important;
}

.dark .bg-card,
.dark .bg-popover {
  background-color: hsl(var(--card)) !important;
}

.dark .text-foreground,
.dark .text-card-foreground,
.dark .text-popover-foreground,
.dark .bg-background,
.dark .bg-card,
.dark .bg-popover {
  color: var(--text-primary) !important;
}

.dark textarea,
.dark select,
.dark input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
.dark [contenteditable="true"] {
  background-color: var(--surface-primary-alt) !important;
  color: var(--text-primary) !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

.bg-presentation,
.bg-surface-primary,
.bg-surface-primary-alt,
.bg-surface-secondary {
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    color 180ms ease;
}

main .w-authPageWidth {
  background: rgba(255, 253, 251, 0.96) !important;
  border: 1px solid rgba(77, 107, 138, 0.14);
  border-radius: 24px !important;
  box-shadow: 0 18px 48px rgba(77, 107, 138, 0.12);
}

.dark main .w-authPageWidth {
  background: rgba(32, 41, 54, 0.96) !important;
  border-color: rgba(255, 200, 107, 0.14);
  box-shadow: 0 18px 56px rgba(0, 0, 0, 0.28);
}

.min-h-screen.bg-white,
.dark .min-h-screen.dark\:bg-gray-900 {
  background:
    linear-gradient(180deg, rgba(243, 245, 247, 0.95), rgba(255, 250, 247, 0.98) 54%),
    #ffffff !important;
}

.dark .min-h-screen.dark\:bg-gray-900 {
  background:
    linear-gradient(180deg, rgba(31, 38, 48, 0.98), rgba(23, 28, 36, 1) 54%),
    #171c24 !important;
}

input.peer.webkit-dark-styles,
.webkit-dark-styles input,
.webkit-dark-styles textarea {
  background-color: var(--surface-primary) !important;
  border-color: var(--border-light) !important;
  color: var(--text-primary) !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  background-clip: padding-box;
}

input.peer.webkit-dark-styles:hover,
.webkit-dark-styles input:hover,
.webkit-dark-styles textarea:hover {
  border-color: var(--border-medium) !important;
}

input.peer.webkit-dark-styles:focus,
input.peer.webkit-dark-styles:focus-visible,
.webkit-dark-styles input:focus,
.webkit-dark-styles textarea:focus {
  border-color: var(--melbury-coral) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(255, 127, 100, 0.18) !important;
}

input.peer.webkit-dark-styles + label,
input.peer.webkit-dark-styles ~ label,
.webkit-dark-styles label,
[class*="peer-focus"][class*="bg-surface-primary"] {
  background-color: var(--surface-primary) !important;
  color: var(--text-secondary-alt) !important;
}

input.peer.webkit-dark-styles:focus + label,
input.peer.webkit-dark-styles:focus ~ label,
.webkit-dark-styles:focus-within label,
[class*="peer-focus"][class*="text-green"] {
  color: var(--melbury-coral) !important;
}

input.peer.webkit-dark-styles::selection,
.webkit-dark-styles input::selection {
  background: rgba(255, 127, 100, 0.26);
  color: var(--text-primary);
}

input.peer.webkit-dark-styles:-webkit-autofill,
input.peer.webkit-dark-styles:-webkit-autofill:hover,
input.peer.webkit-dark-styles:-webkit-autofill:focus,
.webkit-dark-styles input:-webkit-autofill,
.webkit-dark-styles input:-webkit-autofill:hover,
.webkit-dark-styles input:-webkit-autofill:focus {
  border-color: var(--border-medium) !important;
  -webkit-box-shadow: 0 0 0 64px var(--surface-primary) inset !important;
  box-shadow: 0 0 0 64px var(--surface-primary) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  caret-color: var(--melbury-coral);
  transition: background-color 9999s ease-out 0s;
}

.dark textarea:focus,
.dark select:focus,
.dark input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
.dark [contenteditable="true"]:focus {
  background-color: var(--surface-primary-alt) !important;
  color: var(--text-primary) !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

.dark textarea::placeholder,
.dark input:not([type="checkbox"]):not([type="radio"]):not([type="range"])::placeholder {
  color: var(--text-tertiary) !important;
  -webkit-text-fill-color: var(--text-tertiary) !important;
}

.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus,
.dark textarea:-webkit-autofill,
.dark textarea:-webkit-autofill:hover,
.dark textarea:-webkit-autofill:focus {
  border-color: var(--border-medium) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--surface-primary-alt) inset !important;
  box-shadow: 0 0 0 1000px var(--surface-primary-alt) inset !important;
  caret-color: var(--melbury-coral);
  color: var(--text-primary) !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

.dark input.peer.webkit-dark-styles,
.dark .webkit-dark-styles input,
.dark .webkit-dark-styles textarea,
.dark input.peer.webkit-dark-styles:focus,
.dark input.peer.webkit-dark-styles:focus-visible,
.dark .webkit-dark-styles input:focus,
.dark .webkit-dark-styles textarea:focus {
  background-color: var(--surface-primary) !important;
  color: var(--text-primary) !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

.dark input.peer.webkit-dark-styles:focus,
.dark input.peer.webkit-dark-styles:focus-visible,
.dark .webkit-dark-styles input:focus,
.dark .webkit-dark-styles textarea:focus {
  border-color: var(--melbury-coral) !important;
  box-shadow: 0 0 0 2px rgba(255, 127, 100, 0.2) !important;
}

.dark input.peer.webkit-dark-styles:-webkit-autofill,
.dark input.peer.webkit-dark-styles:-webkit-autofill:hover,
.dark input.peer.webkit-dark-styles:-webkit-autofill:focus,
.dark .webkit-dark-styles input:-webkit-autofill,
.dark .webkit-dark-styles input:-webkit-autofill:hover,
.dark .webkit-dark-styles input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 64px var(--surface-primary) inset !important;
  box-shadow: 0 0 0 64px var(--surface-primary) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

.melbury-auth-logo-wrap {
  height: 5rem !important;
  margin-top: 1.75rem !important;
}

.melbury-auth-logo {
  height: 100% !important;
  width: 100% !important;
  object-fit: contain !important;
}

@media (min-width: 640px) {
  .melbury-auth-logo-wrap {
    height: 5.75rem !important;
  }
}

.dark main .w-authPageWidth {
  --melbury-auth-field: #1b222b;
  --melbury-auth-field-border: rgba(255, 255, 255, 0.13);
}

.dark main .w-authPageWidth input.peer.webkit-dark-styles,
.dark main .w-authPageWidth .webkit-dark-styles input,
.dark main .w-authPageWidth .webkit-dark-styles textarea {
  background-color: var(--melbury-auth-field) !important;
  background-image: none !important;
  border-color: var(--melbury-auth-field-border) !important;
  box-shadow: none !important;
  color: #f8f7f2 !important;
  -webkit-text-fill-color: #f8f7f2 !important;
}

.dark main .w-authPageWidth input.peer.webkit-dark-styles:focus,
.dark main .w-authPageWidth input.peer.webkit-dark-styles:focus-visible,
.dark main .w-authPageWidth .webkit-dark-styles input:focus,
.dark main .w-authPageWidth .webkit-dark-styles textarea:focus {
  background-color: var(--melbury-auth-field) !important;
  border-color: rgba(255, 127, 100, 0.78) !important;
  box-shadow: 0 0 0 1px rgba(255, 127, 100, 0.52) !important;
}

.dark main .w-authPageWidth input.peer.webkit-dark-styles + label,
.dark main .w-authPageWidth input.peer.webkit-dark-styles ~ label,
.dark main .w-authPageWidth .webkit-dark-styles label,
.dark main .w-authPageWidth [class*="peer-focus"][class*="bg-surface-primary"] {
  background: transparent !important;
  box-shadow: none !important;
  color: #cfcac0 !important;
}

.dark main .w-authPageWidth input.peer.webkit-dark-styles:-webkit-autofill,
.dark main .w-authPageWidth input.peer.webkit-dark-styles:-webkit-autofill:hover,
.dark main .w-authPageWidth input.peer.webkit-dark-styles:-webkit-autofill:focus,
.dark main .w-authPageWidth .webkit-dark-styles input:-webkit-autofill,
.dark main .w-authPageWidth .webkit-dark-styles input:-webkit-autofill:hover,
.dark main .w-authPageWidth .webkit-dark-styles input:-webkit-autofill:focus {
  background-color: var(--melbury-auth-field) !important;
  background-image: none !important;
  -webkit-box-shadow: 0 0 0 1000px var(--melbury-auth-field) inset !important;
  box-shadow: 0 0 0 1000px var(--melbury-auth-field) inset !important;
  -webkit-text-fill-color: #f8f7f2 !important;
}

.popover-ui,
[role="dialog"],
[data-radix-popper-content-wrapper] > * {
  border-color: var(--border-light) !important;
  box-shadow: 0 16px 48px rgba(42, 61, 82, 0.12) !important;
}

.dark .popover-ui,
.dark [role="dialog"],
.dark [data-radix-popper-content-wrapper] > * {
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35) !important;
}

img[src$="logo.svg"],
img[src*="/assets/logo.svg"] {
  content: url("/assets/logo.png?v=20260701-0135") !important;
  filter: none !important;
}

a[href="/"],
a[href="https://melbury.app"],
a[href="https://chat.melbury.app"] {
  color: var(--melbury-coral);
}

::selection {
  background: rgba(255, 127, 100, 0.22);
}