body.pearl-app-shell {
  --pearl-console-bg: #f3f4fb;
  --pearl-console-panel: #ffffff;
  --pearl-console-border: #dde2ea;
  --pearl-console-line: #eef0f5;
  --pearl-console-ink: #152033;
  --pearl-console-muted: #6c7482;
  --pearl-console-accent: #e35a61;
  --pearl-console-accent-dark: #cf464d;
  --pearl-console-blue: #157fa8;
  background: var(--pearl-console-bg) !important;
  color: var(--pearl-console-ink);
}

body.pearl-app-shell #root {
  min-height: 100vh;
}

body.pearl-app-shell .rounded-2xl {
  border-radius: 8px !important;
}

body.pearl-app-shell .rounded-3xl {
  border-radius: 10px !important;
}

body.pearl-app-shell .p-8 {
  padding: 1.25rem !important;
}

body.pearl-app-shell .p-5 {
  padding: 0.95rem !important;
}

body.pearl-app-shell .p-6 {
  padding: 1rem !important;
}

body.pearl-app-shell .px-8 {
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}

body.pearl-app-shell .py-8 {
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important;
}

body.pearl-app-shell .gap-8 {
  gap: 1.25rem !important;
}

body.pearl-app-shell .gap-6 {
  gap: 1rem !important;
}

body.pearl-app-shell .gap-5 {
  gap: 0.875rem !important;
}

body.pearl-app-shell .gap-4 {
  gap: 0.75rem !important;
}

body.pearl-app-shell .mb-8 {
  margin-bottom: 1.25rem !important;
}

body.pearl-app-shell .mb-6 {
  margin-bottom: 0.95rem !important;
}

body.pearl-app-shell .mt-6 {
  margin-top: 0.95rem !important;
}

body.pearl-app-shell .py-20,
body.pearl-app-shell .py-24,
body.pearl-app-shell .py-28 {
  padding-top: 3.5rem !important;
  padding-bottom: 3.5rem !important;
}

body.pearl-app-shell .space-y-8 > :not([hidden]) ~ :not([hidden]) {
  margin-top: 1.25rem !important;
}

body.pearl-app-shell .space-y-6 > :not([hidden]) ~ :not([hidden]) {
  margin-top: 1rem !important;
}

body.pearl-app-shell .space-y-4 > :not([hidden]) ~ :not([hidden]) {
  margin-top: 0.75rem !important;
}

body.pearl-app-shell .text-4xl {
  font-size: 2rem !important;
  line-height: 1.1 !important;
}

body.pearl-app-shell .text-3xl {
  font-size: 1.55rem !important;
  line-height: 1.2 !important;
}

body.pearl-app-shell .text-2xl {
  font-size: 1.3rem !important;
  line-height: 1.25 !important;
}

body.pearl-app-shell .text-6xl,
body.pearl-app-shell .text-5xl {
  font-size: 2.45rem !important;
  line-height: 1.05 !important;
}

body.pearl-app-shell .text-xl {
  font-size: 1.1rem !important;
  line-height: 1.3 !important;
}

body.pearl-app-shell .h-16 {
  height: 3.5rem !important;
}

body.pearl-app-shell .h-20 {
  height: 4.5rem !important;
}

body.pearl-app-shell .shadow-xl,
body.pearl-app-shell .shadow-2xl {
  box-shadow: 0 10px 26px rgba(18, 28, 45, 0.08) !important;
}

body.pearl-app-shell .text-base {
  font-size: 0.94rem !important;
}

