/*
 * 智能 API — full-site visual system
 * Loaded after the stock New API bundle by the local reverse proxy.
 * Scope: public pages, authentication, dashboard, tables, drawers and dialogs.
 */

/* Original creative workspace entry injected into the stock New API header. */
[data-luna-creative-link="true"] {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(134, 214, 169, 0.18) !important;
  border-radius: 8px !important;
  color: #cfe1d7 !important;
  background: rgba(134, 214, 169, 0.04) !important;
  font-size: 13.000px !important;
  font-weight: 550 !important;
  text-decoration: none !important;
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease, transform 180ms ease !important;
}

[data-luna-creative-link="true"]:hover {
  color: #f0f7f1 !important;
  border-color: rgba(134, 214, 169, 0.38) !important;
  background: rgba(134, 214, 169, 0.1) !important;
  transform: translateY(-1px) !important;
}

[data-luna-creative-link="true"]:active {
  transform: scale(0.98) !important;
}

@media (max-width: 760px) {
  [data-luna-creative-link="true"] {
    min-height: 31px !important;
    padding: 0 9px !important;
    font-size: 11.000px !important;
  }
}

:root,
html.light,
html.dark,
body,
body[data-theme-preset],
html.light body[data-theme-preset],
html.dark body[data-theme-preset] {
  color-scheme: dark;
  --radius: .72rem;
  --font-body: "Avenir Next", "HarmonyOS Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;

  --background: oklch(0.145 0.018 156);
  --foreground: oklch(0.955 0.012 150);
  --card: oklch(0.195 0.019 156);
  --card-foreground: oklch(0.955 0.012 150);
  --popover: oklch(0.205 0.021 156);
  --popover-foreground: oklch(0.955 0.012 150);

  --primary: oklch(0.79 0.13 157);
  --primary-foreground: oklch(0.145 0.025 156);
  --secondary: oklch(0.245 0.024 156);
  --secondary-foreground: oklch(0.9 0.018 150);
  --muted: oklch(0.225 0.018 156);
  --muted-foreground: oklch(0.71 0.025 153);
  --accent: oklch(0.25 0.038 157);
  --accent-foreground: oklch(0.91 0.055 155);

  --destructive: oklch(0.68 0.17 25);
  --destructive-foreground: oklch(0.985 0 0);
  --success: oklch(0.75 0.14 157);
  --success-foreground: oklch(0.14 0.02 156);
  --warning: oklch(0.78 0.12 82);
  --warning-foreground: oklch(0.18 0.03 75);
  --info: oklch(0.72 0.09 190);
  --info-foreground: oklch(0.15 0.02 190);
  --neutral: oklch(0.67 0.02 155);
  --neutral-foreground: oklch(0.13 0.01 155);

  --border: oklch(0.82 0.035 155 / 15%);
  --input: oklch(0.82 0.035 155 / 20%);
  --ring: oklch(0.79 0.13 157);

  --chart-1: oklch(0.79 0.13 157);
  --chart-2: oklch(0.7 0.08 177);
  --chart-3: oklch(0.72 0.06 137);
  --chart-4: oklch(0.64 0.06 197);
  --chart-5: oklch(0.84 0.07 96);
  --overview-accent-1: oklch(0.79 0.13 157);
  --overview-accent-2: oklch(0.7 0.08 177);
  --overview-accent-3: oklch(0.72 0.06 137);

  --sidebar: oklch(0.125 0.017 156);
  --sidebar-foreground: oklch(0.9 0.015 150);
  --sidebar-primary: oklch(0.79 0.13 157);
  --sidebar-primary-foreground: oklch(0.145 0.025 156);
  --sidebar-accent: oklch(0.245 0.04 157);
  --sidebar-accent-foreground: oklch(0.91 0.055 155);
  --sidebar-border: oklch(0.82 0.035 155 / 13%);
  --sidebar-ring: oklch(0.79 0.13 157);

  --skeleton-base: oklch(0.23 0.018 156);
  --skeleton-highlight: oklch(0.31 0.026 156);
  --table-row: oklch(0.17 0.017 156 / 82%);
  --table-header: oklch(0.22 0.025 156 / 94%);
  --table-header-hover: oklch(0.27 0.035 157 / 96%);
  --table-disabled: oklch(0.19 0.01 156 / 62%);
  --table-disabled-hover: oklch(0.22 0.014 156 / 72%);
  --table-disabled-border: oklch(0.82 0.035 155 / 10%);
}

html {
  scroll-behavior: smooth;
  background: #07100c;
}

