*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --surface:    #EDE8FF;
  --surface2:   #DDD5FF;
  --border:     rgba(139, 92, 246, 0.13);
  --border2:    rgba(139, 92, 246, 0.25);
  --text:       #1C1C1E;
  --text-2:     #555555;
  --text-3:     #999999;
  --accent:     #8B5CF6;
  --accent-h:   #7C3AED;
  --user-bg:    #F2F2F2;
  --font:       'Nunito', 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei UI', sans-serif;
  --font-serif: 'Lora', Georgia, serif;
  --mono:       ui-monospace, "Cascadia Code", "Fira Code", "Menlo", monospace;
  --sidebar-w:  260px;
  --legal-w:    0px;
  --redact-w:   0px;
  --content-w:  min(860px, calc(100vw - var(--sidebar-w) - var(--legal-w) - var(--redact-w) - 48px));
}

body.sidebar-collapsed { --sidebar-w: 0px; }

html { height: 100%; }
body {
  height: 100%;
  overflow: hidden;
  /* colors only at corners, center stays white */
  background:
    radial-gradient(ellipse 35% 35% at 0% 0%, rgba(196,181,253,0.32) 0%, transparent 100%),
    radial-gradient(ellipse 35% 35% at 100% 100%, rgba(191,219,254,0.28) 0%, transparent 100%),
    #FFFFFF;
  background-attachment: fixed;
  color: var(--text);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  display: flex;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); border-radius: 4px; }

/* ══════════════════════════════════════════════════════════════
   私密模式「夜曲」皮肤 —— 挂在 body.private-active 上。
   多数组件走 CSS 变量，覆盖变量即自动跟随；写死白底的表面单独覆盖。
   ══════════════════════════════════════════════════════════════ */
body.private-active {
  --surface:   #1E1B2A;
  --surface2:  #14121C;
  --border:    rgba(167,139,250,0.16);
  --border2:   rgba(167,139,250,0.30);
  --text:      #ECE9F5;
  --text-2:    #A7A2B8;
  --text-3:    #6E6980;
  --accent:    #A78BFA;
  --accent-h:  #C4B5FD;
  --user-bg:   #26223A;
  --priv-glow: rgba(167,139,250,0.22);
  color: var(--text);
  background:
    radial-gradient(ellipse 42% 42% at 0% 0%, rgba(139,92,246,0.22) 0%, transparent 100%),
    radial-gradient(ellipse 46% 46% at 100% 100%, rgba(124,58,237,0.16) 0%, transparent 100%),
    #0F0E16;
  background-attachment: fixed;
}

/* 关灯淡入：仅在允许动效时给背景/文字过渡 */
@media (prefers-reduced-motion: no-preference) {
  body { transition: background-color 0.4s ease, color 0.4s ease; }
}

/* 私密态滚动条调深 */
body.private-active ::-webkit-scrollbar-thumb { background: rgba(167,139,250,0.28); }

/* 输入框：暗紫玻璃 */
body.private-active .input-box {
  background: rgba(30,27,42,0.82);
  border-color: rgba(167,139,250,0.22);
  box-shadow: 0 2px 16px rgba(0,0,0,0.35);
}
body.private-active .input-box:focus-within {
  border-color: rgba(167,139,250,0.42);
  box-shadow: 0 2px 20px rgba(0,0,0,0.40), 0 0 0 3px var(--priv-glow);
}

/* 写死白底的浮层/下拉/菜单/搜索框 */
body.private-active #model-dropdown,
body.private-active #tools-menu,
body.private-active .search-modal {
  background: #1E1B2A;
  border-color: rgba(167,139,250,0.20);
  box-shadow: 0 12px 34px rgba(0,0,0,0.5);
}
body.private-active .model-option:hover,
body.private-active .tools-menu-item:hover,
body.private-active #overlay-results .conv-item:hover { background: rgba(167,139,250,0.12); }
body.private-active .search-modal-head { border-bottom-color: rgba(167,139,250,0.16); }

/* 项目/分组弹窗：深色表面，控件跟随夜曲变量 */
body.private-active .project-modal {
  background: #1E1B2A;
  border-color: rgba(167,139,250,0.16);
  box-shadow: 0 32px 80px -16px rgba(0,0,0,0.65), 0 4px 18px rgba(0,0,0,0.40);
}
body.private-active .project-modal-icon {
  background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08);
  color: var(--text-2); box-shadow: none;
}
body.private-active .project-modal-close:hover { background: rgba(255,255,255,0.08); }
body.private-active #project-name-input,
body.private-active #group-name-input {
  background: #16141F; border-color: rgba(255,255,255,0.12); color: var(--text);
}
body.private-active #project-name-input:hover,
body.private-active #group-name-input:hover { border-color: rgba(255,255,255,0.22); }
body.private-active #project-name-input:focus,
body.private-active #group-name-input:focus {
  background: #16141F; border-color: rgba(255,255,255,0.35);
  box-shadow: 0 0 0 3.5px rgba(255,255,255,0.10);
}
body.private-active .project-modal-hint {
  background: rgba(255,255,255,0.045); border-color: rgba(255,255,255,0.07);
  color: var(--text-2);
}
body.private-active .project-modal-hint svg { color: var(--text-3); }
body.private-active .project-modal-cancel {
  background: transparent; border-color: rgba(255,255,255,0.16); color: var(--text-2);
}
body.private-active .project-modal-cancel:hover {
  background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.24);
}
body.private-active .project-modal-create:disabled {
  background: rgba(255,255,255,0.08); color: var(--text-3);
}
body.private-active .group-color-swatch { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.14); }

/* 会话列表 hover / active：黑翳 → 紫翳 */
body.private-active .conv-item:hover  { background: rgba(167,139,250,0.10); }
body.private-active .conv-item.active { background: rgba(167,139,250,0.16); }

/* 顶栏图标按钮 hover */
body.private-active #private-btn:hover,
body.private-active #ann-btn:hover,
body.private-active #share-btn:hover,
body.private-active #tools-btn:hover,
body.private-active #tools-btn.open,
body.private-active #model-picker-btn:hover,
body.private-active #sidebar-close-btn:hover { background: rgba(167,139,250,0.12); color: var(--accent); }

/* 用户气泡边框转紫（底走 --user-bg 变量已自动跟随） */
body.private-active .user-bubble { border-color: rgba(167,139,250,0.22); }

/* 锁按钮开启态：发光紫（签名细节） */
body.private-active #private-btn.active {
  background: rgba(167,139,250,0.16);
  color: #C4B5FD;
  box-shadow: 0 0 0 1px rgba(167,139,250,0.35), 0 0 14px rgba(167,139,250,0.35);
}

