/* ===== assets/css/06-ai-panels.css | 浮动按钮与助手 / 内嵌视图 / 历史与文档弹窗 / 需求确认单 / 思考遮罩 ===== */
/* 来源：原 index.html 内联样式 第 290-357 行；改样式只改这个文件 */
  /* 两侧浮动标签 */
  /* 右侧两个浮动标签：用 flex 列容器统一定位，标签高度变化也不会互相重叠 */
  /* 右下机器人 / 左下助手 */
  .ad-bot { position:fixed; right:22px; bottom:22px; width:56px; height:56px; border-radius:50%; background:linear-gradient(135deg,#e0b054,#a9752c); color:#fff; display:flex; align-items:center; justify-content:center; font-size:26px; cursor:pointer; z-index:20; box-shadow:0 6px 20px rgba(0,0,0,.5); }
  .ad-bot:hover { background:linear-gradient(135deg,#e6bc7f,#bd8439); }
  .ad-assistant { position:fixed; left:22px; bottom:22px; width:320px; background:#181309; border:1px solid rgba(224,176,84,.26); border-radius:14px; overflow:hidden; z-index:20; box-shadow:0 10px 30px rgba(0,0,0,.6); display:none; }
  .ad-assistant .ast-head { background:#7a2f22; color:#fff; padding:10px 14px; font-size:14px; display:flex; align-items:center; justify-content:space-between; }
  .ad-assistant .ast-body { padding:14px; font-size:13px; color:#c3b190; height:180px; overflow:auto; }
.vp-ben{display:inline-block; background:rgba(224,176,84,.14); color:#e0b054; border:1px solid rgba(224,176,84,.4); border-radius:20px; padding:6px 16px; font-size:13px; font-weight:600; white-space:nowrap;}
  /* ===== 后台视图内嵌：外壳顶栏常驻，内容区原地切换（不跳页）===== */
  #app { display:none; }
  #app > .topbar, #app > .tabs { display:none; }            /* 统一用外壳顶栏，避免两套导航 */
  .ad-console.show-app > .ad-body,
  .ad-console.show-app > .ad-tools,
  .ad-console.show-app > .ad-bot,
  .ad-console.show-app > .ad-assistant { display:none !important; }
  .ad-console.show-app > #app { display:block !important; flex:1 1 auto; min-height:0; overflow:auto; }

/* ===== AI 工作台：历史记录 / 指令文档 / 图片 弹窗 ===== */
.ad-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,.62); align-items:center; justify-content:center; z-index:30; }
.ad-modal-box { width:800px; max-width:94vw; max-height:86vh; background:#15110a; border:1px solid rgba(224,176,84,.18); border-radius:12px; display:flex; flex-direction:column; overflow:hidden; }
.ad-modal-head { display:flex; align-items:center; justify-content:space-between; padding:15px 20px; border-bottom:1px solid rgba(224,176,84,.18); }
.ad-modal-head h3 { margin:0; font-size:15px; color:#f6ecd8; }
.ad-modal-head .x { cursor:pointer; color:#99886a; font-size:22px; line-height:1; }
.ad-modal-head .x:hover { color:#e0b054; }
.ad-modal-body { padding:16px 20px; overflow:auto; flex:1; }
.ad-modal-foot { padding:12px 20px; border-top:1px solid rgba(224,176,84,.18); display:flex; gap:10px; align-items:center; }
/* ===== 需求确认单（对齐同事站：浅绿外框 + 米色内容区，内容是可核对的纯中文需求）===== */
.ad-modal-box.plan { background:#eef8f0; border:1px solid #86c99c; }
.ad-modal-box.plan .ad-modal-head { border-bottom:1px solid #b9dfc5; }
.ad-modal-box.plan .ad-modal-head h3 { color:#1f3b28; font-size:14.5px; }
.ad-modal-box.plan .ad-modal-head .x { color:#5d7a66; }
.ad-modal-box.plan .ad-modal-head .x:hover { color:#1f3b28; }
.ad-modal-box.plan .ad-modal-foot { border-top:1px solid #b9dfc5; }
.plan-body { background:#fbf4e6; color:#1d160d; border-radius:9px; padding:14px 16px; font-size:13.5px; line-height:1.85; max-height:46vh; overflow:auto; }
.plan-body .ph { display:block; margin:14px 0 6px; font-weight:800; color:#1d5c33; font-size:14px; }
.plan-body .ph:first-child { margin-top:0; }
.plan-body .li { margin:2px 0; }
.plan-qt { font-size:12.5px; color:#26543a; font-weight:700; }
.plan-ta { width:100%; min-height:72px; margin-top:7px; background:#fff; border:1px solid #b9dfc5; border-radius:8px; color:#1d160d; padding:9px 11px; font-size:13px; outline:none; resize:vertical; }
.plan-tip { font-size:12px; color:#4c6b56; }
/* 补充问答确认：逐题选择题（A/B/C/D）+「补充」「跳过」 */
.plan-qlist { display:flex; flex-direction:column; gap:9px; margin-top:7px; }
.plan-q { background:#fff; border:1px solid #cfe6d7; border-radius:8px; padding:9px 10px; }
.plan-q.answered { border-color:#79c79a; }
.plan-q.skipped { opacity:.5; }
.plan-q-t { font-size:13px; color:#1d160d; font-weight:700; line-height:1.65; }
.plan-q-opts { display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.plan-q-opt { background:#f4faf6; border:1px solid #b9dfc5; color:#26543a; border-radius:7px; padding:5px 9px; font-size:12.5px; line-height:1.5; text-align:left; cursor:pointer; }
.plan-q-opt:hover { background:#e9f6ee; }
.plan-q-opt.on { background:#1d7a42; border-color:#1d7a42; color:#fff; }
.plan-q-opt.on b { color:#fff; }
.plan-q-acts { display:flex; gap:6px; align-items:center; margin-top:7px; }
.plan-q-mini { background:#fff; border:1px solid #cfd8d2; color:#4c6b56; border-radius:6px; padding:3px 10px; font-size:12px; cursor:pointer; }
.plan-q-mini:hover { background:#f1f6f3; }
.plan-q-mini.on { border-color:#1d7a42; color:#1d7a42; font-weight:700; }
.plan-q-inp { display:none; width:100%; margin-top:6px; background:#fff; border:1px solid #b9dfc5; border-radius:7px; color:#1d160d; padding:6px 8px; font-size:12.5px; }
.plan-qsum { font-size:12px; color:#4c6b56; margin-top:7px; }
.ad-toolbtn.blue { background:#1d3a5c; border-color:#2f5b8c; color:#cfe4ff; }
/* ===== AI 生成中：全屏「AI 正在思考」遮罩（写完才完整显示结果）===== */
#aiThink { display:none; position:fixed; inset:0; background:#110e09; z-index:70; flex-direction:column; align-items:center; justify-content:center; }
#aiThink.on { display:flex; }
#aiThink .at-top { position:absolute; top:22px; left:0; right:0; text-align:center; color:#8a7a5e; font-size:13px; letter-spacing:1px; }
/* ★v2.26：动图换成用户提供的矩阵雨 GIF（本站本地文件，不依赖外网）。
   原来那圈"AI 头/眼睛/扫描线"的 SVG 环形装饰会被动图完全盖住，一并去掉，只留动图本身。 */
/* ★v2.28：动图按原图比例（860×480 ≈ 1.79:1）给框，并用 object-fit:contain —— 保证**整图显示**、不裁切不变形 */
#aiThink .at-orb { position:relative; width:660px; height:368px; margin-bottom:26px; }
#aiThink .at-main { color:#f6ecd8; font-size:15px; letter-spacing:2px; margin-bottom:30px; }
#aiThink .at-main .dot { color:#e0b054; animation:atBlink 1.4s ease-in-out infinite; }
@keyframes atBlink { 0%,100% { opacity:.25; } 50% { opacity:1; } }
#aiThink .at-sub { color:#99886a; font-size:13px; }
#aiThink .at-cnt { color:#e0b054; font-size:12px; margin-top:12px; letter-spacing:1px; min-height:16px; }

/* ★v2.26：「AI 正在处理」动图 = 用户提供的 GIF（assets/img/ai-think.gif）。
   外面再叠一层呼吸 + 流光，让"一直在跑"看得出来；生成时亮出，写完才给完整源码。 */
#aiThink .at-fig { position:absolute; inset:0; animation:atFloat 4.6s ease-in-out infinite; }
#aiThink .at-gif { width:100%; height:100%; display:block; border-radius:12px; object-fit:contain;
  box-shadow:0 0 0 1px rgba(126,231,167,.35), 0 0 38px rgba(90,220,140,.30), 0 10px 30px rgba(0,0,0,.55);
  animation:atGifBreathe 3.6s ease-in-out infinite; }
#aiThink .at-sheen { position:absolute; inset:0; border-radius:12px; pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,0) 38%,rgba(126,231,167,.10));
  animation:atSheen 3.2s ease-in-out infinite; }
@keyframes atFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@keyframes atGifBreathe { 0%,100% { filter:saturate(1) brightness(.94); } 50% { filter:saturate(1.15) brightness(1.12); } }
@keyframes atSheen { 0%,100% { opacity:.30; } 50% { opacity:.85; } }
/* ★v2.26：遮罩改 GIF 之后，下面三个关键帧仍被「状态条上的迷你 AI 图标」（05-ai.css 的 .ai-mini）使用，不能删 */
@keyframes atEyeBlink { 0%,92%,100% { transform:scaleY(1); } 96% { transform:scaleY(.12); } }
@keyframes atScanMove { 0% { transform:translateY(0); opacity:0; } 12% { opacity:.95; } 88% { opacity:.95; } 100% { transform:translateY(58px); opacity:0; } }
@keyframes atLedPulse { 0%,100% { opacity:.35; } 50% { opacity:1; } }
#aiThink .at-sub { max-width:660px; text-align:center; line-height:1.95; padding:0 20px; }
#aiThink .at-sub b { color:#efce93; }
/* ★v2.27：结果区改成只播动图后，"慢就走云端"这句挪到遮罩上（生成时正好看得见） */
#aiThink .at-tip { color:#8a7a5e; font-size:12px; margin-top:10px; letter-spacing:.5px; }
/* ★v2.27：AI 生成期间「结果区」只显示这张动图（用户口径：「在编写的时候，这里只显示那个动图」）
   写完一次性换成完整源码；等待时长/中止说明等文字都在全屏遮罩上，不在这儿铺字。 */
/* ★v2.32：现在要**铺满整个结果区**（用户口径：「动态图片需要显示整个红色框」）——
   外层的 .ad-body2 在生成期间去掉内边距，动图按 100% 宽高填满（object-fit:cover，比例接近不裁内容）。 */
.ad-body2.ai-gen-on { padding:0 !important; }
.ad-body2.ai-gen-on #aiResult { height:100%; }
.ai-gen-anim { display:flex; align-items:center; justify-content:center; width:100%;
  height:100%; min-height:clamp(300px, calc(100vh - 300px), 980px); padding:0; }
.ai-gen-anim img { width:100%; height:100%; display:block; border-radius:0; object-fit:cover;
  box-shadow:0 0 0 1px rgba(126,231,167,.30), 0 0 30px rgba(90,220,140,.25), 0 10px 26px rgba(0,0,0,.5);
  animation:atGifBreathe 3.6s ease-in-out infinite; }
/* 进度扫描条：让「在动」看得出来 */
#aiThink .at-bar { position:relative; width:320px; height:3px; margin:20px 0 0; border-radius:3px; background:rgba(224,176,84,.14); overflow:hidden; }
#aiThink .at-bar::after { content:""; position:absolute; top:0; left:-40%; width:40%; height:100%; border-radius:3px; background:linear-gradient(90deg,rgba(224,176,84,0),#efce93,rgba(224,176,84,0)); animation:atSweep 1.5s linear infinite; }
@keyframes atSweep { 0% { left:-40%; } 100% { left:100%; } }
/* 实时尾巴：看得见确实在写；完整源码仍是写完才一次性交付 */
#aiThink .at-peek { max-width:680px; max-height:96px; overflow:hidden; margin:16px 0 0; padding:0 0 0 14px; border-left:2px solid rgba(224,176,84,.22); color:#8a7a5e; font-size:11.5px; line-height:1.75; text-align:left; white-space:pre-wrap; word-break:break-all; font-family:ui-monospace,Consolas,monospace; }