body {
  min-height: 100dvh;
  background:
    radial-gradient(900px 540px at 8% -10%, rgba(74, 151, 112, .16), transparent 62%),
    radial-gradient(760px 480px at 102% 8%, rgba(77, 122, 101, .1), transparent 68%),
    #07100c !important;
  color: #e9f0ec;
  font-family: var(--font-body);
  font-feature-settings: "ss01" 1, "cv02" 1;
  -webkit-font-smoothing: antialiased;
}

body::before {
  position: fixed;
  z-index: 70;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

::selection {
  color: #07100c;
  background: #76d8aa;
}

* {
  scrollbar-color: rgba(118, 216, 170, .34) transparent;
  scrollbar-width: thin;
}

*:focus-visible {
  outline: 2px solid rgba(118, 216, 170, .9) !important;
  outline-offset: 3px !important;
}

h1,
h2,
h3,
[data-slot="card-title"] {
  letter-spacing: -.035em;
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

code,
pre,
.font-mono,
[class*="tabular"] {
  font-family: "SFMono-Regular", "Cascadia Code", Consolas, monospace !important;
  font-variant-numeric: tabular-nums;
}

/* Global header */
#root > div > header,
#root > div > div > header,
header.sticky,
header.fixed {
  border-color: rgba(191, 222, 205, .11) !important;
  background: rgba(8, 15, 12, .76) !important;
  box-shadow: 0 16px 50px rgba(2, 11, 7, .16);
  backdrop-filter: blur(22px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(125%) !important;
}

header nav a,
header nav button {
  transition: color .22s ease, background-color .22s ease, transform .22s ease !important;
}

header nav a:hover,
header nav button:hover {
  color: #9be7c0 !important;
}

header nav a[data-status="active"],
header nav a[aria-current="page"] {
  color: #a4edc7 !important;
  background: rgba(118, 216, 170, .09) !important;
}

header img,
[data-slot="sidebar-header"] img {
  border-radius: 9px !important;
}

/* Sidebar: compact command rail with clear active state */
[data-slot="sidebar"] {
  border-color: rgba(191, 222, 205, .11) !important;
}

[data-sidebar="sidebar"] {
  background:
    radial-gradient(440px 300px at -20% 0%, rgba(74, 151, 112, .11), transparent 70%),
    rgba(7, 14, 11, .96) !important;
  box-shadow: 18px 0 54px rgba(2, 10, 6, .14);
}

[data-sidebar="group"] {
  margin-block: .16rem;
}

[data-sidebar="group-label"] {
  color: rgba(182, 202, 191, .52) !important;
  font-size: .6875rem !important;
  letter-spacing: .12em;
  text-transform: uppercase;
}

[data-sidebar="menu-button"] {
  position: relative;
  border-radius: 9px 4px 9px 4px !important;
  transition: transform .2s ease, background-color .2s ease, color .2s ease !important;
}

[data-sidebar="menu-button"]:hover {
  color: #dff7e9 !important;
  background: rgba(118, 216, 170, .08) !important;
  transform: translateX(2px);
}

[data-sidebar="menu-button"][data-active="true"] {
  color: #a4edc7 !important;
  background: linear-gradient(90deg, rgba(118, 216, 170, .15), rgba(118, 216, 170, .045)) !important;
  box-shadow: inset 2px 0 0 #76d8aa;
}

[data-slot="sidebar-inset"] {
  background: transparent !important;
}

/* Cards and grouped surfaces */
[data-slot="card"] {
  border-radius: 18px 7px 18px 7px !important;
  background:
    linear-gradient(145deg, rgba(27, 39, 33, .88), rgba(17, 26, 21, .82)) !important;
  box-shadow:
    0 22px 58px rgba(2, 10, 6, .14),
    inset 0 1px 0 rgba(231, 255, 243, .045) !important;
  ring-color: rgba(191, 222, 205, .12) !important;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease !important;
}

[data-slot="card"]:hover {
  box-shadow:
    0 26px 68px rgba(2, 10, 6, .2),
    inset 0 1px 0 rgba(231, 255, 243, .065) !important;
}

[data-slot="card-header"] {
  border-color: rgba(191, 222, 205, .1) !important;
}

[data-slot="card-title"] {
  font-weight: 620 !important;
}

[data-slot="card-footer"] {
  border-color: rgba(191, 222, 205, .1) !important;
  background: rgba(118, 216, 170, .035) !important;
}

/* Buttons, fields and switches */
[data-slot="button"] {
  border-radius: 10px 4px 10px 4px !important;
  transition: transform .2s ease, color .2s ease, background-color .2s ease, box-shadow .2s ease !important;
}

[data-slot="button"]:hover:not(:disabled) {
  transform: translateY(-1px);
}

[data-slot="button"]:active:not(:disabled) {
  transform: translateY(0) scale(.98);
}

[data-slot="button"][class*="bg-primary"] {
  box-shadow: 0 10px 30px rgba(48, 126, 89, .2);
}

[data-slot="button"][class*="bg-primary"][class*="text-primary-foreground"],
header nav a[href="/sign-in"][class*="bg-primary"] {
  color: #ffffff !important;
}

[data-slot="button"][class*="bg-primary"][class*="text-primary-foreground"]:hover,
header nav a[href="/sign-in"][class*="bg-primary"]:hover {
  color: #ffffff !important;
  background: #2f6948 !important;
}

[data-slot="input"],
[data-slot="textarea"],
[data-slot="select-trigger"],
input,
textarea,
select {
  border-color: rgba(191, 222, 205, .14) !important;
  border-radius: 10px 4px 10px 4px !important;
  background: rgba(5, 12, 9, .42) !important;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease !important;
}

[data-slot="input"]:focus,
[data-slot="textarea"]:focus,
input:focus,
textarea:focus,
select:focus {
  border-color: rgba(118, 216, 170, .55) !important;
  background: rgba(6, 14, 10, .68) !important;
  box-shadow: 0 0 0 3px rgba(118, 216, 170, .09) !important;
}

/* Tables */
[data-slot="table-container"] {
  border: 1px solid rgba(191, 222, 205, .11);
  border-radius: 18px 7px 18px 7px !important;
  background: rgba(14, 22, 18, .56);
  box-shadow: 0 24px 60px rgba(2, 10, 6, .12);
}

[data-slot="table-header"] {
  background: rgba(118, 216, 170, .045) !important;
}

[data-slot="table-head"] {
  color: rgba(210, 225, 217, .62) !important;
  font-size: .75rem !important;
  font-weight: 650 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}

[data-slot="table-row"] {
  border-color: rgba(191, 222, 205, .085) !important;
  transition: background-color .18s ease !important;
}

[data-slot="table-row"]:hover {
  background: rgba(118, 216, 170, .045) !important;
}

/* Drawers, dialogs and menus */
[data-slot="dialog-overlay"],
[data-slot="sheet-overlay"],
[data-slot="alert-dialog-overlay"] {
  background: rgba(1, 7, 4, .7) !important;
  backdrop-filter: blur(10px);
}

[data-slot="dialog-content"],
[data-slot="sheet-content"],
[data-slot="alert-dialog-content"],
[data-slot="popover-content"],
[data-slot="dropdown-menu-content"],
[role="dialog"] {
  border-color: rgba(191, 222, 205, .14) !important;
  background:
    radial-gradient(520px 260px at 0% 0%, rgba(74, 151, 112, .12), transparent 70%),
    rgba(17, 26, 21, .97) !important;
  box-shadow: 0 40px 100px rgba(1, 8, 4, .46), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

[data-slot="dialog-content"],
[data-slot="alert-dialog-content"] {
  border-radius: 22px 9px 22px 9px !important;
}

[data-slot="sheet-content"] {
  box-shadow: -28px 0 90px rgba(1, 8, 4, .42) !important;
}

/* Public model catalog: remove the stock blue/purple AI gradient */
body:has(input[placeholder*="搜索模型"]) [aria-hidden="true"][style*="radial-gradient"] {
  opacity: .34 !important;
  background:
    radial-gradient(ellipse 60% 52% at 18% 14%, rgba(74, 151, 112, .32), transparent 72%),
    radial-gradient(ellipse 46% 40% at 82% 10%, rgba(83, 131, 109, .2), transparent 72%) !important;
}

body:has(input[placeholder*="搜索模型"]) h1 {
  color: #eff7f2;
  font-size: clamp(1.500rem, 6.000vw, 3.000rem) !important;
  font-weight: 640 !important;
  letter-spacing: -.065em !important;
}

body:has(input[placeholder*="搜索模型"]) aside {
  border-color: rgba(191, 222, 205, .1) !important;
  border-radius: 20px 8px 20px 8px !important;
  background: rgba(10, 18, 14, .58) !important;
  box-shadow: 0 25px 70px rgba(2, 10, 6, .13);
  backdrop-filter: blur(16px);
}

body:has(input[placeholder*="搜索模型"]) main [class*="grid"] > [class*="group"] {
  transition: transform .25s ease, box-shadow .25s ease !important;
}

/* Authentication and account recovery */
body:has(input[type="password"]) [data-slot="card"],
body:has(input[type="password"]) form {
  position: relative;
}

body:has(input[type="password"]) h1,
body:has(input[type="password"]) h2 {
  font-size: clamp(1.111rem, 4.000vw, 1.778rem) !important;
  font-weight: 620 !important;
  letter-spacing: -.055em !important;
}

body:has(input[type="password"]) main,
body:has(input[type="password"]) [class*="min-h-svh"] {
  background:
    radial-gradient(760px 520px at 12% 8%, rgba(74, 151, 112, .18), transparent 68%),
    radial-gradient(640px 460px at 100% 100%, rgba(54, 98, 77, .12), transparent 70%) !important;
}

body:has(input[type="password"])::after {
  position: fixed;
  left: clamp(2rem, 6vw, 7rem);
  bottom: clamp(2.5rem, 8vh, 6rem);
  z-index: 1;
  width: min(42vw, 520px);
  pointer-events: none;
  content: attr(data-luna-model-label) "\A ONE ENDPOINT";
  white-space: pre;
  color: transparent;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: clamp(1.556rem, 6.000vw, 3.556rem);
  font-weight: 700;
  line-height: .86;
  letter-spacing: -.075em;
  -webkit-text-stroke: 1px rgba(177, 207, 191, .22);
}

@media (min-width: 960px) {
  body:has(input[type="password"]) [class~="container"] > div {
    margin-right: clamp(3rem, 8vw, 9rem) !important;
    margin-left: auto !important;
    padding: 38px !important;
    border: 1px solid rgba(191, 222, 205, .12);
    border-radius: 22px 9px 22px 9px;
    background: rgba(14, 23, 18, .58);
    box-shadow: 0 34px 90px rgba(1, 8, 4, .25), inset 0 1px 0 rgba(255, 255, 255, .035);
    backdrop-filter: blur(18px);
  }
}

/* Dashboard spacing and hierarchy */
body:has([data-sidebar="sidebar"]) main h2:first-child {
  font-size: clamp(0.917rem, 3.000vw, 1.306rem) !important;
  font-weight: 620 !important;
  letter-spacing: -.05em !important;
}

body:has([data-sidebar="sidebar"]) [data-slot="card"] {
  animation: luna-surface-in .48s cubic-bezier(.2, .7, .2, 1) both;
}

body:has([data-sidebar="sidebar"]) [data-slot="card"]:nth-of-type(2) { animation-delay: .04s; }
body:has([data-sidebar="sidebar"]) [data-slot="card"]:nth-of-type(3) { animation-delay: .08s; }

@keyframes luna-surface-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Notifications and loading */
[data-sonner-toaster] [data-sonner-toast] {
  border-color: rgba(191, 222, 205, .15) !important;
  border-radius: 14px 6px 14px 6px !important;
  background: rgba(15, 25, 20, .96) !important;
  box-shadow: 0 24px 70px rgba(1, 8, 4, .34) !important;
  backdrop-filter: blur(18px);
}

[data-slot="skeleton"] {
  background: linear-gradient(100deg, rgba(118, 216, 170, .035), rgba(118, 216, 170, .11), rgba(118, 216, 170, .035)) !important;
  background-size: 200% 100% !important;
}

/* Preserve the approved custom homepage as its own art direction. */
.luna-home {
  isolation: isolate;
}

.luna-home [class*="luna-"] {
  font-family: inherit;
}

/*
 * Playground light workspace
 * Matches the creative studio's paper, moss and soft-white palette while
 * leaving the rest of the authenticated product on its existing theme.
 */
html[data-luna-route="playground"],
html[data-luna-route="playground"] body {
  color-scheme: light;
  --background: #f6f7f3;
  --foreground: #17211a;
  --card: #ffffff;
  --card-foreground: #17211a;
  --popover: #ffffff;
  --popover-foreground: #17211a;
  --primary: #397a54;
  --primary-foreground: #ffffff;
  --secondary: #edf1eb;
  --secondary-foreground: #26372c;
  --muted: #edf1eb;
  --muted-foreground: #65756b;
  --accent: #e4f0e8;
  --accent-foreground: #236542;
  --border: rgba(42, 82, 57, .14);
  --input: rgba(42, 82, 57, .2);
  --ring: #58a879;
  --sidebar: #f0f3ee;
  --sidebar-foreground: #26372c;
  --sidebar-primary: #397a54;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #dfece3;
  --sidebar-accent-foreground: #236542;
  --sidebar-border: rgba(42, 82, 57, .13);
  --sidebar-ring: #58a879;
}

html[data-luna-route="playground"] {
  background: #f6f7f3 !important;
}

html[data-luna-route="playground"] body {
  color: #17211a !important;
  background:
    radial-gradient(920px 560px at 88% -8%, rgba(88, 168, 121, .13), transparent 64%),
    radial-gradient(760px 500px at -8% 28%, rgba(181, 210, 191, .18), transparent 68%),
    #f6f7f3 !important;
}

html[data-luna-route="playground"] body::before {
  opacity: .045;
  mix-blend-mode: multiply;
}

html[data-luna-route="playground"] ::selection {
  color: #17301f;
  background: #bfe5cd;
}

html[data-luna-route="playground"] #root > div > header,
html[data-luna-route="playground"] #root > div > div > header,
html[data-luna-route="playground"] header.sticky,
html[data-luna-route="playground"] header.fixed {
  border-color: rgba(42, 82, 57, .11) !important;
  color: #26372c !important;
  background: rgba(250, 251, 248, .88) !important;
  box-shadow: 0 16px 44px rgba(50, 73, 57, .08) !important;
}

html[data-luna-route="playground"] header nav a,
html[data-luna-route="playground"] header nav button {
  color: #52645a !important;
}

html[data-luna-route="playground"] header nav a:hover,
html[data-luna-route="playground"] header nav button:hover,
html[data-luna-route="playground"] header nav a[data-status="active"],
html[data-luna-route="playground"] header nav a[aria-current="page"] {
  color: #236542 !important;
  background: rgba(88, 168, 121, .1) !important;
}

html[data-luna-route="playground"] [data-luna-creative-link="true"] {
  border-color: rgba(42, 94, 62, .18) !important;
  color: #397a54 !important;
  background: rgba(88, 168, 121, .07) !important;
}

html[data-luna-route="playground"] [data-slot="card"] {
  color: #17211a !important;
  background: rgba(255, 255, 255, .9) !important;
  box-shadow:
    0 22px 58px rgba(50, 73, 57, .09),
    inset 0 1px 0 rgba(255, 255, 255, .9) !important;
}

html[data-luna-route="playground"] [data-slot="input"],
html[data-luna-route="playground"] [data-slot="textarea"],
html[data-luna-route="playground"] [data-slot="select-trigger"],
html[data-luna-route="playground"] input,
html[data-luna-route="playground"] textarea,
html[data-luna-route="playground"] select {
  border-color: rgba(42, 82, 57, .16) !important;
  color: #17211a !important;
  background: rgba(255, 255, 255, .78) !important;
}

html[data-luna-route="playground"] [data-slot="input"]:focus,
html[data-luna-route="playground"] [data-slot="textarea"]:focus,
html[data-luna-route="playground"] input:focus,
html[data-luna-route="playground"] textarea:focus,
html[data-luna-route="playground"] select:focus {
  border-color: rgba(88, 168, 121, .58) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(88, 168, 121, .11) !important;
}

html[data-luna-route="playground"] textarea::placeholder,
html[data-luna-route="playground"] input::placeholder {
  color: #87958c !important;
}

html[data-luna-route="playground"] [data-slot="dialog-content"],
html[data-luna-route="playground"] [data-slot="sheet-content"],
html[data-luna-route="playground"] [data-slot="alert-dialog-content"],
html[data-luna-route="playground"] [data-slot="popover-content"],
html[data-luna-route="playground"] [data-slot="dropdown-menu-content"],
html[data-luna-route="playground"] [role="dialog"] {
  border-color: rgba(42, 82, 57, .15) !important;
  color: #17211a !important;
  background:
    radial-gradient(520px 260px at 0% 0%, rgba(181, 210, 191, .18), transparent 70%),
    rgba(255, 255, 255, .98) !important;
  box-shadow: 0 34px 90px rgba(50, 73, 57, .18) !important;
}

html[data-luna-route="playground"] #luna-route-loader {
  color: #26372c !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(88, 168, 121, .16), transparent 28rem),
    #f6f7f3 !important;
}

html[data-luna-route="playground"] #luna-route-loader small {
  color: #75857b !important;
}

html[data-luna-route="playground"] #luna-route-loader span {
  border-color: rgba(42, 82, 57, .16) !important;
  border-top-color: #58a879 !important;
}

html[data-luna-route="playground"] #luna-conversation-panel {
  border-color: rgba(42, 82, 57, .15) !important;
  color: #26372c !important;
  background:
    radial-gradient(circle at 15% 0, rgba(88, 168, 121, .14), transparent 36%),
    rgba(250, 251, 248, .98) !important;
  box-shadow: 0 24px 70px rgba(50, 73, 57, .14), inset 0 1px #ffffff !important;
}