body.pearl-app-shell .text-sm {
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

body.pearl-app-shell .text-xs {
  font-size: 0.72rem !important;
  line-height: 1.3 !important;
}

body.pearl-app-shell [role="dialog"] {
  max-width: min(94vw, 38rem) !important;
}

body.pearl-app-shell main {
  width: 100%;
}

body.pearl-app-shell main > div {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

body.pearl-app-shell [data-slot="dialog-content"] {
  padding: 1rem !important;
  border: 1px solid var(--pearl-console-border) !important;
  border-radius: 10px !important;
  overflow: hidden;
  box-sizing: border-box !important;
}

body.pearl-app-shell [data-slot="dialog-content"] * {
  box-sizing: border-box;
}

body.pearl-app-shell [data-slot="dialog-header"] {
  gap: 0.35rem !important;
  padding-bottom: 0.25rem !important;
}

body.pearl-app-shell [data-slot="dialog-footer"] {
  gap: 0.625rem !important;
  padding-top: 0.25rem !important;
}

body.pearl-app-shell [data-slot="card"] {
  border-color: var(--pearl-console-border) !important;
  border-radius: 8px !important;
  background: var(--pearl-console-panel) !important;
  box-shadow: none !important;
}

body.pearl-app-shell [data-slot="card"] [data-slot="card-header"],
body.pearl-app-shell [data-slot="card"] [data-slot="card-content"] {
  padding: 0.85rem 0.95rem !important;
}

body.pearl-app-shell [data-slot="dialog-content"] [role="tablist"] {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.45rem !important;
  overflow: hidden;
  padding: 0.3rem !important;
  border: 1px solid #edf0f5 !important;
  border-radius: 8px !important;
  background: #f5f7fb !important;
}

body.pearl-app-shell [data-slot="dialog-content"] [role="tab"] {
  min-width: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.45rem !important;
  padding: 0.65rem 0.8rem !important;
  font-size: 0.9rem !important;
  border-radius: 7px !important;
  white-space: nowrap;
}

body.pearl-app-shell [data-slot="dialog-content"] [data-state="active"][role="tab"] {
  background: #ffffff !important;
  color: var(--pearl-console-accent) !important;
  box-shadow: 0 1px 4px rgba(18, 28, 45, 0.08) !important;
}

body.pearl-app-shell [data-slot="dialog-content"] [role="tabpanel"] {
  min-width: 0 !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-2xl.border-2.border-dashed {
  min-width: 0 !important;
  padding: 1rem !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-2xl.border-2.border-dashed .text-center {
  min-width: 0 !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 .flex.items-center.justify-between.rounded-xl {
  align-items: flex-start !important;
  gap: 0.75rem !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 .flex.min-w-0.flex-1.items-center.gap-3 {
  align-items: flex-start !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 .truncate {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.32 !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 button {
  flex-shrink: 0;
  margin-top: -0.1rem;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 {
  align-items: flex-start !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 > .flex.min-w-0.flex-1.items-center.justify-between.gap-3,
body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 > .flex.min-w-0.flex-1.items-center.gap-3,
body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 .flex.min-w-0.flex-1.items-center.gap-3 {
  align-items: flex-start !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 .truncate,
body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 .text-sm.font-medium.text-gray-900 {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.32 !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 button {
  flex-shrink: 0;
}

body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 {
  max-height: 12rem !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 .text-xs,
body.pearl-app-shell [data-slot="dialog-content"] .max-h-40 .text-sm,
body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 .text-xs,
body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.bg-gray-50 .text-sm {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

body.pearl-app-shell .grid.gap-6 {
  gap: 0.95rem !important;
}

body.pearl-app-shell .grid.gap-4 {
  gap: 0.75rem !important;
}

body.pearl-app-shell .rounded-full.border.border-cyan-200.bg-cyan-50 {
  padding: 0.4rem 0.8rem !important;
  font-size: 0.78rem !important;
  border-color: #f1c3c5 !important;
  background: #fff6f6 !important;
  color: var(--pearl-console-accent-dark) !important;
}

body.pearl-app-shell .fixed.top-0.left-0.right-0.z-50 {
  padding-top: 0.65rem !important;
  padding-bottom: 0.65rem !important;
}

body.pearl-app-shell .fixed.top-0.left-0.right-0.z-50 .max-w-7xl {
  max-width: 1160px !important;
}

body.pearl-app-shell .fixed.top-0.left-0.right-0.z-50 .text-sm {
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
}

body.pearl-app-shell .fixed.top-0.left-0.right-0.z-50 .text-xs {
  font-size: 0.68rem !important;
  line-height: 1.15 !important;
}

body.pearl-app-shell .fixed.top-0.left-0.right-0.z-50 button {
  min-height: 2rem !important;
  padding: 0.45rem 0.85rem !important;
}

body.pearl-app-shell [data-slot="sidebar"],
body.pearl-app-shell [data-slot="sidebar-container"] {
  background: #ffffff !important;
  border-color: var(--pearl-console-border) !important;
  backdrop-filter: none;
}

body.pearl-app-shell [data-slot="sidebar"] {
  font-size: 0.78rem !important;
}

body.pearl-app-shell [data-slot="sidebar"] button,
body.pearl-app-shell [data-slot="sidebar"] a {
  min-height: 2rem !important;
  padding-top: 0.4rem !important;
  padding-bottom: 0.4rem !important;
  padding-left: 0.62rem !important;
  padding-right: 0.62rem !important;
  gap: 0.48rem !important;
  border-radius: 6px !important;
}

body.pearl-app-shell [data-slot="sidebar"] svg {
  width: 0.85rem !important;
  height: 0.85rem !important;
}

body.pearl-app-shell [data-slot="sidebar"] .text-lg {
  font-size: 0.92rem !important;
  line-height: 1.2 !important;
}

body.pearl-app-shell [data-slot="sidebar"] .text-base,
body.pearl-app-shell [data-slot="sidebar"] .text-sm {
  font-size: 0.74rem !important;
  line-height: 1.2 !important;
}

body.pearl-app-shell [data-slot="sidebar"] .text-xs {
  font-size: 0.64rem !important;
  line-height: 1.15 !important;
}

body.pearl-app-shell [data-slot="sidebar"] .size-8,
body.pearl-app-shell [data-slot="sidebar"] .size-9,
body.pearl-app-shell [data-slot="sidebar"] .size-10,
body.pearl-app-shell [data-slot="sidebar"] .size-12 {
  width: 2rem !important;
  height: 2rem !important;
}

body.pearl-app-shell [data-slot="sidebar"] .gap-3,
body.pearl-app-shell [data-slot="sidebar"] .gap-4 {
  gap: 0.5rem !important;
}

body.pearl-app-shell button {
  border-radius: 7px;
}

body.pearl-app-shell input,
body.pearl-app-shell textarea,
body.pearl-app-shell select {
  min-height: 2.35rem;
  border-radius: 7px !important;
}

body.pearl-app-shell .pearl-logo-image {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  padding: 0.35rem;
  background: transparent !important;
}

body.pearl-app-shell .overflow-hidden:has(> .pearl-logo-image) {
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  border: 1px solid var(--pearl-console-border);
  box-shadow: none !important;
}

body.pearl-app-shell .fixed.bottom-20.right-4.z-50.max-h-\[70vh\].w-96,
body.pearl-app-shell .fixed.bottom-20.right-4.z-50.max-h-\[70vh\].w-96 .p-4 {
  max-width: min(92vw, 22rem) !important;
}

body.pearl-app-shell .fixed.bottom-20.right-4.z-50.max-h-\[70vh\].w-96 {
  border-radius: 16px !important;
}

body.pearl-app-shell .max-h-\[90vh\].max-w-md,
body.pearl-app-shell .max-h-\[90vh\].max-w-md form {
  max-width: 24rem !important;
}

body.pearl-app-shell .max-h-\[90vh\].max-w-md .text-xl {
  font-size: 1.05rem !important;
}

body.pearl-app-shell .max-h-\[90vh\].max-w-md .text-xs {
  font-size: 0.7rem !important;
}

body.pearl-app-shell .max-h-\[90vh\].max-w-md .space-y-4 > :not([hidden]) ~ :not([hidden]) {
  margin-top: 0.7rem !important;
}

body.pearl-app-shell .min-h-screen.bg-gradient-to-br.from-cyan-50.via-white.to-blue-50,
body.pearl-app-shell .min-h-screen.bg-gradient-to-br.from-cyan-50.via-blue-50.to-white {
  background: var(--pearl-console-bg) !important;
}

body.pearl-app-shell .bg-gradient-to-r.from-cyan-500.to-blue-600,
body.pearl-app-shell .bg-cyan-600,
body.pearl-app-shell .bg-purple-600 {
  background: var(--pearl-console-accent) !important;
  background-image: none !important;
}

body.pearl-app-shell .hover\:from-cyan-600:hover,
body.pearl-app-shell .hover\:to-blue-700:hover,
body.pearl-app-shell .hover\:bg-cyan-700:hover,
body.pearl-app-shell .hover\:bg-purple-700:hover {
  background: var(--pearl-console-accent-dark) !important;
  background-image: none !important;
}

body.pearl-app-shell .text-cyan-600,
body.pearl-app-shell .text-cyan-700,
body.pearl-app-shell .text-purple-600,
body.pearl-app-shell .text-purple-700 {
  color: var(--pearl-console-accent) !important;
}

body.pearl-app-shell .border-cyan-200,
body.pearl-app-shell .border-purple-200 {
  border-color: #f0c4c7 !important;
}

body.pearl-app-shell .bg-cyan-50,
body.pearl-app-shell .bg-purple-50,
body.pearl-app-shell .bg-cyan-100,
body.pearl-app-shell .bg-purple-100 {
  background-color: #fff7f7 !important;
}

body.pearl-app-shell main {
  background: var(--pearl-console-bg) !important;
}

body.pearl-app-shell main > div > .mb-8:first-child,
body.pearl-app-shell main > div > .flex.items-center.justify-between:first-child,
body.pearl-app-shell main > div > .space-y-6 > .flex.items-center.justify-between:first-child {
  padding-bottom: 0.8rem !important;
  border-bottom: 1px solid var(--pearl-console-border) !important;
}

body.pearl-app-shell main h1,
body.pearl-app-shell main h2 {
  color: #0f172a !important;
  letter-spacing: 0 !important;
}

body.pearl-app-shell main p,
body.pearl-app-shell [data-slot="card-description"] {
  color: var(--pearl-console-muted) !important;
}

body.pearl-app-shell .lg\:grid-cols-2 > [data-slot="card"] {
  min-height: 24rem;
}

body.pearl-app-shell [data-slot="card"] .bg-gray-50 {
  border: 1px solid var(--pearl-console-line) !important;
  background: #fbfcfe !important;
}

body.pearl-app-shell [data-slot="card"] .hover\:bg-gray-100:hover,
body.pearl-app-shell [data-slot="card"] .hover\:bg-cyan-50:hover {
  background: #fff5f5 !important;
}

body.pearl-app-shell [data-slot="card"] .truncate {
  min-width: 0;
}

body.pearl-app-shell [data-slot="card"] .max-h-64 {
  max-height: 18rem !important;
}

body.pearl-app-shell [data-slot="card"] .border.rounded-lg.max-h-64 {
  border-radius: 8px !important;
}

body.pearl-app-shell [data-slot="card"] .border-b {
  border-color: var(--pearl-console-line) !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.border,
body.pearl-app-shell [data-slot="dialog-content"] .rounded-lg.border {
  border-color: var(--pearl-console-border) !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-xl.border.border-red-200,
body.pearl-app-shell [data-slot="dialog-content"] .bg-red-50 {
  border-color: #ffc4c8 !important;
  background: #fff2f3 !important;
}

body.pearl-app-shell [data-slot="dialog-content"] label,
body.pearl-app-shell label {
  color: #162235 !important;
  font-size: 0.78rem !important;
}

body.pearl-app-shell [data-slot="dialog-content"] .rounded-2xl.border-2.border-dashed {
  border-color: #cfd6df !important;
  background: #fbfcfe !important;
  border-radius: 8px !important;
}

body.pearl-app-shell .h-9 {
  height: 2.15rem !important;
}

body.pearl-app-shell .size-9 {
  width: 2.15rem !important;
  height: 2.15rem !important;
}

body.pearl-app-shell aside.w-64 {
  width: 14.5rem !important;
}

body.pearl-app-shell aside .border-b.p-6 {
  padding: 0.9rem !important;
}

body.pearl-app-shell aside nav {
  padding: 0.75rem !important;
}

body.pearl-app-shell aside .mt-auto {
  padding: 0.75rem !important;
}

body.pearl-app-shell aside .rounded-lg.bg-gradient-to-br,
body.pearl-app-shell aside .rounded-lg.bg-cyan-50,
body.pearl-app-shell aside .rounded-lg.bg-blue-50 {
  border-radius: 7px !important;
}

@media (max-width: 900px) {
  body.pearl-app-shell .p-8 {
    padding: 1rem !important;
  }

  body.pearl-app-shell .px-8 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  body.pearl-app-shell .gap-8 {
    gap: 1rem !important;
  }

  body.pearl-app-shell .text-6xl,
  body.pearl-app-shell .text-5xl {
    font-size: 2rem !important;
  }

  body.pearl-app-shell [data-slot="dialog-content"] {
    padding: 0.85rem !important;
  }

  body.pearl-app-shell [data-slot="dialog-content"] [role="tab"] {
    font-size: 0.82rem !important;
    padding: 0.6rem 0.55rem !important;
  }
}
