:root {
  --lingshu-blue-50: #eef6ff;
  --lingshu-blue-100: #dcecff;
  --lingshu-blue-200: #b9d9ff;
  --lingshu-blue-300: #82bbff;
  --lingshu-blue-400: #56a9f3;
  --lingshu-blue-500: #3f8fe5;
  --lingshu-blue-600: #2f80ed;
  --lingshu-blue-700: #315bc4;
  --lingshu-violet-500: #4732b7;
  --lingshu-ink: #17233d;
}

body {
  background: #f5f8ff;
}

.navigation-progress-bar[data-v-0856a86e],
:root.dark .navigation-progress-bar[data-v-0856a86e] {
  background: linear-gradient(90deg, transparent 0%, #56a9f3 18%, #2f80ed 48%, #3f8fe5 72%, transparent 100%) !important;
}

.from-primary-50 { --tw-gradient-from: #eef6ff var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(238 246 255 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.from-primary-400 { --tw-gradient-from: #56a9f3 var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(86 169 243 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.from-primary-500 { --tw-gradient-from: #2f80ed var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(47 128 237 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.from-primary-600 { --tw-gradient-from: #315bc4 var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(49 91 196 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.to-primary-100 { --tw-gradient-to: #dcecff var(--tw-gradient-to-position) !important; }
.to-primary-500 { --tw-gradient-to: #3f8fe5 var(--tw-gradient-to-position) !important; }
.to-primary-600 { --tw-gradient-to: #315bc4 var(--tw-gradient-to-position) !important; }
.via-primary-50\/30 { --tw-gradient-to: rgb(238 246 255 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), rgb(238 246 255 / .55) var(--tw-gradient-via-position), var(--tw-gradient-to) !important; }
.dark\:from-primary-900\/20:is(.dark *) { --tw-gradient-from: rgb(49 91 196 / .22) var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(49 91 196 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.dark\:from-primary-900\/30:is(.dark *) { --tw-gradient-from: rgb(49 91 196 / .3) var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(49 91 196 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.dark\:from-primary-950\/40:is(.dark *) { --tw-gradient-from: rgb(24 48 104 / .42) var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(24 48 104 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.dark\:to-primary-800\/20:is(.dark *) { --tw-gradient-to: rgb(47 128 237 / .22) var(--tw-gradient-to-position) !important; }

.btn-primary,
.bg-primary-500,
.bg-primary-600,
.hover\:bg-primary-600:hover,
button[class*="bg-primary"],
a[class*="bg-primary"] {
  border-color: #2f80ed !important;
  background-color: #2f80ed !important;
  background-image: linear-gradient(135deg, #2f80ed 0%, #3f8fe5 58%, #315bc4 100%) !important;
  color: #fff !important;
  box-shadow: 0 14px 28px rgb(47 128 237 / .22) !important;
}

.btn-primary:hover,
button[class*="bg-primary"]:hover,
a[class*="bg-primary"]:hover {
  background-color: #315bc4 !important;
  background-image: linear-gradient(135deg, #256fdc 0%, #2f80ed 54%, #315bc4 100%) !important;
  box-shadow: 0 16px 34px rgb(47 128 237 / .3) !important;
}

.bg-primary-50 { background-color: #eef6ff !important; }
.bg-primary-50\/50 { background-color: rgb(238 246 255 / .55) !important; }
.bg-primary-50\/80 { background-color: rgb(238 246 255 / .82) !important; }
.bg-primary-100 { background-color: #dcecff !important; }
.bg-primary-200\/50 { background-color: rgb(185 217 255 / .56) !important; }
.bg-primary-300\/10 { background-color: rgb(130 187 255 / .14) !important; }
.bg-primary-400 { background-color: #56a9f3 !important; }
.bg-primary-400\/10 { background-color: rgb(86 169 243 / .12) !important; }
.bg-primary-400\/20 { background-color: rgb(86 169 243 / .2) !important; }
.bg-primary-500\/10 { background-color: rgb(47 128 237 / .12) !important; }
.bg-primary-500\/15 { background-color: rgb(47 128 237 / .16) !important; }
.bg-primary-100\/80 { background-color: rgb(220 236 255 / .82) !important; }
.bg-teal-100 { background-color: #dcecff !important; }
.hover\:bg-teal-200:hover { background-color: #b9d9ff !important; }
.dark\:bg-teal-900\/30:is(.dark *) { background-color: rgb(49 91 196 / .28) !important; }

.text-primary-400,
.text-primary-500,
.text-primary-600,
.text-primary-700,
.text-teal-500,
.text-teal-600,
.text-teal-700,
.hover\:text-primary-500:hover,
.hover\:text-primary-600:hover,
.hover\:text-teal-600:hover,
a.text-primary,
.text-primary {
  color: #2f80ed !important;
}
.dark\:text-primary-400:is(.dark *),
.dark\:text-teal-400:is(.dark *) {
  color: #82bbff !important;
}

.border-primary-100,
.border-primary-100\/80 { border-color: rgb(220 236 255 / .85) !important; }
.border-primary-200,
.border-primary-300 { border-color: #b9d9ff !important; }
.border-primary-400,
.border-primary-500,
.border-primary-600,
.border-teal-500 { border-color: #3f8fe5 !important; }
.dark\:border-primary-800:is(.dark *) { border-color: rgb(63 143 229 / .45) !important; }

.ring-primary-500\/20,
.focus\:ring-primary-500:focus,
.focus\:ring-primary-500\/40:focus,
.focus-visible\:ring-primary-500:focus-visible {
  --tw-ring-color: rgb(47 128 237 / .34) !important;
}
.shadow-primary-500\/10 { --tw-shadow-color: rgb(47 128 237 / .1) !important; --tw-shadow: var(--tw-shadow-colored) !important; }
.shadow-primary-500\/30 { --tw-shadow-color: rgb(47 128 237 / .28) !important; --tw-shadow: var(--tw-shadow-colored) !important; }

[class*="rgba(20,184,166"] {
  background-image: linear-gradient(rgba(47,128,237,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(47,128,237,.045) 1px, transparent 1px) !important;
}

input[type="checkbox"],
input[type="radio"],
select,
button {
  accent-color: #2f80ed;
}

::selection {
  background: rgb(47 128 237 / .2);
}


/* LingShu sidebar and shell blue pass */
.sidebar-link-active,
.router-link-active.sidebar-link,
.router-link-exact-active.sidebar-link {
  color: #2f80ed !important;
  background: linear-gradient(90deg, rgb(47 128 237 / .12) 0%, rgb(86 169 243 / .09) 100%) !important;
  border-color: rgb(63 143 229 / .16) !important;
}
.sidebar-link-active svg,
.router-link-active.sidebar-link svg,
.router-link-exact-active.sidebar-link svg,
.sidebar-link-active [class*="icon"],
.router-link-active.sidebar-link [class*="icon"] {
  color: #2f80ed !important;
  stroke: #2f80ed !important;
}
.sidebar-link:hover {
  color: #315bc4 !important;
  background: rgb(238 246 255 / .78) !important;
}
.sidebar-link:hover svg {
  color: #315bc4 !important;
  stroke: #315bc4 !important;
}
.sidebar-logo,
.shadow-glow {
  box-shadow: 0 10px 30px rgb(47 128 237 / .22) !important;
}
.bg-mesh-gradient {
  background:
    radial-gradient(circle at 12% 8%, rgb(86 169 243 / .12), transparent 34%),
    radial-gradient(circle at 78% 18%, rgb(47 128 237 / .10), transparent 30%),
    linear-gradient(180deg, rgb(245 248 255 / .92), rgb(255 255 255 / .9)) !important;
}
.glass {
  background: rgb(255 255 255 / .78) !important;
  backdrop-filter: blur(18px) saturate(1.12) !important;
}
.dark .glass {
  background: rgb(12 22 46 / .78) !important;
}
.dark .sidebar-link-active,
.dark .router-link-active.sidebar-link,
.dark .router-link-exact-active.sidebar-link {
  color: #82bbff !important;
  background: linear-gradient(90deg, rgb(47 128 237 / .24), rgb(63 143 229 / .16)) !important;
}
.dark .sidebar-link-active svg,
.dark .router-link-active.sidebar-link svg,
.dark .router-link-exact-active.sidebar-link svg {
  color: #82bbff !important;
  stroke: #82bbff !important;
}


/* LingShu iOS blue material pass */
:root {
  --lingshu-ios-bg: #f5f9ff;
  --lingshu-ios-surface: rgba(255,255,255,.72);
  --lingshu-ios-border: rgba(108,151,213,.18);
  --lingshu-ios-shadow: 0 18px 45px rgba(47, 128, 237, .11), 0 2px 8px rgba(25, 44, 92, .06);
}

body,
.min-h-screen.bg-gray-50,
.relative.flex.min-h-screen,
[class*="via-primary-50"] {
  background:
    radial-gradient(circle at 18% 8%, rgba(86, 169, 243, .20), transparent 32%),
    radial-gradient(circle at 82% 12%, rgba(47, 128, 237, .15), transparent 30%),
    linear-gradient(180deg, #f7fbff 0%, #eef6ff 46%, #ffffff 100%) !important;
}

[class~="bg-primary-400/20"] { background-color: rgba(86, 169, 243, .20) !important; }
[class~="bg-primary-500/15"] { background-color: rgba(47, 128, 237, .15) !important; }
[class~="bg-primary-300/10"] { background-color: rgba(130, 187, 255, .13) !important; }
[class~="bg-primary-400/10"] { background-color: rgba(86, 169, 243, .12) !important; }
[class*="rgba(20,184,166"],
[class*="bg-[linear-gradient(rgba(20,184,166"] {
  background-image: linear-gradient(rgba(47,128,237,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(47,128,237,.045) 1px, transparent 1px) !important;
}

.glass,
.sidebar,
.card,
.group.rounded-2xl,
[class*="bg-white/60"],
[class*="bg-white/80"],
.table-container,
.table-wrapper,
.rounded-lg.bg-primary-50,
.rounded-xl.bg-primary-50,
[class*="rounded-xl"][class*="bg-primary-50"] {
  background: var(--lingshu-ios-surface) !important;
  border-color: var(--lingshu-ios-border) !important;
  box-shadow: var(--lingshu-ios-shadow) !important;
  backdrop-filter: blur(22px) saturate(1.22) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.22) !important;
}

.btn,
button,
select,
input,
textarea,
.sidebar-link,
[class*="rounded-xl"],
[class*="rounded-2xl"] {
  -webkit-font-smoothing: antialiased;
}

.btn-primary,
a.btn-primary,
button.btn-primary,
[class~="from-primary-500"],
[class~="from-primary-400"],
[class~="to-primary-600"],
[class~="to-primary-500"],
[class*="from-primary-500"][class*="to-primary-600"],
[class*="from-primary-400"][class*="to-primary-600"] {
  --tw-gradient-from: #2f80ed var(--tw-gradient-from-position) !important;
  --tw-gradient-to: #315bc4 var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), #3f8fe5 var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
  background-image: linear-gradient(135deg, #2f80ed 0%, #3f8fe5 58%, #315bc4 100%) !important;
  background-color: #2f80ed !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(47,128,237,.22), inset 0 1px 0 rgba(255,255,255,.22) !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
  background-image: linear-gradient(135deg, #2977df 0%, #2f80ed 54%, #315bc4 100%) !important;
  box-shadow: 0 16px 32px rgba(47,128,237,.30), inset 0 1px 0 rgba(255,255,255,.24) !important;
  transform: translateY(-1px);
}

.sidebar-link-active,
.router-link-active.sidebar-link,
.router-link-exact-active.sidebar-link {
  color: #2f80ed !important;
  background: linear-gradient(90deg, rgba(47,128,237,.14), rgba(86,169,243,.08)) !important;
  border: 1px solid rgba(63,143,229,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 10px 28px rgba(47,128,237,.10) !important;
}
.sidebar-link-active svg,
.router-link-active.sidebar-link svg,
.router-link-exact-active.sidebar-link svg,
.sidebar-link:hover svg {
  color: #2f80ed !important;
  stroke: #2f80ed !important;
}
.sidebar-link:hover {
  color: #315bc4 !important;
  background: rgba(238,246,255,.82) !important;
}

.text-primary-300,
.text-primary-400,
.text-primary-500,
.text-primary-600,
.text-primary-700,
.text-primary-900,
.text-teal-400,
.text-teal-500,
.text-teal-600,
.text-teal-700,
.code-url,
.code-prompt,
.hover\:text-primary-500:hover,
.hover\:text-primary-600:hover,
.hover\:text-teal-600:hover,
a.text-primary,
.text-primary {
  color: #2f80ed !important;
}

.bg-primary-50,
.bg-primary-100,
.bg-teal-100,
[class~="bg-primary-50"],
[class~="bg-primary-100"],
[class~="bg-primary-50/50"],
[class~="bg-primary-50/80"] {
  background-color: rgba(238,246,255,.84) !important;
}
.bg-primary-400,
.bg-primary-500,
.bg-primary-600,
[class~="bg-primary-400"],
[class~="bg-primary-500"],
[class~="bg-primary-600"] {
  background-color: #2f80ed !important;
}

.border-primary-100,
.border-primary-200,
.border-primary-300,
.border-primary-400,
.border-primary-500,
.border-primary-600,
.border-teal-500,
[class~="border-primary-200"],
[class~="border-primary-500"] {
  border-color: rgba(63,143,229,.32) !important;
}
.ring-primary-500\/20,
[class~="ring-primary-500/20"] {
  --tw-ring-color: rgba(47,128,237,.24) !important;
  box-shadow: 0 0 0 1px rgba(47,128,237,.18), 0 12px 34px rgba(47,128,237,.10) !important;
}
.shadow-primary-500\/10,
.shadow-primary-500\/30,
[class~="shadow-primary-500/10"],
[class~="shadow-primary-500/30"] {
  --tw-shadow-color: rgba(47,128,237,.20) !important;
  --tw-shadow: var(--tw-shadow-colored) !important;
}

.rounded.bg-primary-100,
span.bg-primary-100,
[class*="bg-primary-100"][class*="text-primary"],
[class*="???"] {
  background: rgba(47,128,237,.12) !important;
  color: #2f80ed !important;
  border: 1px solid rgba(47,128,237,.16) !important;
}

.code-window,
.terminal,
[class*="terminal"] {
  box-shadow: 0 24px 60px rgba(47,128,237,.16), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.btn-maximize,
.cursor {
  background: #2f80ed !important;
}
.code-success {
  color: #2f80ed !important;
  background: rgba(47,128,237,.13) !important;
}

svg[stroke="currentColor"],
.text-primary-600 svg,
.text-teal-600 svg {
  stroke: currentColor;
}

.bg-gradient-to-br.from-green-500.to-green-600,
[class*="from-green-500"][class*="to-green-600"] {
  --tw-gradient-from: #2f80ed var(--tw-gradient-from-position) !important;
  --tw-gradient-to: #315bc4 var(--tw-gradient-to-position) !important;
  background-image: linear-gradient(135deg, #2f80ed, #315bc4) !important;
}

.table-header,
thead,
[class*="table-header"] {
  background: rgba(248,251,255,.82) !important;
  backdrop-filter: blur(16px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.12) !important;
}

.dark body,
.dark .min-h-screen.bg-gray-50,
.dark [class*="via-primary-50"] {
  background:
    radial-gradient(circle at 16% 8%, rgba(63,143,229,.18), transparent 32%),
    radial-gradient(circle at 82% 12%, rgba(49,91,196,.18), transparent 30%),
    linear-gradient(180deg, #071126 0%, #0b1631 52%, #081123 100%) !important;
}
.dark .glass,
.dark .sidebar,
.dark .card,
.dark .group.rounded-2xl,
.dark [class*="bg-white/60"],
.dark [class*="bg-white/80"] {
  background: rgba(13,25,52,.70) !important;
  border-color: rgba(130,187,255,.18) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.dark .text-primary-300,
.dark .text-primary-400,
.dark .text-primary-500,
.dark .text-primary-600,
.dark .text-primary-700,
.dark .text-teal-400,
.dark .code-url,
.dark .code-prompt {
  color: #82bbff !important;
}
.dark .rounded.bg-primary-100,
.dark span.bg-primary-100,
.dark [class*="bg-primary-100"][class*="text-primary"] {
  background: rgba(63,143,229,.18) !important;
  color: #a9d0ff !important;
  border-color: rgba(130,187,255,.22) !important;
}


/* LingShu layout guard: keep sub2 pages from snapping back into the original cramped layout */
html,
body,
#app {
  min-width: 0 !important;
  overflow-x: hidden !important;
}

main,
[role="main"],
.main-content,
.content,
.page-container,
.router-view,
[class*="page-container"],
[class*="main-content"] {
  min-width: 0 !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

main > *,
[role="main"] > * {
  min-width: 0 !important;
}

main h1,
[role="main"] h1,
.page-container h1,
[class*="page-container"] h1 {
  padding-left: max(14px, env(safe-area-inset-left)) !important;
  box-sizing: border-box !important;
}

main .grid,
[role="main"] .grid,
.page-container .grid,
[class*="page-container"] .grid {
  min-width: 0 !important;
}

main .grid > *,
[role="main"] .grid > *,
.page-container .grid > *,
[class*="page-container"] .grid > * {
  min-width: 0 !important;
}

main [class*="grid-cols-3"],
main [class*="grid-cols-4"],
[role="main"] [class*="grid-cols-3"],
[role="main"] [class*="grid-cols-4"],
.page-container [class*="grid-cols-3"],
.page-container [class*="grid-cols-4"],
[class*="page-container"] [class*="grid-cols-3"],
[class*="page-container"] [class*="grid-cols-4"] {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
}

main [class*="overflow-x-auto"],
[role="main"] [class*="overflow-x-auto"],
.page-container [class*="overflow-x-auto"],
[class*="page-container"] [class*="overflow-x-auto"] {
  max-width: 100% !important;
  overflow-x: auto !important;
}

main table,
[role="main"] table,
.page-container table,
[class*="page-container"] table {
  width: 100% !important;
}

main [class*="absolute"][class*="z-"],
[role="main"] [class*="absolute"][class*="z-"],
.page-container [class*="absolute"][class*="z-"],
[class*="page-container"] [class*="absolute"][class*="z-"] {
  z-index: 80 !important;
}

main [class*="shadow-lg"],
[role="main"] [class*="shadow-lg"],
.page-container [class*="shadow-lg"],
[class*="page-container"] [class*="shadow-lg"] {
  box-shadow: 0 20px 55px rgba(47,128,237,.14), 0 2px 10px rgba(25,44,92,.08) !important;
}

@media (max-width: 768px) {
  main,
  [role="main"],
  .main-content,
  .content,
  .page-container,
  .router-view,
  [class*="page-container"],
  [class*="main-content"] {
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }

  main [class*="grid-cols-2"],
  main [class*="grid-cols-3"],
  main [class*="grid-cols-4"],
  [role="main"] [class*="grid-cols-2"],
  [role="main"] [class*="grid-cols-3"],
  [role="main"] [class*="grid-cols-4"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}


/* LingShu popup layer fix: keep filters, selects, date pickers above cards and sticky tables */
.date-picker-dropdown,
.select-dropdown,
.dropdown-menu,
[role="listbox"],
[role="menu"],
[class*="popover"],
[class*="dropdown"] {
  z-index: 999999 !important;
}

.relative:has(> .date-picker-dropdown),
.relative:has(> .select-dropdown),
.relative:has(> [role="listbox"]),
.relative:has(> [role="menu"]),
.card:has(.date-picker-dropdown),
.card:has(.select-dropdown),
.card:has([role="listbox"]),
.layout-section-fixed:has(.date-picker-dropdown),
.layout-section-fixed:has(.select-dropdown),
.layout-section-fixed:has([role="listbox"]) {
  position: relative !important;
  z-index: 99990 !important;
  overflow: visible !important;
  isolation: isolate !important;
}

.table-wrapper,
thead,
.sticky-header-cell {
  z-index: 1 !important;
}


/* LingShu login liquid-glass pass */
body:has(#email):has(#password),
body:has(#email):has(#password) #app {
  min-height: 100svh !important;
  background:
    linear-gradient(115deg, rgba(246,251,255,.96) 0%, rgba(226,240,255,.84) 42%, rgba(247,251,255,.98) 100%),
    linear-gradient(rgba(47,128,237,.052) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47,128,237,.052) 1px, transparent 1px) !important;
  background-size: auto, 64px 64px, 64px 64px !important;
  color: #17233d !important;
  overflow-x: hidden !important;
}

body:has(#email):has(#password) .relative.flex.min-h-screen.items-center.justify-center {
  min-height: 100svh !important;
  padding: clamp(28px, 5vh, 72px) max(18px, env(safe-area-inset-left)) clamp(24px, 4vh, 56px) max(18px, env(safe-area-inset-right)) !important;
  isolation: isolate !important;
}

body:has(#email):has(#password) .absolute.inset-0.bg-gradient-to-br {
  background:
    radial-gradient(120% 90% at 50% -18%, rgba(86,169,243,.24), transparent 56%),
    linear-gradient(180deg, rgba(248,252,255,.92) 0%, rgba(232,243,255,.86) 48%, rgba(255,255,255,.94) 100%) !important;
}

body:has(#email):has(#password) .absolute.-right-40,
body:has(#email):has(#password) .absolute.-bottom-40,
body:has(#email):has(#password) .absolute.left-1\/2.top-1\/2 {
  display: none !important;
}

body:has(#email):has(#password) .absolute.inset-0[class*="bg-[linear-gradient"] {
  background-image:
    linear-gradient(rgba(47,128,237,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47,128,237,.06) 1px, transparent 1px) !important;
  background-size: 64px 64px !important;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.28) 76%, transparent 100%) !important;
}

body:has(#email):has(#password) .relative.z-10.w-full.max-w-md {
  max-width: min(660px, calc(100vw - 32px)) !important;
}

body:has(#email):has(#password) .mb-8.text-center {
  margin-bottom: clamp(24px, 4vh, 38px) !important;
}

body:has(#email):has(#password) .mb-4.inline-flex.h-16.w-16 {
  width: 82px !important;
  height: 82px !important;
  border-radius: 28px !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.86), rgba(233,243,255,.58)) !important;
  border: 1px solid rgba(255,255,255,.76) !important;
  box-shadow:
    0 22px 42px rgba(47,128,237,.18),
    0 2px 10px rgba(23,35,61,.08),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
  backdrop-filter: blur(28px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.3) !important;
}

body:has(#email):has(#password) .text-gradient {
  color: transparent !important;
  background: linear-gradient(135deg, #1aa9d9 0%, #2f80ed 50%, #4732b7 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  letter-spacing: 0 !important;
}

body:has(#email):has(#password) h1.text-gradient {
  font-size: clamp(2.65rem, 5.2vw, 4.15rem) !important;
  line-height: 1.02 !important;
  margin-bottom: 12px !important;
  text-shadow: 0 12px 34px rgba(47,128,237,.16) !important;
}

body:has(#email):has(#password) .mb-8.text-center p {
  font-size: clamp(1rem, 1.65vw, 1.35rem) !important;
  line-height: 1.65 !important;
  color: rgba(70,86,116,.78) !important;
}

body:has(#email):has(#password) .card-glass {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 34px !important;
  padding: clamp(34px, 5.2vw, 54px) clamp(28px, 5vw, 56px) !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.74), rgba(245,250,255,.48) 58%, rgba(230,241,255,.36)) !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  box-shadow:
    0 30px 80px rgba(47,128,237,.14),
    0 8px 28px rgba(23,35,61,.08),
    inset 0 1px 0 rgba(255,255,255,.88),
    inset 0 -1px 0 rgba(47,128,237,.08) !important;
  backdrop-filter: blur(34px) saturate(1.32) !important;
  -webkit-backdrop-filter: blur(34px) saturate(1.32) !important;
}

body:has(#email):has(#password) .card-glass::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), transparent 42%),
    linear-gradient(120deg, rgba(255,255,255,.62), transparent 32%, rgba(47,128,237,.09) 74%, transparent 100%) !important;
}

body:has(#email):has(#password) .card-glass::after {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: 33px !important;
  pointer-events: none !important;
  border: 1px solid rgba(255,255,255,.42) !important;
}

body:has(#email):has(#password) .card-glass > * {
  position: relative !important;
  z-index: 1 !important;
}

body:has(#email):has(#password) .card-glass h2 {
  font-size: clamp(2rem, 4vw, 2.75rem) !important;
  line-height: 1.12 !important;
  color: #111827 !important;
  letter-spacing: 0 !important;
}

body:has(#email):has(#password) .card-glass .text-center p {
  font-size: clamp(.98rem, 1.55vw, 1.2rem) !important;
  color: rgba(83,98,127,.78) !important;
}

body:has(#email):has(#password) form.space-y-5 {
  margin-top: clamp(24px, 4vh, 34px) !important;
}

body:has(#email):has(#password) form.space-y-5 > div {
  color: rgba(38,52,83,.92) !important;
  font-size: clamp(.98rem, 1.45vw, 1.12rem) !important;
}

body:has(#email):has(#password) .input {
  min-height: 60px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(113,149,199,.24) !important;
  background: rgba(255,255,255,.58) !important;
  color: #14213d !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.7),
    0 10px 24px rgba(47,128,237,.07) !important;
  backdrop-filter: blur(18px) saturate(1.16) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.16) !important;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .18s ease !important;
}

body:has(#email):has(#password) .input:hover {
  background: rgba(255,255,255,.68) !important;
  border-color: rgba(47,128,237,.32) !important;
}

body:has(#email):has(#password) .input:focus,
body:has(#email):has(#password) .input:focus-visible {
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(47,128,237,.72) !important;
  box-shadow:
    0 0 0 4px rgba(47,128,237,.14),
    0 16px 30px rgba(47,128,237,.12),
    inset 0 1px 0 rgba(255,255,255,.86) !important;
  outline: none !important;
  transform: translateY(-1px) !important;
}

body:has(#email):has(#password) .input::placeholder {
  color: rgba(91,105,132,.56) !important;
}

body:has(#email):has(#password) form svg {
  color: rgba(77,95,127,.54) !important;
  stroke: currentColor !important;
}

body:has(#email):has(#password) .btn.btn-primary.w-full {
  min-height: 62px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255,255,255,.42) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), transparent 42%),
    linear-gradient(135deg, #2f80ed 0%, #56a9f3 48%, #315bc4 100%) !important;
  box-shadow:
    0 18px 36px rgba(47,128,237,.28),
    0 4px 12px rgba(49,91,196,.12),
    inset 0 1px 0 rgba(255,255,255,.32) !important;
  font-size: 1.08rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

body:has(#email):has(#password) .btn.btn-primary.w-full:hover {
  transform: translateY(-1px) !important;
  box-shadow:
    0 22px 42px rgba(47,128,237,.34),
    0 5px 16px rgba(49,91,196,.16),
    inset 0 1px 0 rgba(255,255,255,.36) !important;
}

body:has(#email):has(#password) .mt-6.text-center,
body:has(#email):has(#password) .mt-8.text-center {
  color: rgba(80,96,124,.72) !important;
}

body:has(#email):has(#password) a.text-primary-600,
body:has(#email):has(#password) a.text-primary-400 {
  color: #2f80ed !important;
}

:root.dark body:has(#email):has(#password),
:root.dark body:has(#email):has(#password) #app {
  background:
    linear-gradient(115deg, rgba(7,17,38,.98) 0%, rgba(11,28,61,.92) 50%, rgba(8,17,35,.98) 100%),
    linear-gradient(rgba(130,187,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(130,187,255,.08) 1px, transparent 1px) !important;
}

:root.dark body:has(#email):has(#password) .absolute.inset-0.bg-gradient-to-br {
  background:
    radial-gradient(120% 90% at 50% -18%, rgba(47,128,237,.22), transparent 58%),
    linear-gradient(180deg, rgba(7,17,38,.92), rgba(9,21,46,.96)) !important;
}

:root.dark body:has(#email):has(#password) .card-glass {
  background:
    linear-gradient(145deg, rgba(16,31,64,.76), rgba(10,22,49,.54) 58%, rgba(20,43,86,.38)) !important;
  border-color: rgba(130,187,255,.18) !important;
  box-shadow:
    0 34px 90px rgba(0,0,0,.34),
    0 10px 34px rgba(47,128,237,.14),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

:root.dark body:has(#email):has(#password) .card-glass h2,
:root.dark body:has(#email):has(#password) form.space-y-5 > div {
  color: rgba(242,247,255,.94) !important;
}

:root.dark body:has(#email):has(#password) .input {
  background: rgba(12,26,56,.62) !important;
  color: #f3f8ff !important;
  border-color: rgba(130,187,255,.18) !important;
}

@media (max-width: 640px) {
  body:has(#email):has(#password) .relative.flex.min-h-screen.items-center.justify-center {
    padding-top: max(22px, env(safe-area-inset-top)) !important;
    padding-bottom: max(20px, env(safe-area-inset-bottom)) !important;
  }

  body:has(#email):has(#password) .relative.z-10.w-full.max-w-md {
    max-width: min(100%, calc(100vw - 24px)) !important;
  }

  body:has(#email):has(#password) .mb-4.inline-flex.h-16.w-16 {
    width: 72px !important;
    height: 72px !important;
    border-radius: 24px !important;
  }

  body:has(#email):has(#password) h1.text-gradient {
    font-size: clamp(2.35rem, 13vw, 3.2rem) !important;
  }

  body:has(#email):has(#password) .card-glass {
    border-radius: 28px !important;
    padding: 28px 20px !important;
  }

  body:has(#email):has(#password) .card-glass::after {
    border-radius: 27px !important;
  }

  body:has(#email):has(#password) .input,
  body:has(#email):has(#password) .btn.btn-primary.w-full {
    min-height: 56px !important;
  }
}