html[data-luna-route="playground"] .luna-conversation-header {
  border-color: rgba(42, 82, 57, .1) !important;
}

html[data-luna-route="playground"] .luna-conversation-eyebrow {
  color: #397a54 !important;
}

html[data-luna-route="playground"] .luna-conversation-heading,
html[data-luna-route="playground"] .luna-conversation-title {
  color: #1f3025 !important;
}

html[data-luna-route="playground"] .luna-conversation-cloud,
html[data-luna-route="playground"] .luna-conversation-meta,
html[data-luna-route="playground"] .luna-conversation-empty {
  color: #708077 !important;
}

html[data-luna-route="playground"] .luna-conversation-cloud::before {
  background: #58a879 !important;
}

html[data-luna-route="playground"] .luna-conversation-icon-button,
html[data-luna-route="playground"] .luna-conversation-action {
  border-color: rgba(42, 82, 57, .12) !important;
  color: #64776b !important;
  background: rgba(255, 255, 255, .58) !important;
}

html[data-luna-route="playground"] .luna-conversation-icon-button:hover,
html[data-luna-route="playground"] .luna-conversation-action:hover {
  color: #236542 !important;
  background: rgba(88, 168, 121, .11) !important;
}

html[data-luna-route="playground"] .luna-conversation-new {
  border-color: rgba(42, 94, 62, .2) !important;
  color: #236542 !important;
  background: linear-gradient(135deg, rgba(88, 168, 121, .15), rgba(181, 210, 191, .16)) !important;
}

