/* 2026-08-13 · Codex · 公开社区、模型库与对话预览统一浅色磨砂和分层卡片。 · CHG-20260813-SITE-SURFACE-V3-BATCH6-PUBLIC-WORKSPACES */

body.site-surface--public-workspace {
  min-height: 100%;
  color: var(--site-ink);
  background:
    radial-gradient(circle at 10% 4%, rgba(111, 82, 255, .15), transparent 29rem),
    radial-gradient(circle at 92% 8%, rgba(216, 70, 160, .10), transparent 27rem),
    linear-gradient(180deg, #faf9fc 0%, #f2f0f6 100%) !important;
}

body.site-surface--public-workspace :is(.public-main, .pb-wrap, .chat-shell) {
  position: relative;
  z-index: 1;
}

body.site-surface--public-workspace :is(
  .public-main .pb-view,
  .pbc2-hero-main,
  .pbc2-hero-side,
  .pbc2-card,
  .pb-model-card,
  .chat-side,
  .chat-main,
  .chat-model,
  .chat-input-box
) {
  background-color: var(--site-panel) !important;
  border-color: var(--site-line) !important;
  box-shadow: var(--site-shadow) !important;
  -webkit-backdrop-filter: saturate(145%) blur(18px);
  backdrop-filter: saturate(145%) blur(18px);
}

body.site-surface--public-workspace .public-main .pb-view {
  padding: 18px;
  border-radius: 24px;
}

body.site-surface--public-workspace .pbc2-hero-main {
  background:
    radial-gradient(circle at 18% 16%, rgba(111, 82, 255, .15), transparent 18rem),
    radial-gradient(circle at 88% 80%, rgba(216, 70, 160, .10), transparent 17rem),
    rgba(255, 255, 255, .76) !important;
}

body.site-surface--public-workspace .pbc2-hero-side,
body.site-surface--public-workspace .pbc2-stat {
  background: rgba(255, 255, 255, .68) !important;
}

body.site-surface--public-workspace .pbc2-tools {
  background: rgba(247, 246, 250, .88) !important;
  -webkit-backdrop-filter: saturate(145%) blur(18px);
  backdrop-filter: saturate(145%) blur(18px);
}

body.site-surface--public-workspace :is(.pbc2-search, .pbc2-chip, .pbc2-more, .pbc2-action) {
  color: var(--site-ink) !important;
  background: rgba(255, 255, 255, .84) !important;
  border-color: var(--site-line) !important;
}

body.site-surface--public-workspace :is(.pbc2-chip.active, .pbc2-action.primary) {
  color: #fff !important;
  background: var(--site-gradient) !important;
  border-color: transparent !important;
  box-shadow: 0 9px 24px rgba(111, 82, 255, .22);
}

body.site-surface--public-workspace .pbc2-card:hover,
body.site-surface--public-workspace .pb-model-card:hover,
body.site-surface--public-workspace .chat-model:hover {
  border-color: rgba(111, 82, 255, .25) !important;
  box-shadow: var(--site-shadow-hover) !important;
}

body.site-surface--public-workspace .pbc2-overlay {
  background: rgba(54, 42, 78, .28) !important;
}

body.site-surface--public-workspace .pbc2-drawer {
  color: var(--site-ink) !important;
  background: rgba(250, 249, 252, .98) !important;
  box-shadow: -18px 0 52px rgba(43, 35, 68, .16) !important;
}

body.site-surface--public-workspace .pbc2-detail-media {
  background: #f1eef7 !important;
}

body.site-surface--public-workspace .pb-model-card {
  overflow: hidden;
}

body.site-surface--public-workspace .pb-filter-pill.active,
body.site-surface--public-workspace .chat-new,
body.site-surface--public-workspace .chat-send {
  color: #fff !important;
  background: var(--site-gradient) !important;
  border-color: transparent !important;
  box-shadow: 0 10px 26px rgba(111, 82, 255, .23) !important;
}

body.site-surface--public-workspace .pb-moat {
  color: #6547f5 !important;
  background: rgba(111, 82, 255, .09) !important;
  border-color: rgba(111, 82, 255, .16) !important;
}

body.site-surface--public-workspace .chat-shell {
  gap: 20px;
  padding-top: 22px;
}

body.site-surface--public-workspace .chat-side,
body.site-surface--public-workspace .chat-main {
  border-radius: 20px;
}

body.site-surface--public-workspace .chat-side {
  overflow-x: hidden;
}

body.site-surface--public-workspace .chat-input-box:focus-within {
  border-color: rgba(111, 82, 255, .38) !important;
  box-shadow: 0 0 0 4px rgba(111, 82, 255, .09) !important;
}

@media (max-width: 768px) {
  body.site-surface--public-workspace {
    background:
      radial-gradient(circle at 12% 3%, rgba(111, 82, 255, .11), transparent 20rem),
      linear-gradient(180deg, #faf9fc 0%, #f2f0f6 100%) !important;
  }

  body.site-surface--public-workspace .public-main .pb-view {
    padding: 12px;
    border-radius: 18px;
  }

  body.site-surface--public-workspace :is(
    .public-main .pb-view,
    .pbc2-hero-main,
    .pbc2-hero-side,
    .pbc2-card,
    .pb-model-card,
    .chat-side,
    .chat-main,
    .chat-model,
    .chat-input-box
  ) {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.site-surface--public-workspace :is(.pbc2-card, .pb-model-card, .chat-model) {
    transition: none !important;
  }
}
