/* ============================================================
   AgentForge · 暗色极简风格（参考：近黑双层 / 居中 Hero /
   胶囊快捷入口 / 大圆角输入框内嵌模型选择器与停止键）
   ============================================================ */
:root {
  --bg:        #161616;   /* 主区背景 */
  --sidebar:   #111111;   /* 侧边栏（更深一层） */
  --panel:     #1d1d1d;   /* 卡片 / 面板 */
  --panel-2:   #232323;   /* hover / 选中 */
  --border:    #2c2f3a;   /* 低对比、略带蓝灰的柔和描边 */
  --border-2:  #3b4050;
  --text:      #ececec;
  --text-2:    #b4b4b4;
  --muted:     #767676;
  --accent:    #6e8bff;   /* 克制的蓝紫强调色 */
  --accent-2:  #22c55e;
  --danger:    #ef5350;

  /* 统一圆角尺度：任何可见的「框」都必须落在这一组里，禁止 0 / 5px 尖角 */
  --r-xs:   8px;    /* 徽章、小标签、图标块 */
  --r-sm:   12px;   /* 按钮、输入框、列表行 */
  --r-md:   14px;   /* 卡片、面板、表格 */
  --r-lg:   18px;   /* 气泡、大卡片、弹窗 */
  --r-xl:   22px;   /* 输入框容器、Hero 图标 */
  --r-pill: 999px;  /* 胶囊 */
  --radius:    18px;
  --radius-sm: 12px;

  --shadow:      0 20px 54px rgba(0,0,0,.42), 0 2px 8px rgba(0,0,0,.16);
  --shadow-soft: inset 0 1px 0 rgba(255,255,255,.035), 0 6px 20px rgba(0,0,0,.16);
  --ring:        0 0 0 3px rgba(110,139,255,.20);
  --glow:        rgba(110,139,255,.055);
  --ease:        cubic-bezier(.22,.61,.36,1);
  font-synthesis: none;
}