html[data-luna-route="playground"] .luna-conversation-item:hover {
  border-color: rgba(42, 82, 57, .1) !important;
  background: rgba(88, 168, 121, .06) !important;
}

html[data-luna-route="playground"] .luna-conversation-item.is-active {
  border-color: rgba(42, 94, 62, .2) !important;
  background: linear-gradient(135deg, rgba(88, 168, 121, .16), rgba(181, 210, 191, .12)) !important;
}

html[data-luna-route="playground"] #luna-conversation-toast {
  border-color: rgba(42, 94, 62, .2) !important;
  color: #21452e !important;
  background: rgba(250, 252, 249, .97) !important;
  box-shadow: 0 18px 48px rgba(50, 73, 57, .16) !important;
}

html[data-luna-route="playground"] #luna-attachments-tray,
html[data-luna-route="playground"] #luna-artifact-dock {
  border-color: rgba(42, 82, 57, .14) !important;
  color: #26372c !important;
  background: rgba(250, 251, 248, .96) !important;
  box-shadow: 0 20px 56px rgba(50, 73, 57, .14) !important;
}

/* Full-site light surfaces aligned with the approved white homepage. */
:root,
html.light,
html.dark,
body,
body[data-theme-preset],
html.light body[data-theme-preset],
html.dark body[data-theme-preset] {
  color-scheme: light;
  --background: #f6f7f3;
  --foreground: #17211a;
  --card: #ffffff;
  --card-foreground: #17211a;
  --popover: #ffffff;
  --popover-foreground: #17211a;
  --primary: #397a54;
  --primary-foreground: #ffffff;
  --secondary: #edf1eb;
  --secondary-foreground: #26372c;
  --muted: #edf1eb;
  --muted-foreground: #65756b;
  --accent: #e4f0e8;
  --accent-foreground: #236542;
  --destructive: #b64d46;
  --destructive-foreground: #ffffff;
  --success: #58a879;
  --success-foreground: #ffffff;
  --warning: #b4883f;
  --warning-foreground: #ffffff;
  --info: #4f8b78;
  --info-foreground: #ffffff;
  --neutral: #75857b;
  --neutral-foreground: #ffffff;
  --border: rgba(42, 82, 57, .14);
  --input: rgba(42, 82, 57, .2);
  --ring: #58a879;
  --sidebar: #f0f3ee;
  --sidebar-foreground: #26372c;
  --sidebar-primary: #397a54;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #dfece3;
  --sidebar-accent-foreground: #236542;
  --sidebar-border: rgba(42, 82, 57, .13);
  --sidebar-ring: #58a879;
  --skeleton-base: #e7ece6;
  --skeleton-highlight: #f7f9f6;
  --table-row: rgba(255, 255, 255, .76);
  --table-header: rgba(237, 242, 237, .94);
  --table-header-hover: rgba(225, 237, 228, .96);
  --table-disabled: rgba(241, 244, 240, .72);
  --table-disabled-hover: rgba(234, 239, 233, .88);
  --table-disabled-border: rgba(42, 82, 57, .08);
}

