/* Saturn · work surfaces and glass controls in both themes. */
html[data-theme] {
  --saturn-ui: "Microsoft YaHei", "微软雅黑", "PingFang SC", system-ui, sans-serif;
  --saturn-heading: KaiTi, "楷体", "Kaiti SC", STKaiti, var(--saturn-ui);
  --lens-ink: #f6eee1;
  --lens-fill: rgb(32 33 43 / 71%);
  --lens-light: rgb(255 234 202 / 14%);
  --lens-reflection: rgb(255 234 202 / 32%);
  --lens-edge: rgb(230 211 184 / 17%);
  --lens-shadow: rgb(2 5 13 / 27%);
  --solid-surface: #20212b;
  --focus-ring: #ffd9af;
}
html[data-theme="warm"] {
  --lens-ink: #403328;
  --lens-fill: rgb(255 249 237 / 69%);
  --lens-light: rgb(255 255 255 / 56%);
  --lens-reflection: rgb(255 255 255 / 89%);
  --lens-edge: rgb(138 102 65 / 20%);
  --lens-shadow: rgb(101 70 42 / 10%);
  --solid-surface: #fffcf7;
  --focus-ring: #804427;
}
html[data-theme] body,
html[data-theme] :is(button, input, select, textarea) { font-family: var(--saturn-ui); }
html[data-theme] .account-screen .account-form h1,
html[data-theme] .app .workspace:not(.has-messages) .welcome h1 {
  font-family: var(--saturn-heading);
  font-weight: 500;
  letter-spacing: .045em;
  text-wrap: balance;
}
html[data-theme="dark"] .account-screen {
  background: radial-gradient(ellipse at 69% 27%, #a0835729, transparent 45%),
    linear-gradient(111deg, #090c16c2, #12192578 54%, #0c101acc),
    url('/ops/art/deepspace.jpg') 55% center / cover, #11131c;
}
html[data-theme="warm"] .account-screen {
  background: radial-gradient(ellipse at 72% 33%, #fbd5a9 0, transparent 50%),
    radial-gradient(ellipse at 12% 83%, #e8d4c6, transparent 54%), #fbf5ec;
}
html[data-theme] .account-screen .account-form,
html[data-theme] .app .workspace .composer {
  color: var(--lens-ink);
  border-radius: 24px;
  background: var(--solid-surface);
  border: 1px solid var(--lens-edge);
  box-shadow: inset 0 1px 0 var(--lens-reflection), inset 1px 0 8px var(--lens-light),
    0 16px 46px -13px var(--lens-shadow);
}
html[data-theme] .app .sidebar nav > .nav-row,
html[data-theme] .app .materials-toggle,
html[data-theme] .app .composer .attach-btn {
  border-radius: 15px;
  min-height: 44px;
  background: var(--solid-surface);
  color: var(--lens-ink);
  border: 1px solid var(--lens-edge);
  box-shadow: inset 0 1px var(--lens-reflection), 0 3px 12px var(--lens-shadow);
}
@supports ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))) {
  html[data-theme] .account-screen .account-form,
  html[data-theme] .app .workspace .composer,
  html[data-theme] .app .sidebar nav > .nav-row,
  html[data-theme] .app .materials-toggle,
  html[data-theme] .app .composer .attach-btn {
    background: linear-gradient(142deg, var(--lens-light), transparent 37%), var(--lens-fill);
    -webkit-backdrop-filter: blur(5px) saturate(128%);
    backdrop-filter: blur(5px) saturate(128%);
  }
}
html[data-theme="dark"] .app .sidebar nav .new-chat,
html[data-theme="dark"] .app .composer .send:not(:disabled),
html[data-theme="dark"] .account-form .login-submit {
  color: #2b211b;
  background: linear-gradient(125deg, #f7dcb7, #eac398 50%, #cea880);
  border-color: #f1d4b14a;
}
html[data-theme="warm"] .app .sidebar nav .new-chat,
html[data-theme="warm"] .app .composer .send:not(:disabled),
html[data-theme="warm"] .account-form .login-submit {
  color: #fff;
  background: linear-gradient(125deg, #955335, #813e29);
  border-color: #8d482d;
}
html[data-theme] .app .composer:focus-within { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
html[data-theme] :is(button, a, input, select):focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
html[data-theme] .has-messages .message-content { line-height: 1.8; overflow-wrap: anywhere; }
html[data-theme] .has-messages .message-content pre { overflow-x: auto; overflow-wrap: normal; }
html[data-theme] .app .sidebar nav > .nav-row:active,
html[data-theme] .app .composer .send:active:not(:disabled) { filter: brightness(.94); }
@media (max-width: 760px) {
  html[data-theme] .account-screen .account-form { border-radius: 22px; padding: clamp(20px, 6vw, 30px); }
  html[data-theme] .app .workspace .composer { border-radius: 20px; }
}
@media (prefers-reduced-transparency: reduce) {
  html[data-theme] .account-screen .account-form,
  html[data-theme] .app .workspace .composer,
  html[data-theme] .app .sidebar nav > .nav-row:not(.new-chat),
  html[data-theme] .app .materials-toggle,
  html[data-theme] .app .composer .attach-btn {
    background: var(--solid-surface) !important; backdrop-filter: none; -webkit-backdrop-filter: none;
  }
}
html[data-theme="dark"] .account-form .info-note {
  color: #ebdfcd;
  background: #2b303d;
  border-color: #645c55;
}
html[data-theme="warm"] .account-form .info-note {
  color: #624c3c;
  background: #f5eee3;
  border-color: #dccbbb;
}
@media (max-width: 760px) {
  html[data-theme] .app .workspace:not(.has-messages) .welcome { width: 100%; align-self: stretch; }
  html[data-theme] .app .workspace:not(.has-messages) .mascot-hello {
    inset: 0 0 auto auto; width: min(92%, 380px); aspect-ratio: 3 / 2;
  }
}