/* ===== assets/css/05-ai.css | AI 编程台：左栏表单 / 右栏结果 / 复制代码面板 / 底部工具行 / 交互滑块 ===== */
/* 来源：原 index.html 内联样式 第 198-289 行；改样式只改这个文件 */
  /* ================= AI 操作台首页（截图风格） ================= */
  .ad-console { position:fixed; inset:0; display:none; flex-direction:column; background:#0b0905; }
  .ad-topbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:nowrap; gap:14px; padding:14px 22px; background:#15110a; border-bottom:1px solid rgba(224,176,84,.18); position:relative; z-index:20; }
  .ad-brand { display:flex; align-items:center; gap:12px; flex:0 0 auto; white-space:nowrap; }
  .ad-logo { width:42px; height:42px; border-radius:10px; background:linear-gradient(135deg,#e0b054,#a9752c); color:#fff; font-weight:800; font-size:22px; display:flex; align-items:center; justify-content:center; }
  .ad-title { font-size:24px; font-weight:800; color:#fbf3e4; letter-spacing:1px; }
  .ad-ver { font-size:12px; color:#99886a; }
  .ad-topbtns { display:flex; gap:8px; align-items:center; flex:0 0 auto; flex-wrap:nowrap; white-space:nowrap; }
  .ad-topbtn { background:#1c170d; color:#f6ecd8; border:1px solid rgba(224,176,84,.26); border-radius:8px; padding:8px 14px; font-size:13px; cursor:pointer; }
  .ad-topbtn:hover { border-color:#e0b054; }
  .ad-topbtn.red { background:#7a2f22; border-color:#a03a27; }
  /* ★v2.40 双语切换按钮（顶栏一个 / 登录页卡片右上角一个） */
  .ad-topbtn.lang-btn { min-width:44px; text-align:center; letter-spacing:.5px; }
  /* ★v2.42：登录页这个按钮原来 position:fixed 贴窗口右上角，会压在顶栏的「修改密码 / 退出登录」上
     （英文模式两个「中文」并排，看着像排版坏了）。改成卡片内右上角绝对定位。 */
  .login-lang { position:absolute; top:12px; right:12px; z-index:5; min-width:40px; padding:5px 10px; font-size:12px; }
  /* ★v2.41 英文界面：英文标签比中文长得多，顶栏必须允许换行，否则会互相压 / 被裁掉 */
  html[lang="en"] .ad-topbar { flex-wrap:wrap; row-gap:8px; padding:12px 20px; }
  html[lang="en"] .ad-brand { min-width:0; }
  html[lang="en"] .ad-title { font-size:19px; letter-spacing:.4px; white-space:nowrap; }
  html[lang="en"] .ad-ver { font-size:11px; white-space:nowrap; }
  html[lang="en"] .ad-maintabs { flex-wrap:wrap; overflow:visible; flex:1 1 100%; order:3; row-gap:4px; }
  html[lang="en"] .ad-maintab { padding:7px 11px; font-size:13px; }
  html[lang="en"] .ad-topbtns { flex-wrap:wrap; justify-content:flex-end; row-gap:6px; }
  /* ★v2.42 英文顶栏排版（用户口径：「选择英文导航来排版有问题」）：
     英文标签比中文长一倍，硬塞一行必然互相压。做法 = 两行式顶栏：
       第 1 行：Logo + 站名｜右侧按钮组（一律靠右，不被挤散）
       第 2 行：功能标签整行、左对齐、上面一条细分隔线 —— 看起来是「有意分行」，不是被挤下来。
     中文模式完全不受影响（选择器都带 html[lang="en"]）。 */
  html[lang="en"] .ad-maintabs {
    justify-content:flex-start; gap:2px; margin-top:2px; padding-top:8px;
    border-top:1px solid #1c170d; row-gap:2px;
  }
  html[lang="en"] .ad-maintab { padding:7px 12px; font-size:13px; border-radius:8px; }
  html[lang="en"] .ad-maintab.active { border-radius:8px; }
  html[lang="en"] .who { font-size:12.5px; white-space:nowrap; }
  /* 英文标签更长，左栏给宽一点，状态条一行放得下（不放宽会被挤成两行、字号忽大忽小） */
  html[lang="en"] .ad-left { width:452px; }
  html[lang="en"] #aiQuotaBar { white-space:nowrap; }
  html[lang="en"] .ad-setrow { row-gap:5px; }
  /* ===== 对齐同事站（MCH）新增：标语 / 设置行 / 标签页 / 右栏按钮 / 状态条 / PWA ===== */
  .ad-setrow { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; padding:8px 11px; background:#15110a; border:1px solid rgba(224,176,84,.18); border-radius:8px; font-size:12.5px; color:#d6c8ab; }
  .ad-setrow label { display:flex; align-items:center; gap:6px; cursor:pointer; user-select:none; }
  .ad-setrow select { background:#0e0b07; border:1px solid rgba(224,176,84,.26); border-radius:6px; color:#f6ecd8; padding:3px 7px; font-size:12.5px; outline:none; max-width:210px; }
  .ad-setrow input[type=range] { width:110px; accent-color:#e0b054; }
  .ad-setrow .lv { color:#e6b95f; font-weight:700; min-width:2.2em; }
  .ad-setrow .sep { color:#8a7a5e; }
  .ad-tabs { display:flex; gap:6px; margin-top:10px; border-bottom:1px solid rgba(224,176,84,.18); }
  .ad-tab { padding:7px 15px; font-size:13px; color:#c0b29a; background:#15110a; border:1px solid rgba(224,176,84,.18); border-bottom:none; border-radius:7px 7px 0 0; cursor:pointer; }
  .ad-tab:hover { color:#fbf3e4; border-color:rgba(224,176,84,.30); }
  .ad-tab.gold { color:#f4d488; border-color:#5c4a20; }
  .ad-prow { display:flex; align-items:center; margin-top:6px; }
  .ad-mini { background:#1a140b; border:1px solid rgba(224,176,84,.26); border-radius:6px; color:#d6c8ab; font-size:11.5px; padding:3px 10px; cursor:pointer; }
  .ad-mini:hover { border-color:#e0b054; color:#fbf3e4; }
  .ad-head .hb { border-radius:7px; padding:6px 12px; font-size:12.5px; cursor:pointer; border:1px solid rgba(224,176,84,.26); background:#1c170d; color:#f6ecd8; }
  .ad-head .hb.blue { background:#1d3a5c; border-color:#2f5b8c; color:#cfe4ff; }
  .ad-head .hb.yellow { background:#0f0c08; border-color:#7d6522; color:#f4d488; }
  .ad-head .hb.x { background:#5a231b; border-color:#8a3a27; color:#ffd6cc; padding:6px 10px; }
  .ad-head .hb[disabled] { opacity:.5; cursor:not-allowed; }
  .ad-statbar { display:none; align-items:center; gap:10px; border:1px solid #2e9e5b; background:#16261c; color:#9fe0b4; border-radius:8px; padding:9px 13px; font-size:13px; margin-bottom:10px; flex-wrap:wrap; }
  .ad-statbar .spin { width:15px; height:15px; flex:0 0 15px; border:2px solid #2e9e5b; border-top-color:transparent; border-radius:50%; animation:adspin .8s linear infinite; }
  @keyframes adspin { to { transform:rotate(360deg); } }
  /* ★v1.32 状态条上的迷你「AI 正在处理」动图（绿色，和状态条同色系） */
  .ad-statbar .ai-mini { width:20px; height:20px; flex:0 0 20px; }
  .ad-statbar .ai-mini .at-led { animation:atLedPulse 1.6s ease-in-out infinite; }
  .ad-statbar .ai-mini .at-eye { transform-box:fill-box; transform-origin:50% 50%; animation:atEyeBlink 3.6s ease-in-out infinite; }
  .ad-statbar .ai-mini .at-scan { animation:atScanMove 1.9s ease-in-out infinite; }
  .ad-statbar .sub { color:#7fbf8f; font-size:11.5px; margin-left:auto; }
  .pwa-bar { position:fixed; left:16px; bottom:16px; z-index:60; display:none; align-items:center; gap:11px; background:#1a140b; border:1px solid rgba(224,176,84,.28); border-radius:11px; padding:10px 13px; box-shadow:0 8px 26px rgba(0,0,0,.45); max-width:340px; }
  .pwa-bar .tt { font-size:13.5px; color:#fbf3e4; font-weight:700; }
  .pwa-bar .ds { font-size:11.5px; color:#99886a; margin-top:2px; }
  .pwa-bar .ib { background:#2e9e5b; color:#0b0f0b; border:none; border-radius:7px; padding:6px 12px; font-size:12.5px; font-weight:800; cursor:pointer; }
  .pwa-bar .xb { background:transparent; border:none; color:#8a7a5e; font-size:15px; cursor:pointer; line-height:1; }
  .ad-maintabs { display:flex; gap:6px; flex-wrap:nowrap; overflow-x:auto; min-width:0; scrollbar-width:none; }
  .ad-maintabs::-webkit-scrollbar { height:0; }
  .ad-maintab { padding:9px 13px; border-radius:8px 8px 0 0; cursor:pointer; font-size:14px; white-space:nowrap; flex:0 0 auto; color:#99886a; border:1px solid transparent; }
  .ad-maintab.active { background:#1c170d; color:#fbf3e4; border-color:rgba(224,176,84,.26); }
  .ad-maintab.ad-tab-dev::after { content:"开发中"; margin-left:6px; padding:0 4px; font-size:10px; line-height:14px; color:#e0b054; border:1px solid #5c4a20; border-radius:3px; vertical-align:1px; }

  .ad-body { flex:1; display:flex; gap:16px; padding:20px 22px; overflow:hidden; }
  /* 左侧：功能选择 + 描述 + 提交 */
  .ad-left { width:430px; min-width:360px; display:flex; flex-direction:column; gap:14px; overflow-y:auto; }
  .ad-left .ad-selectrow { display:flex; gap:10px; }
  .ad-left select { flex:1; background:#0e0b07; border:1px solid rgba(224,176,84,.26); border-radius:8px; color:#fbf3e4; padding:12px 14px; font-size:14px; outline:none; cursor:pointer; }
  .ad-left select:focus { border-color:#e0b054; }
  .ad-left .ad-go { background:#2e9e5b; color:#fff; border:none; border-radius:8px; padding:12px 20px; font-size:15px; font-weight:700; cursor:pointer; white-space:nowrap; }
  .ad-left .ad-go:hover { background:#37b56a; }
  .ad-left .ad-go:disabled { background:rgba(224,176,84,.28); }
  .ad-descbox { background:#15110a; border:1px solid rgba(224,176,84,.18); border-radius:12px; padding:14px; }
  .ad-descbox textarea { width:100%; background:#0e0b07; border:none; border-radius:8px; color:#fbf3e4; font-size:14px; line-height:1.6; padding:10px 12px; outline:none; resize:vertical; min-height:120px; font-family:inherit; }
  .ad-descbox textarea:focus { box-shadow:0 0 0 1px #e0b054 inset; }
  .ad-descbox .tip { color:#99886a; font-size:12px; margin-top:8px; }
  /* 右侧：代码/结果区 */
  .ad-right { flex:1; display:flex; flex-direction:column; background:#15110a; border:1px solid rgba(224,176,84,.18); border-radius:12px; overflow:hidden; min-width:0; }
  .ad-right .ad-head { padding:12px 18px; border-bottom:1px solid rgba(224,176,84,.18); font-size:14px; color:#e3d6b8; display:flex; align-items:center; justify-content:space-between; }
  .ad-right .ad-body2 { flex:1; overflow:auto; padding:16px 18px; }
  .ad-codebox { white-space:pre-wrap; font-family:Consolas,"Courier New",monospace; font-size:13px; color:#f6ecd8; line-height:1.55; }
/* ===== 改后显示页：复制代码面板（对齐同事站） ===== */
.aiCode { border:1px solid rgba(224,176,84,.26); border-radius:10px; overflow:hidden; background:#181309; }
.aiCodeHead { display:flex; align-items:center; gap:8px; padding:10px 12px; background:#1d160d; border-bottom:1px solid rgba(224,176,84,.26); flex-wrap:wrap; }
.aiCodeTitle { display:inline-flex; align-items:center; gap:6px; background:#f7ecd6; color:#2a2116; border:0; border-radius:8px; font-weight:700; font-size:13.5px; padding:6px 12px; cursor:pointer; font-family:inherit; }
.aiCodeTitle:hover { background:#fdf7e6; }
.aiCodeTitle.plain { background:none; color:#e3d6b8; cursor:default; font-weight:600; padding-left:2px; }
.aiCodeExt { color:#99886a; font-size:12px; }
.aiCodeExt b { color:#e3d6b8; }
.aiCodeIcons { margin-left:auto; display:flex; gap:6px; }
.aiCodeIcons .ad-toolbtn { padding:6px 11px; }
/* ★v2.29：从右栏顶部挪到代码行里的「🔑 加入在线授权管理」（跟着复制代码那一行） */
.aiCodeLic { padding:6px 11px; background:#3a3018; border:1px solid #6b5525; color:#f4d488; border-radius:8px; cursor:pointer; font-family:inherit; }
.aiCodeLic:hover { background:#4a3a1c; }
.aiCodePre { margin:0; max-height:56vh; overflow:auto; background:#fbf4e6; color:#2a2116; font-family:Consolas,"Courier New",monospace; font-size:12.5px; line-height:1.55; padding:12px 14px; white-space:pre-wrap; word-break:break-word; }
.aiCodeTa { display:none; width:100%; min-height:52vh; box-sizing:border-box; background:#fbf4e6; color:#2a2116; border:0; outline:0; font-family:Consolas,"Courier New",monospace; font-size:12.5px; line-height:1.55; padding:12px 14px; resize:vertical; }
.aiCodeFoot { padding:12px 14px 0; display:flex; gap:10px; flex-wrap:wrap; }
.aiCodeTip { padding:8px 14px 12px; color:#99886a; font-size:12px; }
/* 上游输出撞 max_tokens：写出「已截断/已自动续写」的结论（只出现一次，放代码上方） */
.aiCodeWarn { margin:10px 14px 0; padding:9px 12px; background:#0f0c08; border:1px solid #6b5326; border-radius:8px; color:#efda9e; font-size:12px; line-height:1.65; }
.aiCodeOk { margin:10px 14px 0; padding:9px 12px; background:#1e2f22; border:1px solid #38683f; border-radius:8px; color:#9fd8a8; font-size:12px; line-height:1.65; }
.mq-c { color:#8a7d5c; font-style:italic; }
.mq-s { color:#b4543a; }
.mq-p { color:#a9752c; font-weight:600; }
.mq-k { color:#1f6fb2; font-weight:600; }
.mq-n { color:#7b4fd0; }
  /* 底部工具行 */
  .ad-tools { display:flex; gap:10px; padding:14px 22px; background:#15110a; border-top:1px solid rgba(224,176,84,.18); flex-wrap:wrap; align-items:center; }
  .ad-toolbtn { background:#1c170d; color:#f6ecd8; border:1px solid rgba(224,176,84,.26); border-radius:8px; padding:9px 15px; font-size:13px; cursor:pointer; }
  .ad-toolbtn:hover { border-color:#e0b054; }
  .ad-toolbtn.green { background:#2e9e5b; border-color:#2e9e5b; }
  .ad-toolbtn.gold { background:#6b5326; border-color:#b08a45; }
  .ad-toolbtn.line { background:transparent; border-color:rgba(224,176,84,.26); color:#c2b295; }
  .ad-range { display:flex; align-items:center; gap:8px; color:#99886a; font-size:12px; }
  .ad-range input { accent-color:#e0b054; }

/* ===== v1.07 站点内容：视频教程 / 微信二维码（内容设置页 + 顶栏弹窗）===== */
.site-vid-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid #1c170d; }
.site-vid-row:last-child { border-bottom:none; }
.site-ttl { flex:1; min-width:0; background:#0b0905; border:1px solid rgba(224,176,84,.26); border-radius:8px; color:#f6ecd8; padding:8px 10px; font-size:13px; }
.site-ttl:focus { outline:none; border-color:#e0b054; }
.site-tip { background:#0b0905; border:1px solid rgba(224,176,84,.26); border-radius:8px; color:#f6ecd8; padding:8px 10px; font-size:13px; width:220px; }
.site-tip:focus { outline:none; border-color:#e0b054; }
.site-qr-row { display:flex; gap:32px; flex-wrap:wrap; }
.site-qr-col { display:flex; flex-direction:column; align-items:flex-start; }
.site-qr-t { color:#e0b054; font-size:13px; margin-bottom:8px; }
.site-qr-img { width:180px; height:180px; object-fit:contain; background:#fff; border-radius:10px; border:1px solid rgba(224,176,84,.26); display:block; }
.site-qr-none { width:180px; height:180px; display:flex; align-items:center; justify-content:center; border:1px dashed rgba(224,176,84,.28); border-radius:10px; color:#8a7a5e; font-size:12px; }
.site-vid-item { margin-bottom:16px; }
.site-vid-t { color:#fbf3e4; font-size:13px; margin-bottom:6px; }
.site-vid { width:100%; max-width:520px; background:#000; border-radius:10px; border:1px solid rgba(224,176,84,.26); display:block; }
.site-vid-m { color:#8a7a5e; font-size:12px; margin-top:4px; }
.ad-ct-qr { text-align:center; padding:6px 0 12px; }
.ad-ct-qr img { width:190px; height:190px; object-fit:contain; background:#fff; border-radius:10px; border:1px solid rgba(224,176,84,.26); }
.ad-ct-qr-t { color:#e0b054; font-size:13px; margin-top:8px; }
.ad-ct-tip { color:#99886a; font-size:12px; margin-top:4px; }
/* ★v3.04：客服弹窗里并排显示多张二维码（微信 / QQ / 飞机）——
   两张及以上才套这个容器、缩到 140px（520px 宽的弹窗里三张也放得下）；
   只有一张时不套容器，仍是原来 190px 的大图（不用 :has()，老浏览器一样正常）。 */
.ad-ct-qrs { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.ad-ct-qrs .ad-ct-qr { width:148px; }                 /* 三张并排：148×3 + 12×2 = 468 < 520 弹窗 */
.ad-ct-qrs .ad-ct-qr img { width:140px; height:140px; }
.ad-ct-qrs .ad-ct-qr-t { font-size:12px; line-height:1.5; }
.ad-ct-qrs .ad-ct-tip { font-size:11.5px; }