html {
  font-size: 100% !important;
  background: #f6f7f3 !important;
}

body {
  color: #17211a !important;
  background:
    radial-gradient(920px 560px at 88% -8%, rgba(88, 168, 121, .13), transparent 64%),
    radial-gradient(760px 500px at -8% 28%, rgba(181, 210, 191, .18), transparent 68%),
    #f6f7f3 !important;
}

body::before {
  opacity: .045;
  mix-blend-mode: multiply;
}

::selection {
  color: #17301f;
  background: #bfe5cd;
}

#root > div > header,
#root > div > div > header,
header.sticky,
header.fixed {
  border-color: rgba(42, 82, 57, .11) !important;
  color: #26372c !important;
  background: rgba(250, 251, 248, .9) !important;
  box-shadow: 0 16px 44px rgba(50, 73, 57, .08) !important;
}

header nav a,
header nav button {
  color: #52645a !important;
}

header nav a:hover,
header nav button:hover,
header nav a[data-status="active"],
header nav a[aria-current="page"] {
  color: #236542 !important;
  background: rgba(88, 168, 121, .1) !important;
}

[data-luna-creative-link="true"] {
  border-color: rgba(42, 94, 62, .18) !important;
  color: #397a54 !important;
  background: rgba(88, 168, 121, .07) !important;
}

