html {
  background: linear-gradient(180deg, #ffffff 0%, #e6e6e6 100%);
}

html.dark {
  background: linear-gradient(180deg, #141414 0%, #000000 100%);
}

html.dark,
html.dark body {
  --background: transparent !important;
  --bg-base: transparent !important;
  --bg-canvas: 7 52 60 !important;
  --colors-background-neutral-standard: rgba(8, 36, 42, 0.5) !important;
}

html,
body,
#root {
  background-color: transparent !important;
}

#root {
  position: relative;
  z-index: 1;
  isolation: isolate;
}

/* Keep app chrome above the page background for both paint and hit-testing. */
#root > * {
  position: relative;
  z-index: 1;
}

.dark {
  --background: transparent;
  --bg-base: transparent;
  --bg-canvas: 7 52 60;
  --bg-component: rgba(8, 36, 42, 0.58);
  --bg-card: rgba(255, 255, 255, 0.08);
  --bg-input: rgba(255, 255, 255, 0.1);
  --bg-title: rgba(8, 36, 42, 0.45);
  --background-header-bar: transparent;
  --background-card: rgba(255, 255, 255, 0.08);
  --colors-background-neutral-standard: rgba(8, 36, 42, 0.5);
  --border-default: rgba(210, 245, 248, 0.22);
  --border-button: rgba(232, 248, 250, 0.18);
  --accent-primary: 64 214 196;
  --text-primary: 246 252 252;
  --text-secondary: 198 224 226;
}

:root:not(.dark) {
  --bg-base: rgba(236, 248, 248, 0.42);
  --bg-component: rgba(255, 255, 255, 0.62);
  --bg-card: rgba(255, 255, 255, 0.45);
  --accent-primary: 18 140 132;
}

h1 span[class*="bg-clip-text"] {
  background-image: linear-gradient(to left, #f3d7a1, #7ee8d8) !important;
}

/* Light primary fills use text-bg-base for ink; --bg-base is transparent in
   this theme, so force dark ink for readable contrast (buttons + selected nav). */
.bg-text-primary.text-bg-base,
button.bg-text-primary,
a.bg-text-primary,
nav ul.rounded-full a[aria-current='page'] {
  color: #06262c !important;
}

[data-radix-dialog-content],
[role='dialog'],
[data-state][class*='sheet'] {
  backdrop-filter: blur(22px);
}

article[class*='border-dashed'] {
  background: rgba(255, 255, 255, 0.01);
  backdrop-filter: blur(14px);
  border-color: rgba(232, 248, 250, 0.28) !important;
  position: relative;
  z-index: 1;
  pointer-events: auto;
  cursor: pointer;
}

/* Home only: same dashed glass border as empty cards, for created items. */
.lillian-home article[class*='bg-bg-input'] {
  background: rgba(255, 255, 255, 0.01) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-width: 1px;
  border-style: dashed;
  border-color: rgba(232, 248, 250, 0.28) !important;
  box-shadow: none;
  position: relative;
  z-index: 1;
  pointer-events: auto;
  cursor: pointer;
}