/* 白色线性图标：stroke=currentColor，暗色背景下即纯白 */
.ico { width: 18px; height: 18px; flex: none; display: inline-block; vertical-align: middle; }
.ico-lg { width: 20px; height: 20px; }
.ico-xl { width: 32px; height: 32px; }
.ico-sm { width: 16px; height: 16px; }
.ico-xs { width: 14px; height: 14px; }
.ico-send { width: 18px; height: 18px; color: #0d0f1a; }
.tool-card .ico { margin-right: 6px; vertical-align: -3px; }
.msg.error .ico { margin-right: 6px; vertical-align: -3px; color: #fff; }
.lock { display: inline-flex; align-items: center; }
#mpSettingsLink .ico { color: var(--text); }

* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px; line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}
button { font-family: inherit; cursor: pointer; }
::selection { background: rgba(110,139,255,.3); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #333; border-radius: 10px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: #3f3f3f; }

/* ---------- 整体布局 ---------- */
.app { display: flex; height: 100vh; }

/* ---------- 侧边栏 ---------- */
.sidebar {
  width: 268px; flex-shrink: 0;
  background: var(--sidebar);
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  padding: 16px 12px; gap: 10px;
}
.side-head { display: flex; align-items: center; gap: 10px; padding: 4px 6px 6px; }
.logo {
  width: 34px; height: 34px; flex-shrink: 0;
  display: grid; place-items: center; overflow: hidden;
  font-size: 18px; border-radius: 10px;
  background: linear-gradient(135deg, #2a2f45, #1a1d2b);
  border: 1px solid var(--border-2);
}
/* 品牌素材图：侧栏与首页 Hero 共用，填满圆角容器 */
.logo img, .hero-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.brand-name { font-size: 16px; font-weight: 700; letter-spacing: .3px; }
.brand-name span { color: var(--accent); }
.brand-tag { font-size: 11px; color: var(--muted); margin-top: 1px; }

.new-btn {
  width: 100%; padding: 11px 14px;
  background: var(--accent); color: #0d0f1a;
  border: none; border-radius: var(--radius-sm);
  font-size: 14px; font-weight: 600;
  transition: filter .15s, transform .05s;
}
.new-btn:hover { filter: brightness(1.08); }
.new-btn:active { transform: scale(.985); }

/* 导航 */
.nav { display: flex; flex-direction: column; gap: 2px; margin-top: 2px; }
.nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border: none; background: transparent;
  color: var(--text-2); font-size: 13.5px; border-radius: var(--radius-sm);
  text-align: left; transition: background .15s, color .15s;
}
.nav-item:hover { background: var(--panel); color: var(--text); }
.nav-item.active { background: var(--panel-2); color: var(--text); }

/* 面板（会话 / 文件） */
.panel { flex: 1; min-height: 0; display: flex; flex-direction: column; margin-top: 4px; }
.panel.hidden { display: none; }
.panel-label {
  font-size: 11px; color: var(--muted); letter-spacing: .6px;
  padding: 8px 12px 6px; text-transform: uppercase;
}
.session-list { list-style: none; margin: 0; padding: 0 4px; overflow-y: auto; flex: 1; }
.session-item {
  position: relative;
  padding: 9px 12px; border-radius: var(--radius-sm);
  margin-bottom: 2px; cursor: pointer;
  transition: background .12s;
}
.session-item:hover { background: var(--panel); }
.session-item.active { background: var(--panel-2); }
.s-title { display: block; font-size: 13px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 18px; }
.s-meta { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.session-item .del {
  position: absolute; top: 8px; right: 8px;
  width: 18px; height: 18px; line-height: 16px; text-align: center;
  border: none; background: transparent; color: var(--muted);
  border-radius: 6px; font-size: 11px; opacity: 0;
  transition: opacity .12s, background .12s, color .12s;
}
.session-item:hover .del { opacity: 1; }
.session-item .del:hover { background: rgba(239,83,80,.18); color: var(--danger); }

/* 文件树 */
.file-tree { overflow-y: auto; flex: 1; padding: 0 4px; }
.tree-item {
  padding: 7px 10px; border-radius: 8px; cursor: pointer;
  font-size: 13px; color: var(--text-2); white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.tree-item:hover { background: var(--panel); color: var(--text); }
.tree-item.up { color: var(--muted); }

/* 专家选择器 */
.expert-wrap { margin-top: 4px; }
.expert-sel {
  width: 100%; padding: 10px 12px;
  background: var(--panel); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  font-size: 13.5px; appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ececec' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat: no-repeat; background-position: right 12px center;
}
.expert-sel:focus { outline: none; border-color: var(--accent); }

.side-foot { padding: 10px 8px 2px; border-top: 1px solid var(--border); margin-top: 6px; }
.ver { font-size: 11px; color: var(--muted); }

/* ---------- 主区 ---------- */
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--bg); }
.chat-head {
  display: flex; align-items: center; justify-content: space-between;
  height: 52px; padding: 0 22px; flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}
.ch-title { font-size: 14px; font-weight: 600; color: var(--text); max-width: 60%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-model { font-size: 12px; color: var(--muted); }

.chat { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.messages { flex: 1; overflow-y: auto; padding: 24px; }

/* ---------- 居中 Hero 空状态 ---------- */
.welcome {
  min-height: 100%; display: flex; align-items: center; justify-content: center;
}
.welcome-inner { max-width: 640px; text-align: center; position: relative; }
.hero-logo {
  width: 60px; height: 60px; margin: 0 auto 18px;
  display: grid; place-items: center; overflow: hidden; font-size: 28px; border-radius: 18px;
  background: linear-gradient(135deg, #2a2f45, #161a2b);
  border: 1px solid var(--border-2);
  box-shadow: 0 0 50px rgba(110,139,255,.22);
}
.welcome h1 {
  font-size: 34px; font-weight: 700; line-height: 1.25; margin: 0 0 12px;
  letter-spacing: .2px;
}
.welcome-sub { color: var(--text-2); font-size: 13px; margin: 0 auto 26px; max-width: 520px; }
.quick-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.quick {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 999px;
  background: var(--panel); color: var(--text);
  border: 1px solid var(--border); font-size: 12.5px;
  transition: background .15s, border-color .15s, transform .05s;
}
.quick .ico-sm { width: 15px; height: 15px; }
.quick:hover { background: var(--panel-2); border-color: var(--border-2); }
.quick:active { transform: scale(.97); }

/* ---------- 消息气泡 ---------- */
.msg { display: flex; margin: 14px 0; }
.msg.user { justify-content: flex-end; }
.msg.assistant, .msg.tool, .msg.error { justify-content: flex-start; }
.bubble {
  max-width: 76%; padding: 12px 16px; border-radius: 16px;
  font-size: 14px; line-height: 1.6; word-break: break-word;
}
.msg.user .bubble {
  background: var(--accent); color: #0d0f1a; border-bottom-right-radius: 5px;
}
.msg.assistant .bubble, .msg.error .bubble {
  background: var(--panel); color: var(--text); border-bottom-left-radius: 5px;
}
.msg.error .bubble { color: #ffb4b4; border: 1px solid rgba(239,83,80,.35); }

/* Markdown 排版 */
.bubble.md h1, .bubble.md h2, .bubble.md h3 { margin: .4em 0 .3em; line-height: 1.3; }
.bubble.md h1 { font-size: 19px; } .bubble.md h2 { font-size: 17px; } .bubble.md h3 { font-size: 15px; }
.bubble.md p { margin: .5em 0; }
.bubble.md ul { margin: .5em 0; padding-left: 20px; }
.bubble.md li { margin: .2em 0; }
.bubble.md blockquote {
  margin: .6em 0; padding: 6px 14px; border-left: 0;
  color: var(--text-2); background: rgba(110,139,255,.06); border-radius: var(--r-sm);
}
.bubble.md code {
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 12.5px; background: #0e0e0e; padding: 2px 6px; border-radius: 6px;
  border: 1px solid var(--border);
}
.bubble.md pre.md-code {
  margin: .7em 0; padding: 12px 14px; background: #0e0e0e;
  border: 1px solid var(--border); border-radius: 10px; overflow-x: auto;
}
.bubble.md pre.md-code code { background: none; border: none; padding: 0; font-size: 12.5px; line-height: 1.5; }
.bubble.md a { color: var(--accent); }

/* 思考中 */
.thinking { display: flex; align-items: center; gap: 6px; color: var(--muted); padding: 6px 4px; font-size: 13px; }
.thinking .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--muted); animation: blink 1.2s infinite; }
.thinking .dot:nth-child(2) { animation-delay: .2s; }
.thinking .dot:nth-child(3) { animation-delay: .4s; }
@keyframes blink { 0%,60%,100% { opacity: .25; } 30% { opacity: 1; } }

/* 工具卡片 */
.tool-card {
  width: 78%; max-width: 640px; background: var(--panel);
  border: 1px solid var(--border); border-radius: 14px; overflow: hidden;
}
.tool-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; background: var(--panel-2); font-size: 13px;
}
.tool-head .nm { font-weight: 600; }
.tool-state { font-size: 12px; color: var(--text-2); display: flex; align-items: center; gap: 6px; }
.tool-state .done-ic { color: var(--text); }
.tool-args {
  padding: 8px 14px; font-family: monospace; font-size: 12px; color: var(--muted);
  border-top: 1px solid var(--border); white-space: pre-wrap; word-break: break-all;
}
.tool-result {
  padding: 10px 14px; font-family: monospace; font-size: 12px; color: var(--text-2);
  white-space: pre-wrap; word-break: break-word; max-height: 320px; overflow: auto;
  border-top: 1px solid var(--border);
}
.spin {
  width: 12px; height: 12px; border-radius: 50%;
  border: 2px solid var(--muted); border-top-color: transparent;
  display: inline-block; animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- 输入框（大圆角卡片） ---------- */
.composer { padding: 12px 22px 18px; flex-shrink: 0; }
.composer-inner {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: 22px; padding: 10px 14px 8px;
  transition: border-color .15s;
}
.composer-inner:focus-within { border-color: var(--border-2); }
#input {
  width: 100%; min-height: 26px; max-height: 200px; resize: none;
  background: transparent; border: none; outline: none;
  color: var(--text); font-size: 15px; line-height: 1.5; padding: 4px 2px;
}
#input::placeholder { color: var(--muted); }
.composer-bar { display: flex; align-items: center; justify-content: space-between; margin-top: 6px; }
.composer-left { display: flex; align-items: center; gap: 10px; }
.attach {
  width: 30px; height: 30px; border-radius: 9px; border: none;
  background: var(--panel-2); color: var(--text-2); font-size: 18px; line-height: 1;
  transition: background .15s, color .15s;
}
.attach:hover { background: #2e2e2e; color: var(--text); }
.hint { font-size: 11.5px; color: var(--muted); }
.composer-right { display: flex; align-items: center; gap: 8px; }

/* 发送 / 停止 */
.send {
  width: 36px; height: 36px; border-radius: 50%; border: none;
  background: var(--accent); color: #0d0f1a; font-size: 15px;
  display: grid; place-items: center; transition: filter .15s, transform .05s;
}
.send:hover { filter: brightness(1.1); }
.send:active { transform: scale(.92); }
.send:disabled { opacity: .4; cursor: not-allowed; }
.stop {
  height: 36px; padding: 0 16px; border-radius: 18px; border: 1px solid var(--border-2);
  background: var(--panel-2); color: var(--text); font-size: 13px; font-weight: 600;
}
.stop:hover { background: #2e2e2e; border-color: var(--danger); color: #ffb4b4; }
.hidden { display: none !important; }

.status { text-align: center; font-size: 12px; color: var(--muted); margin-top: 8px; min-height: 14px; }
.status .spin { vertical-align: -2px; margin-right: 4px; }

/* 图片预览 / 图片渲染 */
.img-prev { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 2px 8px; }
.img-prev .thumb { position: relative; width: 56px; height: 56px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border-2); }
.img-prev .thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.img-prev .thumb-x { position: absolute; top: 2px; right: 2px; width: 16px; height: 16px; line-height: 14px; text-align: center; border: none; border-radius: 50%; background: rgba(0,0,0,.6); color: #fff; font-size: 10px; cursor: pointer; }
.img-prev .thumb-x:hover { background: var(--danger); }
.user-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.user-imgs .user-img { max-width: 180px; max-height: 180px; border-radius: 10px; border: 1px solid var(--border-2); display: block; }
.tool-imgs { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px; }
.tool-imgs .tool-img { max-width: 280px; max-height: 280px; border-radius: 10px; border: 1px solid var(--border-2); background: #0e0e0e; display: block; }

/* ---------- 内嵌模型选择器 ---------- */
.model-picker { position: relative; }
.mp-btn {
  display: flex; align-items: center; gap: 7px;
  height: 36px; padding: 0 12px; border-radius: 18px;
  background: var(--panel-2); border: 1px solid var(--border);
  color: var(--text); font-size: 12.5px; transition: background .15s, border-color .15s;
}
.mp-btn:hover { background: #2e2e2e; border-color: var(--border-2); }
.mp-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex-shrink: 0; }
.mp-model { max-width: 130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mp-chev { color: var(--text-2); width: 12px; height: 12px; }

.mp-menu {
  position: absolute; right: 0; bottom: calc(100% + 10px);
  width: 420px; max-width: 86vw;
  background: var(--panel); border: 1px solid var(--border-2);
  border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; z-index: 40;
}
.mp-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px 16px; border-bottom: 1px solid var(--border); font-size: 13px; color: var(--text-2);
}
.mp-settings-link {
  display: inline-flex; align-items: center; gap: 5px;
  border: none; background: transparent; color: var(--accent);
  font-size: 12.5px; padding: 4px 6px; border-radius: 7px;
}
.mp-settings-link:hover { background: rgba(110,139,255,.12); }
.mp-body { display: flex; max-height: 340px; }
.mp-providers { width: 42%; border-right: 1px solid var(--border); overflow-y: auto; padding: 8px; }
.mp-models { width: 58%; overflow-y: auto; padding: 8px; }
.mp-prov {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 10px 11px; border: none; background: transparent; border-radius: 10px;
  color: var(--text); font-size: 13px; text-align: left; transition: background .12s;
}
.mp-prov:hover { background: var(--panel-2); }
.mp-prov.active { background: var(--panel-2); }
.mp-prov .ic {
  width: 26px; height: 26px; flex-shrink: 0; border-radius: 8px;
  display: grid; place-items: center; font-size: 11px; font-weight: 700;
  color: var(--text); background: transparent; border: 1px solid var(--border-2);
}
.mp-prov .nm { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.demo-badge {
  font-size: 10px; padding: 2px 6px; border-radius: 6px;
  background: rgba(34,197,94,.16); color: #4ade80; border: 1px solid rgba(34,197,94,.3);
}
.lock { font-size: 11px; }
.mp-model-card {
  display: block; width: 100%; text-align: left; padding: 11px 12px;
  border: 1px solid transparent; background: transparent; border-radius: 10px;
  color: var(--text); transition: background .12s, border-color .12s;
}
.mp-model-card:hover { background: var(--panel-2); }
.mp-model-card.active { background: var(--panel-2); border-color: var(--border-2); }
.mc-name { font-size: 13px; display: flex; align-items: center; gap: 6px; }
.mc-check { color: var(--text); }
.mc-desc { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.mp-models-hint { color: var(--muted); font-size: 12.5px; padding: 10px; }

/* ---------- 弹窗 ---------- */
.modal {
  position: fixed; inset: 0; background: rgba(0,0,0,.6);
  display: flex; align-items: center; justify-content: center; z-index: 100;
  backdrop-filter: blur(3px);
}
.modal.hidden { display: none; }
.modal-box {
  width: 460px; max-width: 92vw; max-height: 86vh; overflow-y: auto;
  background: var(--panel); border: 1px solid var(--border-2);
  border-radius: 18px; padding: 22px; box-shadow: var(--shadow);
}
.modal-box.wide { width: 720px; }
.modal-box h3 { margin: 0 0 14px; font-size: 17px; }
.prov { background: var(--sidebar); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; margin-bottom: 12px; }
.prov-row { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.prov-row:last-child { margin-bottom: 0; }
.prov-row label { width: 88px; flex-shrink: 0; color: var(--text-2); font-size: 12.5px; }
.prov-row input {
  flex: 1; padding: 8px 10px; background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: 9px; font-size: 13px; font-family: inherit;
}
.prov-row input:focus { outline: none; border-color: var(--accent); }
.modal-actions { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.modal-actions .spacer { flex: 1; }
.ghost {
  padding: 8px 14px; border-radius: 10px; border: 1px solid var(--border-2);
  background: transparent; color: var(--text-2); font-size: 13px; transition: background .12s, color .12s;
}
.ghost:hover { background: var(--panel-2); color: var(--text); }
.send.solid { width: auto; height: auto; border-radius: 10px; background: var(--accent); color: #0d0f1a; border: none; font-weight: 600; padding: 9px 18px; }
.send.solid:hover { filter: brightness(1.1); }
.modal-tip { color: var(--muted); font-size: 12px; margin: 12px 0 0; line-height: 1.5; }
.file-content {
  background: var(--bg); border: 1px solid var(--border); border-radius: 12px;
  padding: 14px; font-family: monospace; font-size: 12.5px; line-height: 1.55;
  white-space: pre-wrap; word-break: break-word; max-height: 60vh; overflow: auto; color: var(--text-2);
}

/* ---------- 响应式 ----------
   ≤720px 的完整移动端规则统一放在文件末尾，确保覆盖后续各段样式 */

/* ============ 登录层 / 管家立绘 ============ */
#loginScreen {
  position: fixed; inset: 0; z-index: 55;
  background:
    radial-gradient(1.5px 1.5px at 18% 28%, #ffffff88, transparent),
    radial-gradient(1.5px 1.5px at 72% 20%, #cfe3ff88, transparent),
    radial-gradient(2px 2px at 86% 64%, #ffffff66, transparent),
    radial-gradient(1.5px 1.5px at 38% 82%, #ffffff77, transparent),
    radial-gradient(2px 2px at 10% 68%, #bcd4ff66, transparent),
    radial-gradient(1.5px 1.5px at 58% 48%, #ffffff55, transparent),
    radial-gradient(1.8px 1.8px at 90% 36%, #ffffff5c, transparent),
    linear-gradient(160deg, #0a0e1a 0%, #0d1426 45%, #0a1020 100%);
  background-attachment: fixed;
  transition: opacity 1.7s ease;
}
body.logged-in #loginScreen { display: none; }
/* 入场过渡：登录层（品牌 / 气泡 / 卡片）随立绘一同缓慢淡出 */
body.entering #loginScreen { opacity: 0; }
.login-brand {
  position: absolute; top: 34px; left: 7%;
  display: flex; align-items: center; gap: 12px;
  font-size: 21px; letter-spacing: .42em; font-weight: 700; color: #aab8e8;
  text-shadow: 0 0 18px #3a5cff66; padding-left: .42em;
  z-index: 3;
}
.brand-logo {
  width: 30px; height: 30px; flex-shrink: 0;
  border-radius: 8px; display: block;
  box-shadow: 0 0 18px #3a5cff55;
}
/* 漫画气泡（左侧，尾巴指向右下方的管家立绘） */
.comic-bubble {
  position: absolute; z-index: 65; left: 7%; top: 22%; max-width: 380px; text-align: left;
  background: #f6f8ff; color: #1b2238; border-radius: 22px; padding: 18px 24px;
  font-size: 16px; line-height: 1.75; box-shadow: 0 10px 40px #00000066;
  min-height: 1.75em;
}
.comic-bubble b { color: #2b59ff; }
.comic-bubble::after {
  content: ''; position: absolute; right: 28px; bottom: -15px;
  border: 10px solid transparent; border-top-color: #f6f8ff;
}
/* 说话中：轻微呼吸，提示“正在说话” */
.comic-bubble.speaking { animation: bubbleTalk 1.6s ease-in-out infinite; }
@keyframes bubbleTalk { 0%,100% { transform: scale(1); } 50% { transform: scale(1.015); } }
.comic-bubble .caret {
  display: inline-block; width: 2px; height: 1.05em; margin-left: 3px;
  background: #2b59ff; vertical-align: -2px; animation: caretBlink .8s step-end infinite;
}
@keyframes caretBlink { 50% { opacity: 0; } }
/* 令牌表单（左侧下方） */
.login-form {
  position: absolute; left: 7%; bottom: 12%; z-index: 65;
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
  width: 320px; max-width: 84vw;
  transition: opacity .5s ease, transform .5s ease;
}
.login-form.fade-out { opacity: 0; transform: translateY(12px); pointer-events: none; }
.lf-row {
  display: flex; align-items: center; gap: 10px; width: 320px; max-width: 84vw;
  background: #11182b; border: 1px solid #2a3556; border-radius: 14px; padding: 4px 14px;
  transition: border-color .15s, box-shadow .15s;
}
.lf-row:focus-within { border-color: #3a5cff; box-shadow: 0 0 0 3px #3a5cff33; }
.lf-lock { color: #8aa0d8; flex-shrink: 0; }
#tokenInput {
  flex: 1; background: transparent; border: none; outline: none; color: #eef2ff;
  font-size: 15px; padding: 13px 0; font-family: inherit; letter-spacing: .04em; min-width: 0;
}
#tokenInput::placeholder { color: #6b78a0; }
.lf-enter {
  width: 320px; max-width: 84vw; padding: 13px 0; border: none; border-radius: 14px;
  background: linear-gradient(135deg, #3a5cff, #6a3aff); color: #fff; font-size: 16px;
  font-weight: 700; letter-spacing: .3em; cursor: pointer; padding-left: .3em;
  box-shadow: 0 8px 26px #3a5cff44; transition: filter .15s, transform .08s;
}
.lf-enter:hover { filter: brightness(1.1); }
.lf-enter:active { transform: translateY(1px); }
.lf-enter:disabled { opacity: .6; cursor: wait; }
.login-err { color: #ff8a8a; font-size: 13px; min-height: 16px; }
/* 管家立绘：右侧竖长，纯黑背景经 screen 混合融入星空 */
#butler {
  position: fixed; right: 1%; bottom: 0; height: 96vh; z-index: 60; pointer-events: none;
  display: flex; align-items: flex-end; justify-content: flex-end;
  transition: opacity 1.7s ease, transform 1.7s ease;
}
#butler .butler-img {
  height: 100%; width: auto; display: block;
  mix-blend-mode: screen;   /* 纯黑背景变透明，人物融入星空 */
  opacity: .97;
}
/* 入场过渡：立绘随登录层一同缓慢上浮淡出 */
body.entering #butler { opacity: 0; transform: translateY(-44px); }
body.logged-in #butler { display: none; }
/* 正式工作台淡入 */
.app { opacity: 0; transition: opacity .9s ease; }
body.logged-in .app { opacity: 1; }
/* 窄屏：立绘居中偏上、气泡与表单竖向堆叠 */
@media (max-width: 860px) {
  #butler { right: 50%; transform: translateX(50%); height: 58vh; bottom: 0; }
  body.entering #butler { transform: translateX(50%) translateY(-44px); }
  .comic-bubble { left: 50%; top: 6%; transform: translateX(-50%); max-width: 92vw; text-align: center; }
  .comic-bubble::after { left: 50%; right: auto; transform: translateX(-50%); }
  .login-form { left: 50%; bottom: 6%; transform: translateX(-50%); align-items: center; }
}

/* ---------- 人类介入确认弹窗 ---------- */
.confirm-title { font-weight: 600; margin: 8px 0 10px; word-break: break-all; color: #ffd479; }
.confirm-preview { max-height: 300px; overflow: auto; }
.cf-row { display: flex; align-items: center; gap: 8px; margin: 6px 0; flex-wrap: wrap; }
.cf-tag { padding: 2px 9px; border-radius: 6px; font-size: 12px; font-weight: 600; }
.cf-tag.new { background: #1f6feb33; color: #6ea8ff; }
.cf-tag.overwrite, .cf-tag.cmd { background: #b9431f33; color: #ff9d6e; }
.cf-tag.edit { background: #9b59b633; color: #c79bff; }
.cf-meta { color: #8b93a7; font-size: 12px; }
.cf-code { background: #0c1020; border: 1px solid #1e2740; border-radius: 8px; padding: 10px; max-height: 220px; overflow: auto; white-space: pre-wrap; word-break: break-all; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: #cdd6f4; }
.cf-diff { display: flex; flex-direction: column; gap: 2px; margin-top: 6px; font-family: ui-monospace, monospace; font-size: 12.5px; }
.cf-del { color: #ff7b72; } .cf-add { color: #7ee787; }
.cf-warn { color: #ff9d6e; }
.confirm-edit { width: 100%; min-height: 92px; margin-top: 10px; background: #0c1020; color: #cdd6f4; border: 1px solid #1e2740; border-radius:8px; padding: 10px; font-family: ui-monospace, monospace; font-size: 12.5px; resize: vertical; }
.ghost.danger { color: #ff7b72; border-color: #ff7b7255; }

/* ---------- P2：会话头部操作 ---------- */
.ch-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.ch-btn {
  background: transparent; color: var(--muted); border: 1px solid var(--border);
  border-radius: 8px; padding: 5px 11px; font-size: 12.5px; cursor: pointer;
  font-family: inherit; transition: color .15s, border-color .15s, background .15s;
}
.ch-btn:hover { color: var(--text); border-color: var(--border-2); background: var(--sidebar); }
.notif-wrap { position: relative; }
.notif-btn { position: relative; display: inline-flex; align-items: center; }
.notif-badge {
  position: absolute; top: -7px; right: -7px; min-width: 17px; height: 17px; padding: 0 4px;
  border-radius: 9px; background: var(--danger, #ef4444); color: #fff; font-size: 11px; font-weight: 700;
  line-height: 17px; text-align: center; box-shadow: 0 0 0 2px var(--panel);
}
.notif-panel {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; width: 340px; max-width: 86vw;
  background: var(--panel); border: 1px solid var(--border-2); border-radius: 12px;
  box-shadow: var(--shadow); overflow: hidden;
}
.notif-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.notif-head b { font-size: 14px; }
.notif-readall { background: none; border: none; color: var(--accent, #4d6bfe); cursor: pointer; font-size: 12px; font-family: inherit; }
.notif-list { max-height: 380px; overflow-y: auto; }
.notif-item { padding: 11px 14px; border-bottom: 1px solid var(--border); cursor: pointer; }
.notif-item:last-child { border-bottom: none; }
.notif-item.unread { background: color-mix(in srgb, var(--accent, #4d6bfe) 8%, transparent); }
.notif-item .nt { font-size: 13px; font-weight: 600; margin-bottom: 3px; }
.notif-item .nb { font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.notif-item .ntime { font-size: 11px; color: var(--muted); margin-top: 4px; }
.notif-empty { padding: 28px 14px; text-align: center; color: var(--muted); font-size: 13px; }
.export-wrap { position: relative; }
.export-menu {
  position: absolute; right: 0; top: calc(100% + 7px); z-index: 40;
  min-width: 160px; padding: 5px; background: var(--panel);
  border: 1px solid var(--border-2); border-radius: 10px; box-shadow: var(--shadow);
}
.export-menu.hidden { display: none; }
.export-menu button {
  display: block; width: 100%; text-align: left; background: none; border: 0;
  color: var(--text); padding: 9px 11px; border-radius: 7px; font-size: 13px;
  cursor: pointer; font-family: inherit;
}
.export-menu button:hover { background: var(--sidebar); }
.usage-body { font-size: 13px; color: var(--text-2); line-height: 1.9; }
.usage-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 4px 0 12px; }
.usage-cell { background: var(--sidebar); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.usage-cell b { display: block; font-size: 19px; color: var(--text); font-weight: 600; margin-top: 2px; }
.usage-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.usage-table th, .usage-table td { text-align: left; padding: 6px 4px; border-bottom: 1px solid var(--border); }
.usage-table th { color: var(--muted); font-weight: 500; }

/* ---------- P2：消息操作按钮 ---------- */
.msg { position: relative; }
.msg-actions { display: flex; gap: 5px; margin-top: 5px; opacity: 0; transition: opacity .15s; }
.msg:hover .msg-actions, .msg:focus-within .msg-actions { opacity: 1; }
.msg.user .msg-actions { justify-content: flex-end; }
.mact {
  background: transparent; color: var(--muted); border: 1px solid var(--border);
  border-radius: 6px; padding: 3px 9px; font-size: 11.5px; cursor: pointer;
  font-family: inherit; line-height: 1.5;
}
.mact:hover:not(:disabled) { color: var(--text); border-color: var(--border-2); }
.mact:disabled { opacity: .3; cursor: not-allowed; }
.mact.primary { color: #6ea8ff; border-color: #1f6feb55; }
.inline-edit {
  width: 100%; min-height: 84px; box-sizing: border-box; resize: vertical;
  background: var(--bg); color: var(--text); border: 1px solid var(--border-2);
  border-radius: 10px; padding: 10px; font-family: inherit; font-size: 13.5px; line-height: 1.6;
}
.inline-edit:focus { outline: none; border-color: #1f6feb; }

/* ---------- P2：代码块轻量高亮 ---------- */
.md-code { position: relative; }
.tk-str { color: #a5d6a7; }
.tk-com { color: #7f8899; font-style: italic; }
.tk-kw { color: #c79bff; font-weight: 600; }
.toast {
  position: fixed; left: 50%; bottom: 42px; transform: translateX(-50%);
  z-index: 200; background: var(--panel); color: var(--text);
  border: 1px solid var(--border-2); border-radius: 10px;
  padding: 10px 18px; font-size: 13px; box-shadow: var(--shadow);
  animation: toast-in .2s ease-out;
}
@keyframes toast-in { from { opacity: 0; transform: translateX(-50%) translateY(8px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

/* ---------- P2：多用户 / 登录 ---------- */
#userFields { display: flex; flex-direction: column; gap: 10px; }
#userInput, #passInput {
  flex: 1; background: transparent; border: none; outline: none; color: #eef2ff;
  font-size: 15px; padding: 13px 0; font-family: inherit; letter-spacing: .04em; min-width: 0;
}
#userInput::placeholder, #passInput::placeholder { color: #6b78a0; }
.lf-ico { color: #8aa0d8; flex-shrink: 0; font-size: 15px; width: 16px; text-align: center; }
.who { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 6px; }
.who-name { font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.who-btn { background: none; border: 0; color: var(--muted); font-size: 11.5px; cursor: pointer; font-family: inherit; padding: 2px 4px; }
.who-btn:hover { color: var(--text); }
.admin-links { display: flex; flex-direction: column; gap: 2px; margin-bottom: 6px; }
.admin-links .nav-item { font-size: 12px; padding: 6px 8px; text-align: left; }
.users-body, .audit-body { max-height: 52vh; overflow: auto; }

/* ===== 运行日志 / 远程升级 面板 ===== */
.log-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
.log-toolbar label { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12.5px; }
.log-toolbar .grow { flex: 1; min-width: 140px; }
.inp-sm { background: var(--sidebar); border: 1px solid var(--border); color: var(--text); border-radius: 10px; padding: 6px 8px; font-size: 12.5px; font-family: inherit; }
.inp-sm:focus { outline: none; box-shadow: var(--ring); }
.log-viewer { background: #0c0c0c; border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px; max-height: 54vh; overflow: auto; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.7; }
.log-line { display: flex; gap: 8px; white-space: pre-wrap; word-break: break-word; padding: 1px 0; }
.log-t { color: #5c6370; flex-shrink: 0; }
.log-lv { flex-shrink: 0; width: 46px; text-align: center; border-radius: 6px; font-size: 11px; padding: 0 2px; align-self: flex-start; }
.log-info { background: rgba(110,139,255,.15); color: #9db1ff; }
.log-warn { background: rgba(255,193,7,.15); color: #ffce6b; }
.log-error { background: rgba(239,83,80,.18); color: #ff8a87; }
.log-debug { background: rgba(118,118,118,.18); color: #a6a6a6; }
.log-msg { color: var(--text); }
.log-empty { color: var(--muted); padding: 14px; text-align: center; }
.log-empty.err, .upd-s.err { color: #ff8a87; }
.log-empty.ok, .upd-s.ok { color: #7ee0a0; }
.upd-status { background: var(--panel); border: 1px solid var(--border); border-radius: var(--r-md); padding: 12px 14px; margin-bottom: 12px; }
.upd-row { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.upd-row:last-child { border-bottom: none; }
.upd-k { color: var(--muted); }
.upd-v { color: var(--text); text-align: right; }
.upd-v .ok { color: #7ee0a0; }
.upd-v .warn { color: #ffce6b; }
.upd-v .muted { color: var(--muted); }
.upd-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
.switch-row { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text); }
.upd-actions .chk { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.upd-commits { max-height: 28vh; overflow: auto; margin-bottom: 10px; }
.upd-h { color: var(--muted); font-size: 12.5px; margin-bottom: 6px; }
.upd-c { font-family: ui-monospace, monospace; font-size: 12px; color: var(--text); padding: 3px 0; border-bottom: 1px solid var(--border); }
.upd-steps { background: #0c0c0c; border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px; max-height: 30vh; overflow: auto; font-family: ui-monospace, monospace; font-size: 12px; line-height: 1.7; }
.upd-s { color: var(--text); padding: 1px 0; }
.user-add { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.user-add input, .user-add select {
  background: var(--bg); color: var(--text); border: 1px solid var(--border);
  border-radius: 8px; padding: 8px 10px; font-size: 13px; font-family: inherit;
}
.user-add input { flex: 1; min-width: 110px; }

/* ---------- P2：推理模型思考过程 ---------- */
.think-block { margin: 10px 0; border: 1px solid var(--border); border-radius: 10px; background: var(--sidebar); max-width: 88%; }
.think-block summary { cursor: pointer; padding: 8px 12px; font-size: 12.5px; color: var(--muted); user-select: none; }
.think-block[open] summary { border-bottom: 1px solid var(--border); }
.think-text {
  margin: 0; padding: 10px 12px; white-space: pre-wrap; word-break: break-word;
  font-size: 12.5px; line-height: 1.6; color: var(--text-2);
  max-height: 260px; overflow: auto; font-family: inherit;
}

/* ============================================================
   移动端适配（≤720px）
   放在文件末尾，保证覆盖前面各段的同特异性规则。
   目标：侧栏抽屉化、主区占满屏宽、消除横向溢出、触屏可操作。
   ============================================================ */
.menu-btn {
  display: none; width: 36px; height: 36px; flex: none;
  place-items: center; background: transparent; color: var(--text-2);
  border: 1px solid var(--border); border-radius: 9px;
}
.menu-btn:hover { color: var(--text); border-color: var(--border-2); }
.side-overlay { display: none; }

@media (max-width: 720px) {
  /* 动态视口高度：避开手机浏览器地址栏与底部横条 */
  html, body { height: 100dvh; }
  .app { height: 100dvh; }
  body { -webkit-text-size-adjust: 100%; }

  /* 侧栏 → 抽屉；主区占满整屏 */
  .sidebar {
    position: fixed; top: 0; left: 0; bottom: 0;
    width: min(82vw, 300px); max-width: 300px;
    z-index: 60; overflow-y: auto; box-shadow: none;
    padding-top: calc(16px + env(safe-area-inset-top));
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
    transform: translateX(-101%);
    transition: transform .24s ease, box-shadow .24s ease;
  }
  body.side-open .sidebar { transform: none; box-shadow: 10px 0 36px rgba(0,0,0,.6); }
  .side-overlay {
    display: block; position: fixed; inset: 0; z-index: 55;
    background: rgba(0,0,0,.58);
    opacity: 0; visibility: hidden;
    transition: opacity .24s ease, visibility .24s ease;
  }
  body.side-open .side-overlay { opacity: 1; visibility: visible; }
  .main { width: 100%; min-width: 0; }

  /* 头部：汉堡 + 弹性标题 + 紧凑操作；隐藏长模型文本避免撑宽 */
  .chat-head {
    height: calc(52px + env(safe-area-inset-top));
    padding: env(safe-area-inset-top) 10px 0; gap: 8px;
  }
  .menu-btn { display: grid; }
  .ch-title { flex: 1; min-width: 0; max-width: none; font-size: 13.5px; }
  .ch-model { display: none; }
  .ch-actions { gap: 6px; }
  .ch-btn { padding: 6px 9px; font-size: 12px; min-height: 34px; }
  .export-menu button { padding: 10px 11px; }

  /* 消息区：收紧留白、放宽气泡、工具卡片占满 */
  .messages { padding: 14px 10px; }
  .msg { margin: 10px 0; flex-wrap: wrap; }
  .bubble { max-width: 92%; padding: 10px 12px; }
  /* 气泡与操作按钮并列时，窄屏会把按钮挤成竖排单字 → 整行换到气泡下方 */
  .msg-actions { flex: 1 0 100%; justify-content: flex-start; margin-top: 4px; }
  .msg.user .msg-actions { justify-content: flex-end; }
  .tool-card { width: 100%; }
  .think-block { max-width: 100%; }
  .bubble.md pre.md-code { max-width: 100%; }
  .user-imgs .user-img, .tool-imgs .tool-img { max-width: 100%; max-height: 220px; }

  /* 空状态 Hero */
  .welcome-inner { padding: 0 4px; }
  .welcome h1 { font-size: 26px; }
  .welcome-sub { font-size: 12.5px; margin-bottom: 18px; }
  .quick-row { gap: 8px; }
  .quick { padding: 8px 12px; font-size: 11.5px; min-height: 34px; }
  .quick .ico-sm { width: 14px; height: 14px; }

  /* 输入区：去掉换行提示、收紧选择器、防止按钮溢出屏幕 */
  .composer { padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); }
  .composer-inner { padding: 8px 10px 6px; border-radius: 18px; }
  .composer-bar { gap: 6px; margin-top: 4px; }
  .composer-left { gap: 6px; flex-shrink: 0; }
  .hint { display: none; }
  .attach { width: 36px; height: 36px; }
  .composer-right { min-width: 0; gap: 6px; }
  .mp-btn { height: 36px; padding: 0 8px; }
  .mp-model { max-width: 84px; }
  .mp-menu {
    position: fixed; left: 10px; right: 10px;
    bottom: calc(78px + env(safe-area-inset-bottom));
    width: auto; max-width: none;
  }
  .mp-body { max-height: 44dvh; }
  .send { width: 36px; height: 36px; flex-shrink: 0; }
  .stop { height: 36px; padding: 0 10px; }
  .status { font-size: 11px; margin-top: 4px; }

  /* 弹窗：接近全宽、限高、表格横向滚动、留出安全区 */
  .modal { padding: 12px; }
  .modal-box, .modal-box.wide {
    width: 100%; max-width: 100%; max-height: 88dvh;
    padding: 16px; border-radius: 16px;
  }
  .modal-actions { flex-wrap: wrap; gap: 8px; }
  .modal-actions .ghost, .modal-actions .send.solid { min-height: 40px; }
  .users-body, .audit-body, .usage-body { overflow-x: auto; max-height: 56dvh; }
  .usage-table { min-width: 460px; }
  .confirm-preview { max-height: 30dvh; }
  .cf-code { max-height: 26dvh; }
  .confirm-edit { min-height: 72px; }
  .prov-row { flex-wrap: wrap; }
  .prov-row label { width: 100%; }
  .user-add input { min-width: 44%; }
  .toast { bottom: calc(24px + env(safe-area-inset-bottom)); max-width: 90vw; }
}

/* 触屏（无 hover）：消息操作与会话删除按钮常显；触控目标 >= 38px */
@media (hover: none), (pointer: coarse) {
  .msg-actions { opacity: 1; }
  .session-item .del { opacity: 1; }
  .mact { padding: 6px 11px; font-size: 12px; }
  .ch-btn, .ghost, .send.solid, .attach, .send, .mp-btn, .stop { min-height: 38px; }
}

/* 极窄 / 矮屏登录页：气泡与表单不重叠，立绘退为背景 */
@media (max-width: 480px) {
  /* 立绘所在层在登录层之上（z-index 60 > 55），几何上必须完全避开气泡与表单，
     否则会直接压在输入框和「进入」按钮上。把它固定在两者之间的空白带。 */
  #butler { top: 30%; bottom: auto; height: 32vh; opacity: .55; }
  .login-brand { top: 18px; font-size: 17px; gap: 9px; }
  .brand-logo { width: 24px; height: 24px; border-radius: 7px; }
  .comic-bubble { top: 10%; padding: 14px 18px; font-size: 14px; line-height: 1.65; }
  .login-form { bottom: calc(7% + env(safe-area-inset-bottom)); gap: 10px; }
  .lf-row, .lf-enter, #userFields { width: min(320px, 88vw); }
  #userFields .lf-row { width: 100%; }
}
@media (max-height: 700px) and (max-width: 860px) {
  #butler { top: 30%; bottom: auto; height: 30vh; opacity: .45; }
  .comic-bubble { top: 7%; }
  .login-form { bottom: calc(4% + env(safe-area-inset-bottom)); }
}

/* ============================================================
   团队项目 / 定时任务 / 资产库 / 管理后台 / 我的
   ============================================================ */
html.fs-small { font-size: 14px; }
html.fs-large { font-size: 18px; }
body.theme-light {
  --bg: #f4f5f9; --sidebar: #eceef5; --panel: #ffffff; --panel-2: #e9ecf5;
  --border: #e3e7f1; --border-2: #d2d9e8; --text: #1c2030;
  --text-2: #4d556b; --muted: #7b849b;
  --shadow: 0 20px 54px rgba(28,32,48,.10), 0 2px 8px rgba(28,32,48,.05);
  --shadow-soft: inset 0 1px 0 rgba(255,255,255,.9), 0 6px 20px rgba(28,32,48,.06);
  --ring: 0 0 0 3px rgba(110,139,255,.16);
  --glow: rgba(110,139,255,.04);
}

.page-view { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; padding: 22px 26px 30px; }
.page-view::-webkit-scrollbar { width: 8px; }
.page-view::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: 8px; }
.pg-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 20px; flex-wrap: wrap; }
.pg-head .pg-title { font-size: 1.35rem; font-weight: 700; margin: 0; letter-spacing: -.01em; }
.pg-sub { color: var(--muted); font-size: .8rem; margin: 5px 0 0; }
.pg-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.pg-back { display: inline-flex; align-items: center; gap: 4px; color: var(--text-2); background: transparent; border: 1px solid var(--border); border-radius: 9px; padding: 7px 11px; cursor: pointer; font-size: .8rem; }
.pg-back:hover { background: var(--panel-2); }
.pg-ico-title { display: flex; align-items: center; gap: 11px; }
.pg-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--panel-2); border: 1px solid var(--border-2); flex-shrink: 0; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 7px 14px; border-radius: 10px; border: 1px solid var(--border-2); background: var(--panel); color: var(--text); font-size: .82rem; cursor: pointer; white-space: nowrap; }
.btn:hover { background: var(--panel-2); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #0d0f1a; font-weight: 600; }
.btn.danger { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, transparent); }
.btn.warn { color: #ffc46b; border-color: #ffc46b55; }
.btn.sm { min-height: 30px; padding: 4px 10px; font-size: .75rem; }
.btn .ico { width: 15px; height: 15px; }

.pc { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; }
.pc + .pc { margin-top: 14px; }
.pc h3 { margin: 0 0 12px; font-size: .95rem; font-weight: 600; }
.pc-hint { color: var(--muted); font-size: .78rem; line-height: 1.6; }
.size-warn { color: #ffc46b; font-size: .76rem; line-height: 1.5; margin-top: 6px; }
.size-warn.over { color: #ff6b6b; font-weight: 600; }
.free-period-banner { color: #57d38c; background: #57d38c14; border: 1px solid #57d38c44; border-radius: 10px; padding: 8px 12px; margin-bottom: 10px; }
.pg-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.pg-stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 16px; }
.pg-stat { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 13px 15px; }
.pg-stat .k { color: var(--muted); font-size: .75rem; }
.pg-stat .v { font-size: 1.35rem; font-weight: 700; margin-top: 4px; letter-spacing: -.02em; }
.pg-stat .v small { font-size: .72rem; font-weight: 400; color: var(--muted); margin-left: 4px; }

.proj-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 15px 16px; cursor: pointer; transition: border-color .15s, transform .1s; display: flex; gap: 12px; align-items: flex-start; }
.proj-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.proj-card .pc-ico { width: 38px; height: 38px; border-radius: 11px; background: var(--panel-2); display: grid; place-items: center; flex-shrink: 0; }
.proj-card .pc-body { flex: 1; min-width: 0; }
.proj-card .pc-name { font-weight: 600; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.proj-card .pc-meta { color: var(--muted); font-size: .75rem; margin-top: 6px; display: flex; gap: 10px; flex-wrap: wrap; }
.pg-empty { border: 1px dashed var(--border-2); border-radius: 14px; padding: 34px 18px; text-align: center; color: var(--muted); font-size: .85rem; line-height: 1.8; }
.pg-empty .big { font-size: 1rem; color: var(--text-2); display: block; margin-bottom: 6px; }

.ptabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin-bottom: 16px; overflow-x: auto; }
.ptab { background: none; border: none; color: var(--muted); padding: 10px 15px; font-size: .85rem; cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; }
.ptab:hover { color: var(--text); }
.ptab.active { color: var(--text); border-bottom-color: var(--accent); font-weight: 600; }
.ptab-body { min-height: 160px; }

.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-size: .8rem; min-width: 520px; }
.tbl th, .tbl td { text-align: left; padding: 9px 8px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.tbl th { color: var(--muted); font-weight: 500; white-space: nowrap; }
.tbl td .btn { margin-right: 4px; }
.badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: .7rem; background: var(--panel-2); border: 1px solid var(--border-2); color: var(--text-2); }
.badge.ok { color: #57d38c; border-color: #57d38c55; }
.badge.warn { color: #ffc46b; border-color: #ffc46b55; }
.badge.err { color: #ff8a85; border-color: #ff8a8555; }
.bar { height: 7px; background: var(--panel-2); border-radius: 999px; overflow: hidden; margin: 7px 0 4px; }
.bar > i { display: block; height: 100%; background: var(--accent); border-radius: 999px; }

.inline-form { display: flex; gap: 9px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 14px; }
.inline-form label { display: flex; flex-direction: column; gap: 5px; color: var(--muted); font-size: .75rem; flex: 1; min-width: 130px; }
.inline-form input, .inline-form select, .inline-form textarea, .tp-input {
  background: var(--bg); border: 1px solid var(--border-2); border-radius: 9px; color: var(--text);
  padding: 8px 11px; font-size: .85rem; width: 100%; font-family: inherit; outline: none;
}
.inline-form textarea { min-height: 66px; resize: vertical; }
.inline-form input:focus, .inline-form select:focus, .tp-input:focus { border-color: var(--accent); }
.inv-link-wrap { display: flex; gap: 8px; margin: 10px 0; }
.inv-link-wrap input { flex: 1; min-width: 0; background: var(--bg); border: 1px solid var(--border-2); border-radius: 9px; color: var(--text); padding: 9px 11px; font-size: .78rem; }
.inv-list { max-height: 180px; overflow: auto; margin-top: 6px; }
.inv-row { display: flex; align-items: center; gap: 8px; padding: 8px 4px; border-bottom: 1px solid var(--border); font-size: .76rem; color: var(--text-2); }
.inv-row code { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }
.join-body { font-size: .88rem; line-height: 1.9; color: var(--text-2); }
.join-body b { color: var(--text); }
.tp-label { display: block; color: var(--muted); font-size: .78rem; margin-bottom: 7px; }

/* 我的 */
.me-hero { display: flex; align-items: center; gap: 14px; padding: 4px 0 18px; }
.me-avatar { width: 52px; height: 52px; border-radius: 16px; background: var(--accent); color: #0d0f1a; display: grid; place-items: center; font-size: 1.3rem; font-weight: 700; flex-shrink: 0; }
.me-name { font-size: 1.1rem; font-weight: 700; }
.me-role { color: var(--muted); font-size: .78rem; margin-top: 3px; }
.me-credits { margin-left: auto; text-align: right; }
.me-credits .n { font-size: 1.5rem; font-weight: 700; color: var(--accent); }
.me-credits .t { color: var(--muted); font-size: .74rem; }
.me-list { display: flex; flex-direction: column; }
.me-row { display: flex; align-items: center; gap: 12px; padding: 13px 2px; border-bottom: 1px solid var(--border); cursor: pointer; }
.me-row:last-child { border-bottom: none; }
.me-row:hover { background: var(--panel-2); }
.me-row .mr-label { font-size: .87rem; }
.me-row .mr-value { margin-left: auto; color: var(--muted); font-size: .8rem; display: flex; align-items: center; gap: 6px; }
.me-row select { background: var(--bg); border: 1px solid var(--border-2); color: var(--text); border-radius: 8px; padding: 5px 8px; font-size: .78rem; }
.seg { display: inline-flex; background: var(--bg); border: 1px solid var(--border-2); border-radius: 9px; padding: 2px; }
.seg button { border: none; background: none; color: var(--muted); padding: 4px 10px; border-radius: 7px; font-size: .75rem; cursor: pointer; }
.seg button.on { background: var(--panel-2); color: var(--text); }
.mem-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: .82rem; }
.mem-item:last-child { border-bottom: none; }
.mem-item .m-cat { color: var(--accent); font-size: .7rem; border: 1px solid var(--border-2); border-radius: 6px; padding: 2px 6px; flex-shrink: 0; }
.mem-item .m-txt { flex: 1; word-break: break-word; }

/* 管理后台 */
.admin-cards { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-bottom: 16px; }
.admin-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px; }
.admin-card .t { color: var(--muted); font-size: .75rem; display: flex; align-items: center; gap: 6px; }
.admin-card .n { font-size: 1.3rem; font-weight: 700; margin: 8px 0 2px; }
.admin-card .d { color: var(--muted); font-size: .72rem; }
.cfg-grid { display: grid; gap: 11px; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.cfg-grid label { display: flex; flex-direction: column; gap: 5px; color: var(--muted); font-size: .75rem; }
.cfg-grid input, .cfg-grid select { background: var(--bg); border: 1px solid var(--border-2); color: var(--text); border-radius: 8px; padding: 7px 9px; font-size: .82rem; font-family: inherit; }

/* 手机端底部导航 */
.mobile-tabs { display: none; }
@media (max-width: 720px) {
  .page-view { padding: 14px 12px calc(18px + env(safe-area-inset-bottom)); }
  .pg-head { gap: 9px; margin-bottom: 14px; }
  .pg-head .pg-title { font-size: 1.15rem; }
  .pg-actions { width: 100%; margin-left: 0; }
  .pg-actions .btn { flex: 1; }
  .pg-grid, .pg-stats, .admin-cards, .cfg-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .pg-stats .pg-stat .v { font-size: 1.1rem; }
  .pc { padding: 13px 12px; }
  .ptab { padding: 9px 11px; font-size: .8rem; }
  .inline-form label { min-width: 100%; }
  .inline-form .btn { width: 100%; }
  .me-credits .n { font-size: 1.25rem; }
  .mobile-tabs {
    display: flex; flex: 0 0 calc(54px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    border-top: 1px solid var(--border); background: var(--sidebar);
  }
  .mobile-tabs button {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; background: none; border: none; color: var(--muted); font-size: .68rem; cursor: pointer;
  }
  .mobile-tabs button .ico { width: 19px; height: 19px; }
  .mobile-tabs button.active { color: var(--accent); }
  .modal-box { width: 92vw !important; max-height: 86dvh; overflow: auto; }
  .inv-link-wrap { flex-direction: column; }
}
@media (max-width: 400px) {
  .pg-grid, .pg-stats, .admin-cards, .cfg-grid { grid-template-columns: 1fr; }
}

/* ============ 积分中心 / 积分规则 / 积分券 ============ */
.me-credits.clickable { cursor: pointer; padding: 6px 10px; border-radius: 12px; border: 1px solid transparent; transition: background .15s, border-color .15s; }
.me-credits.clickable:hover, .me-credits.clickable:focus-visible { background: var(--panel-2); border-color: var(--border-2); outline: none; }

.credit-hero { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; margin-bottom: 14px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(120deg, var(--panel), var(--panel-2)); }
.ch-label { color: var(--muted); font-size: .78rem; }
.ch-value { font-size: 2.2rem; font-weight: 700; color: var(--accent); line-height: 1.15; }
.ch-sub { color: var(--muted); font-size: .78rem; margin-top: 6px; }
.ch-ico { width: 54px; height: 54px; border-radius: 16px; background: var(--panel-2); display: grid; place-items: center; flex-shrink: 0; }
.ch-ico .ico { width: 26px; height: 26px; opacity: .7; }

.redeem-row { display: flex; gap: 9px; }
.redeem-input { flex: 1; min-width: 0; background: var(--bg); border: 1px solid var(--border-2); color: var(--text); border-radius: 9px; padding: 9px 12px; font-size: .9rem; font-family: inherit; letter-spacing: .04em; }
.redeem-input:focus { border-color: var(--accent); outline: none; }
.redeem-row .btn { min-height: 38px; }

.rule-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.rule-group { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--bg); }
.rg-title { font-weight: 600; font-size: .85rem; margin-bottom: 8px; color: var(--accent); }
.rule-item { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: .77rem; }
.rule-item:last-child { border-bottom: none; }
.rule-item span { color: var(--muted); flex-shrink: 0; }
.rule-item b { font-weight: 500; text-align: right; word-break: break-word; }

.rule-edit { display: grid; gap: 14px; }
.re-sec { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; }
.re-sec > b { display: block; font-size: .82rem; margin-bottom: 10px; }

.voucher-summary { color: var(--muted); font-size: .78rem; margin: 6px 0 12px; }
.voucher-codes { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; background: var(--bg); }
.vc-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; font-size: .82rem; }
.vc-head > div { display: flex; gap: 6px; }
.vc-list { display: flex; flex-wrap: wrap; gap: 6px; max-height: 190px; overflow: auto; }
.code-chip { display: inline-block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .72rem; padding: 4px 8px; border-radius: 7px; background: var(--panel-2); border: 1px solid var(--border-2); color: var(--text-2); white-space: nowrap; }
.vc-list .code-chip { cursor: pointer; }
.vc-list .code-chip:hover { border-color: var(--accent); color: var(--accent); }
.code-chip.used { opacity: .5; text-decoration: line-through; }
.tbl .code-chip { font-size: .68rem; }

@media (max-width: 720px) {
  .credit-hero { padding: 16px 14px; }
  .ch-value { font-size: 1.8rem; }
  .ch-ico { width: 44px; height: 44px; }
  .rule-grid { grid-template-columns: 1fr; }
  .redeem-row { flex-direction: column; }
  .redeem-row .btn { width: 100%; }
  .vc-list { max-height: 150px; }
  .vc-head { flex-wrap: wrap; }
}

/* ---------------- 邮箱代收发 / 自动回复 ---------------- */
.mail-status { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; margin-bottom: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); font-size: .78rem; color: var(--muted); }
.mail-status.off { border-color: #ff8a8555; background: #ff8a8508; }
.mail-status .btn { margin-left: auto; }
.mail-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 14px; align-items: start; }
.mail-side { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; min-width: 0; }
.mail-side h3 { margin: 0 0 12px; font-size: .88rem; font-weight: 600; }
.mail-acc { border: 1px solid var(--border); border-radius: 10px; padding: 10px 11px; margin-bottom: 9px; cursor: pointer; background: var(--bg); transition: border-color .15s; }
.mail-acc:hover { border-color: var(--accent); }
.mail-acc.active { border-color: var(--accent); background: var(--panel-2); }
.ma-top { display: flex; align-items: center; gap: 7px; }
.ma-label { font-size: .82rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ma-email { font-size: .72rem; color: var(--muted); margin: 5px 0 7px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ma-meta { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; font-size: .68rem; color: var(--muted); }
.ma-err { font-size: .68rem; color: #ff8a85; margin-top: 6px; word-break: break-word; }
.mail-main { min-width: 0; }
.mail-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.mail-hint { font-size: .72rem; color: var(--muted); margin-left: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 40%; }
.mail-form { margin-bottom: 14px; }
.mail-form .cfg-grid { margin-bottom: 10px; }
.mail-textarea { display: flex; flex-direction: column; gap: 6px; color: var(--muted); font-size: .75rem; margin-bottom: 12px; }
.mail-textarea textarea { background: var(--bg); border: 1px solid var(--border-2); color: var(--text); border-radius: 9px; padding: 9px 11px; font-size: .85rem; font-family: inherit; resize: vertical; }
.mail-textarea textarea:focus { border-color: var(--accent); outline: none; }
.pc-hint.warn { color: #ffc46b; }
.mail-list { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; background: var(--panel); }
.mail-row { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--border); cursor: pointer; font-size: .78rem; }
.mail-row:last-child { border-bottom: none; }
.mail-row:hover, .mail-row.active { background: var(--panel-2); }
.mr-dir { width: 20px; height: 20px; flex-shrink: 0; display: grid; place-items: center; border-radius: 6px; background: var(--panel-2); color: var(--muted); font-size: .66rem; }
.mr-from { width: 155px; flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-2); }
.mr-subj { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mr-time { color: var(--muted); font-size: .68rem; flex-shrink: 0; }
.mail-detail { margin-top: 14px; }
.md-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.md-head h3 { margin: 0; font-size: .92rem; }
.md-meta { color: var(--muted); font-size: .72rem; margin: 9px 0; line-height: 1.7; }
.md-body { white-space: pre-wrap; word-break: break-word; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; font-size: .8rem; line-height: 1.7; font-family: inherit; margin: 10px 0; max-height: 320px; overflow: auto; color: var(--text-2); }
.md-atts { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: .74rem; color: var(--muted); margin: 10px 0; }

@media (max-width: 720px) {
  .mail-layout { grid-template-columns: 1fr; gap: 10px; }
  .mail-side { padding: 10px; }
  .mail-side h3 { margin-bottom: 8px; }
  .mail-side .pg-empty { padding: 14px 10px; }
  .mail-side .mail-acc { display: inline-block; width: 165px; vertical-align: top; margin: 0 8px 0 0; }
  .mail-side { white-space: nowrap; overflow-x: auto; }
  .mail-side .mail-acc { white-space: normal; }
  .mail-hint { display: none; }
  .mail-toolbar .btn { flex: 1 0 auto; }
  .mr-from { width: 92px; }
  .mr-time { display: none; }
  .mail-row { gap: 7px; padding: 9px 8px; font-size: .74rem; }
  .mail-status { font-size: .72rem; gap: 8px; }
  .mail-status .btn { margin-left: 0; width: 100%; }
  .md-body { max-height: 240px; }
}


/* ============ 注册 / 邀请 ============ */
.lf-note { font-size: 12px; color: var(--muted); text-align: center; margin-bottom: 10px; line-height: 1.5; }
.badge.st-active { color: #57d38c; border-color: #57d38c55; }
.badge.st-pending { color: #ffc46b; border-color: #ffc46b55; }
.badge.st-used { color: var(--muted); }
.badge.st-revoked, .badge.st-expired { color: #ff8a85; border-color: #ff8a8555; }
@media (max-width: 720px) {
  .lf-note { width: min(320px, 88vw); margin-left: auto; margin-right: auto; }
}

/* ============================================================
   Soft UI · 全站柔和化（统一圆角 / 消除直角 / 柔光层次）
   ------------------------------------------------------------
   本段只覆盖视觉属性（border-radius / border-color / background /
   box-shadow / transition），刻意不改动任何布局尺寸，避免影响
   既有移动端几何断言。移动端有差异的圆角在本段末尾同步覆盖。
   ============================================================ */
:root            { --line-soft: rgba(255,255,255,.055); }
body.theme-light { --line-soft: rgba(28,32,48,.075); }

/* ---- A. 基调：柔光背景 / 兜底圆角 / 柔和焦点 / 圆润滚动条 ---- */
.main {
  background: radial-gradient(1100px 640px at 8% -14%, var(--glow), transparent 62%), var(--bg);
}
/* 兜底：任何没单独声明圆角的交互元素都不会变回直角（特异性最低，不覆盖胶囊/圆形按钮） */
button, input, select, textarea { border-radius: var(--r-sm); }
input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid transparent;
  box-shadow: var(--ring);
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--border-2) 82%, transparent);
  border: 2px solid transparent; background-clip: padding-box;
  border-radius: var(--r-pill);
}
.page-view::-webkit-scrollbar-thumb { border-radius: var(--r-pill); }

/* 统一交互过渡：只动颜色/阴影，不引入布局动画 */
.btn, .ghost, .nav-item, .session-item, .quick, .ch-btn, .mact, .ptab,
.proj-card, .mail-acc, .mail-row, .me-row, .badge, .code-chip, .seg button,
.pg-back, .attach, .mp-btn, .stop, .send, .export-menu button, .mobile-tabs button,
.new-btn, .lf-enter, .send.solid, .who-btn, .mp-prov, .mp-model-card {
  transition: background .22s var(--ease), border-color .22s var(--ease),
              color .22s var(--ease), box-shadow .22s var(--ease),
              transform .18s var(--ease), filter .18s var(--ease);
}

/* ---- B. 圆角尺度统一（小控件 8 / 常规 12 / 卡片 14 / 大容器 18 / 超大 22） ---- */
/* 8px：小徽章、小图标块、迷你按钮 */
.session-item .del, .cf-tag, .mr-dir, .mem-item .m-cat, .code-chip,
.demo-badge, .bubble.md code, .mp-settings-link, .export-menu button,
.brand-logo, .mp-prov .ic, .seg button { border-radius: var(--r-xs); }
/* 12px：常规控件 */
.tree-item, .mact, .ch-btn, .attach, .menu-btn, .pg-back, .logo,
.img-prev .thumb, .user-imgs .user-img, .tool-imgs .tool-img,
.who-btn, .mp-prov, .mp-model-card, .mp-settings-link,
.inline-form input, .inline-form select, .inline-form textarea, .tp-input,
.cfg-grid input, .cfg-grid select, .me-row select, .inv-link-wrap input,
.redeem-input, .mail-textarea textarea, .prov-row input,
.user-add input, .user-add select, .expert-sel, .confirm-edit,
.inline-edit, .cf-code, .think-block, .usage-cell, .toast, .export-menu,
.me-row, .mem-item, .inv-row, .mail-row, .mail-acc, .rule-item,
.pg-ico, .proj-card .pc-ico, .btn.sm, .send.solid { border-radius: var(--r-sm); }
/* 14px：卡片 / 面板 / 表格容器 */
.tool-card, .pg-stat, .proj-card, .admin-card,
.mail-status, .mail-list, .md-body, .rule-group, .re-sec,
.voucher-codes, .bubble.md pre.md-code, .file-content, .prov,
.pg-empty { border-radius: var(--r-md); }
/* 18px：气泡、主卡片、弹层 */
.bubble, .pc, .mail-side, .credit-hero, .mp-menu,
.me-credits.clickable { border-radius: var(--r-lg); }
/* 22px：输入容器、弹窗、Hero、登录表单 */
.composer-inner, .modal-box, .modal-box.wide, .hero-logo, .comic-bubble,
.lf-row, .lf-enter, .me-avatar, .ch-ico { border-radius: var(--r-xl); }
/* 胶囊与圆形保持 */
.quick, .badge, .bar, .bar > i, .stop, .mp-btn, .ptab,
.mail-acc .badge { border-radius: var(--r-pill); }
.send, .img-prev .thumb-x, .spin, .thinking .dot, .mp-dot { border-radius: 50%; }

/* 气泡尖角（原 5px）与引用块直角（原 0 8px 8px 0）全部抹平 */
.bubble, .msg.user .bubble, .msg.assistant .bubble, .msg.error .bubble {
  border-radius: var(--r-lg);
}
.bubble.md blockquote {
  border-left: 0;
  border-radius: var(--r-sm);
  background: color-mix(in srgb, var(--accent) 11%, transparent);
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--accent) 48%, transparent);
}

/* ---- C. 柔光层次：卡片不再靠硬边框撑轮廓 ---- */
.pc, .pg-stat, .proj-card, .admin-card, .pg-empty, .mail-side,
.mail-list, .mail-status, .credit-hero, .rule-group, .re-sec,
.voucher-codes, .tool-card, .modal-box, .mp-menu, .export-menu,
.toast, .think-block, .usage-cell, .md-body, .composer-inner,
.prov, .file-content, .cf-code, .confirm-edit, .inline-edit,
.mail-acc, .mail-row, .me-row, .pg-back, .btn, .ghost {
  border-color: var(--border);
}
.pc, .pg-stat, .proj-card, .admin-card, .pg-empty, .mail-side,
.mail-list, .mail-status, .credit-hero, .rule-group, .re-sec,
.voucher-codes, .tool-card, .modal-box, .mp-menu, .export-menu,
.toast, .think-block, .usage-cell, .md-body, .composer-inner {
  box-shadow: var(--shadow-soft);
  transition: border-color .22s var(--ease), box-shadow .22s var(--ease),
              background .22s var(--ease), transform .18s var(--ease);
}
.proj-card:hover {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
  box-shadow: 0 12px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
}
.btn:hover, .ghost:hover, .pg-back:hover, .ch-btn:hover, .mact:hover:not(:disabled) {
  box-shadow: var(--shadow-soft);
}
.composer-inner:focus-within {
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border-2));
  box-shadow: var(--shadow-soft), 0 0 0 3px rgba(110,139,255,.08);
}
/* 主按钮加一层极淡高光，避免纯色块的生硬感 */
.new-btn, .btn.primary, .send.solid {
  background-image: linear-gradient(135deg, rgba(255,255,255,.13), transparent 68%);
}
/* 输入框焦点：柔和光环代替硬蓝边 */
.inline-form input:focus, .inline-form select:focus, .inline-form textarea:focus,
.tp-input:focus, .cfg-grid input:focus, .cfg-grid select:focus,
.inv-link-wrap input:focus, .redeem-input:focus, .mail-textarea textarea:focus,
.prov-row input:focus, .expert-sel:focus, .user-add input:focus,
.confirm-edit:focus, .inline-edit:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-2));
  box-shadow: var(--ring);
}

/* ---- D. 分隔线柔化（水平细线不算「框」，只降对比） ---- */
.chat-head, .mp-head, .ptabs, .think-block[open] summary { border-bottom-color: var(--line-soft); }
.side-foot, .tool-args, .tool-result { border-top-color: var(--line-soft); }
.sidebar, .mp-providers { border-right-color: var(--line-soft); }
.me-row, .mem-item, .inv-row, .rule-item, .mail-row,
.tbl th, .tbl td, .usage-table th, .usage-table td { border-bottom-color: var(--line-soft); }

/* ---- E. 表格：由「直角网格」改为圆角条带 ---- */
.tbl, .usage-table { border-collapse: separate; border-spacing: 0; }
.tbl thead th, .usage-table thead th {
  background: color-mix(in srgb, var(--panel-2) 62%, transparent);
}
.tbl thead th:first-child, .usage-table thead th:first-child {
  border-top-left-radius: var(--r-sm); border-bottom-left-radius: var(--r-sm);
}
.tbl thead th:last-child, .usage-table thead th:last-child {
  border-top-right-radius: var(--r-sm); border-bottom-right-radius: var(--r-sm);
}
.tbl tbody tr:last-child td, .usage-table tbody tr:last-child td { border-bottom-color: transparent; }
.tbl tbody tr:hover td, .usage-table tbody tr:hover td {
  background: color-mix(in srgb, var(--panel-2) 52%, transparent);
}
.tbl tbody tr:hover td:first-child, .usage-table tbody tr:hover td:first-child {
  border-top-left-radius: var(--r-xs); border-bottom-left-radius: var(--r-xs);
}
.tbl tbody tr:hover td:last-child, .usage-table tbody tr:hover td:last-child {
  border-top-right-radius: var(--r-xs); border-bottom-right-radius: var(--r-xs);
}
.tbl-wrap { border-radius: var(--r-md); }

/* ---- F. tab / 列表行 / 底部导航：hover 不再是方块 ---- */
.ptab { border-radius: var(--r-pill); }
.ptab:hover { background: color-mix(in srgb, var(--panel-2) 60%, transparent); }
.ptab.active {
  border-bottom-color: transparent;
  background: color-mix(in srgb, var(--accent) 15%, transparent);
  color: var(--accent);
}
.me-row:hover, .mail-row:hover, .mail-row.active, .inv-row:hover {
  background: color-mix(in srgb, var(--panel-2) 62%, transparent);
}
.tool-head { border-radius: var(--r-md) var(--r-md) 0 0; }
.mp-head { border-radius: var(--r-lg) var(--r-lg) 0 0; }
.mobile-tabs button { border-radius: var(--r-sm); }
.mobile-tabs button.active {
  background: color-mix(in srgb, var(--accent) 15%, transparent);
}

/* ---- G. 移动端：同步有差异的圆角，不给布局添负担 ---- */
@media (max-width: 720px) {
  .modal-box, .modal-box.wide { border-radius: var(--r-lg); }
  .composer-inner { border-radius: 20px; }
  /* 抽屉左侧与屏幕边缘重合，只给可见的右沿做圆角（贴边侧保留 0 是刻意的层叠设计） */
  .sidebar { border-radius: 0 var(--r-xl) var(--r-xl) 0; border-right-color: transparent; }
  .mobile-tabs {
    border-top-color: var(--line-soft);
    box-shadow: 0 -8px 24px rgba(0,0,0,.14);
  }
  .mobile-tabs button { margin: 6px 3px; }
  .ptab { border-radius: var(--r-pill); }
}