[data-slot="sidebar"] {
  border-color: rgba(42, 82, 57, .11) !important;
}

[data-sidebar="sidebar"] {
  color: #26372c !important;
  background:
    radial-gradient(440px 300px at -20% 0%, rgba(88, 168, 121, .11), transparent 70%),
    rgba(246, 248, 244, .98) !important;
  box-shadow: 18px 0 54px rgba(50, 73, 57, .08) !important;
}

[data-sidebar="group-label"] {
  color: #87958c !important;
}

[data-sidebar="menu-button"] {
  color: #52645a !important;
}

[data-sidebar="menu-button"]:hover {
  color: #236542 !important;
  background: rgba(88, 168, 121, .09) !important;
}

[data-sidebar="menu-button"][data-active="true"] {
  color: #236542 !important;
  background: linear-gradient(90deg, rgba(88, 168, 121, .16), rgba(88, 168, 121, .045)) !important;
  box-shadow: inset 2px 0 0 #58a879 !important;
}

[data-slot="card"] {
  color: #17211a !important;
  background: rgba(255, 255, 255, .9) !important;
  box-shadow:
    0 22px 58px rgba(50, 73, 57, .09),
    inset 0 1px 0 rgba(255, 255, 255, .94) !important;
}

[data-slot="card"]:hover {
  box-shadow:
    0 26px 68px rgba(50, 73, 57, .12),
    inset 0 1px 0 #ffffff !important;
}

[data-slot="card-header"],
[data-slot="card-footer"] {
  border-color: rgba(42, 82, 57, .1) !important;
}

[data-slot="card-footer"] {
  background: rgba(88, 168, 121, .035) !important;
}

[data-slot="input"],
[data-slot="textarea"],
[data-slot="select-trigger"],
input,
textarea,
select {
  border-color: rgba(42, 82, 57, .16) !important;
  color: #17211a !important;
  background: rgba(255, 255, 255, .78) !important;
}

[data-slot="input"]:focus,
[data-slot="textarea"]:focus,
input:focus,
textarea:focus,
select:focus {
  border-color: rgba(88, 168, 121, .58) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(88, 168, 121, .11) !important;
}

textarea::placeholder,
input::placeholder {
  color: #87958c !important;
}

[data-slot="table-container"] {
  border-color: rgba(42, 82, 57, .11) !important;
  background: rgba(255, 255, 255, .78) !important;
  box-shadow: 0 24px 60px rgba(50, 73, 57, .08) !important;
}

[data-slot="table-header"] {
  background: rgba(88, 168, 121, .055) !important;
}

[data-slot="table-head"] {
  color: #708077 !important;
}

[data-slot="table-row"] {
  border-color: rgba(42, 82, 57, .085) !important;
}

[data-slot="table-row"]:hover {
  background: rgba(88, 168, 121, .055) !important;
}

[data-slot="dialog-overlay"],
[data-slot="sheet-overlay"],
[data-slot="alert-dialog-overlay"] {
  background: rgba(27, 42, 32, .24) !important;
}

[data-slot="dialog-content"],
[data-slot="sheet-content"],
[data-slot="alert-dialog-content"],
[data-slot="popover-content"],
[data-slot="dropdown-menu-content"],
[role="dialog"] {
  border-color: rgba(42, 82, 57, .15) !important;
  color: #17211a !important;
  background:
    radial-gradient(520px 260px at 0% 0%, rgba(181, 210, 191, .18), transparent 70%),
    rgba(255, 255, 255, .98) !important;
  box-shadow: 0 34px 90px rgba(50, 73, 57, .18) !important;
}

body:has(input[placeholder*="搜索模型"]) [aria-hidden="true"][style*="radial-gradient"] {
  opacity: .46 !important;
  background:
    radial-gradient(ellipse 60% 52% at 18% 14%, rgba(181, 210, 191, .3), transparent 72%),
    radial-gradient(ellipse 46% 40% at 82% 10%, rgba(88, 168, 121, .16), transparent 72%) !important;
}

body:has(input[placeholder*="搜索模型"]) h1 {
  color: #1f3025 !important;
}

body:has(input[placeholder*="搜索模型"]) aside {
  border-color: rgba(42, 82, 57, .1) !important;
  background: rgba(255, 255, 255, .7) !important;
  box-shadow: 0 25px 70px rgba(50, 73, 57, .09) !important;
}

body:has(input[type="password"]) main,
body:has(input[type="password"]) [class*="min-h-svh"] {
  background:
    radial-gradient(760px 520px at 12% 8%, rgba(181, 210, 191, .2), transparent 68%),
    radial-gradient(640px 460px at 100% 100%, rgba(88, 168, 121, .1), transparent 70%),
    #f6f7f3 !important;
}

body:has(input[type="password"])::after {
  -webkit-text-stroke-color: rgba(49, 91, 64, .16);
}

@media (min-width: 960px) {
  body:has(input[type="password"]) [class~="container"] > div {
    border-color: rgba(42, 82, 57, .12) !important;
    background: rgba(255, 255, 255, .74) !important;
    box-shadow: 0 34px 90px rgba(50, 73, 57, .12), inset 0 1px 0 #ffffff !important;
  }
}

[data-sonner-toaster] [data-sonner-toast] {
  border-color: rgba(42, 82, 57, .15) !important;
  color: #26372c !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 24px 70px rgba(50, 73, 57, .16) !important;
}

[data-slot="skeleton"] {
  background: linear-gradient(100deg, #e7ece6, #f8faf7, #e7ece6) !important;
}

body[data-luna-route="rankings"] canvas {
  filter: hue-rotate(-72deg) saturate(.72);
}

#luna-route-loader {
  color: #26372c !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(88, 168, 121, .16), transparent 28rem),
    #f6f7f3 !important;
}

#luna-route-loader small {
  color: #75857b !important;
}

#luna-route-loader span {
  border-color: rgba(42, 82, 57, .16) !important;
  border-top-color: #58a879 !important;
}

#luna-desktop-panel,
#luna-attachments-tray,
#luna-artifact-dock {
  border-color: rgba(42, 82, 57, .14) !important;
  color: #26372c !important;
  background: rgba(250, 251, 248, .98) !important;
  box-shadow: 0 20px 56px rgba(50, 73, 57, .14) !important;
}

@media (max-width: 768px) {
  body::before { opacity: .11; }
  body:has(input[type="password"])::after { display: none; }

  [data-slot="card"],
  [data-slot="table-container"],
  [data-slot="dialog-content"] {
    border-radius: 15px 6px 15px 6px !important;
  }

  body:has(input[placeholder*="搜索模型"]) h1 {
    font-size: clamp(1.361rem, 14.000vw, 2.222rem) !important;
  }

  [data-sidebar="sidebar"] {
    box-shadow: 24px 0 70px rgba(50, 73, 57, .18);
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Premium responsive typography hierarchy */
body:has(input[placeholder*="搜索模型"]) h1 {
  max-width: 11ch;
  font-size: clamp(2.75rem, 6vw, 5.5rem) !important;
  line-height: .94 !important;
  text-wrap: balance;
}

body:has(input[type="password"]) h1 {
  font-size: clamp(1.75rem, 3vw, 2.75rem) !important;
  line-height: 1 !important;
  text-wrap: balance;
}

body:has(input[type="password"]) h2 {
  font-size: clamp(2.5rem, 5vw, 4.5rem) !important;
  line-height: .98 !important;
  text-wrap: balance;
}

body:has([data-sidebar="sidebar"]) main h2:first-child {
  font-size: clamp(1.5rem, 2vw, 2.25rem) !important;
  line-height: 1.08 !important;
  text-wrap: balance;
}

body:has([data-slot="table"]) [data-slot="table-cell"] {
  line-height: 1.55;
}

@media (max-width: 760px) {
  body:has(input[placeholder*="搜索模型"]) h1 {
    font-size: clamp(2.6rem, 13vw, 4.4rem) !important;
  }

  body:has(input[type="password"]) h1 {
    font-size: clamp(1.6rem, 8vw, 2.2rem) !important;
  }

  body:has(input[type="password"]) h2 {
    font-size: clamp(2.25rem, 11vw, 3.25rem) !important;
  }

  body:has([data-sidebar="sidebar"]) main h2:first-child {
    font-size: clamp(1.35rem, 6vw, 1.9rem) !important;
  }
}