/**
 * 首页 AI 问答助手 UI
 */
/* ===== AI 问答助手 ===== */
    .ai-assistant {
      position: fixed;
      right: 24px;
      bottom: 10vh;
      z-index: 999;
      display: flex;
      align-items: center;
      gap: 12px;
      flex-direction: row-reverse;
    }
    /* 总闸关闭：隐藏入口与抽屉壳 */
    .ai-assistant[hidden],
    .ai-overlay[hidden],
    .ai-drawer[hidden] {
      display: none !important;
    }
    .ai-assistant-hint {
      position: relative;
      background: rgba(26, 26, 26, 0.95);
      border: 1px solid rgba(201, 169, 110, 0.35);
      color: #fff;
      padding: 10px 16px;
      border-radius: 12px;
      font-size: 13.65px;
      white-space: nowrap;
      opacity: 0;
      transform: translateX(12px);
      transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
      pointer-events: none;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
    }
    .ai-assistant-hint::after {
      content: '';
      position: absolute;
      right: -6px;
      top: 50%;
      transform: translateY(-50%);
      border-width: 6px 0 6px 6px;
      border-style: solid;
      border-color: transparent transparent transparent rgba(26, 26, 26, 0.95);
    }
    .ai-assistant:hover .ai-assistant-hint,
    .ai-assistant.show-hint .ai-assistant-hint {
      opacity: 1;
      transform: translateX(0);
    }
    .ai-assistant-btn {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: linear-gradient(145deg, #c9a96e, #a0854a);
      border: none;
      cursor: pointer;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 8px 28px rgba(201, 169, 110, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.08) inset;
      transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
    }
    .ai-assistant-btn:hover {
      transform: scale(1.08);
      box-shadow: 0 12px 36px rgba(201, 169, 110, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.12) inset;
    }
    .ai-assistant-btn:active {
      transform: scale(0.96);
    }
    .ai-assistant-btn svg {
      width: 34px;
      height: 34px;
      color: #0a0a0a;
    }
    .ai-assistant-ring {
      position: absolute;
      inset: -8px;
      border-radius: 50%;
      border: 1.5px solid rgba(201, 169, 110, 0.45);
      animation: ai-ring 2.4s ease-out 3 forwards;
    }
    .ai-assistant-ring:nth-child(2) { animation-delay: 0.8s; }
    .ai-assistant-ring:nth-child(3) { animation-delay: 1.6s; }
    @keyframes ai-ring {
      0% { transform: scale(0.85); opacity: 0.7; }
      100% { transform: scale(1.35); opacity: 0; }
    }
    .ai-eye {
      animation: ai-blink 3.6s 2 forwards;
      transform-origin: center;
    }
    @keyframes ai-blink {
      0%, 45%, 55%, 100% { transform: scaleY(1); }
      50% { transform: scaleY(0.15); }
    }
    .ai-wave {
      animation: ai-wave 2s ease-in-out 3 forwards;
    }
    @keyframes ai-wave {
      0%, 100% { opacity: 0.4; transform: scale(0.95); }
      50% { opacity: 1; transform: scale(1.05); }
    }

    @media (prefers-reduced-motion: reduce) {
      .ai-assistant-ring,
      .ai-eye,
      .ai-wave {
        animation: none;
      }
    }

    .ai-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.65);
      backdrop-filter: blur(4px);
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      z-index: 1000;
    }
    .ai-overlay.active {
      opacity: 1;
      visibility: visible;
    }
    .ai-drawer {
      position: fixed;
      top: 0;
      right: 0;
      width: 100%;
      max-width: 720px;
      height: 100%;
      background: linear-gradient(180deg, #111111 0%, #0a0a0a 100%);
      border-left: 1px solid rgba(201, 169, 110, 0.18);
      box-shadow: -20px 0 60px rgba(0, 0, 0, 0.55);
      transform: translateX(100%);
      transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
      z-index: 1001;
      display: flex;
      flex-direction: column;
    }
    .ai-drawer.active {
      transform: translateX(0);
    }
    .ai-drawer-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 24px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.06);
      flex-shrink: 0;
    }
    .ai-drawer-title {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .ai-drawer-title svg {
      width: 32px;
      height: 32px;
      color: #c9a96e;
    }
    .ai-drawer-title h3 {
      font-size: 17.85px;
      font-weight: 500;
      color: #fff;
      margin: 0;
    }
    .ai-drawer-title span {
      font-size: 12.6px;
      color: rgba(255, 255, 255, 0.45);
      font-weight: 400;
    }
    .ai-drawer-close {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(255, 255, 255, 0.65);
      background: rgba(255, 255, 255, 0.05);
      transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
      cursor: pointer;
    }
    .ai-drawer-close:hover {
      background: rgba(255, 255, 255, 0.1);
      color: #fff;
      transform: rotate(90deg);
    }
    .ai-drawer-body {
      flex: 1;
      overflow-y: auto;
      padding: 20px 24px;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .ai-welcome {
      background: rgba(201, 169, 110, 0.08);
      border: 1px solid rgba(201, 169, 110, 0.15);
      border-radius: 16px;
      padding: 18px;
    }
    .ai-welcome h4 {
      color: #c9a96e;
      font-size: 14.7px;
      margin: 0 0 8px;
      font-weight: 500;
    }
    .ai-welcome p {
      color: rgba(255, 255, 255, 0.7);
      font-size: 13.65px;
      line-height: 1.7;
      margin: 0;
    }
    .ai-message {
      display: flex;
      gap: 10px;
      max-width: 88%;
      animation: ai-msg-in 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    @keyframes ai-msg-in {
      from { opacity: 0; transform: translateY(10px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .ai-message.user {
      align-self: flex-end;
      flex-direction: row-reverse;
      max-width: 85%;
    }
    .ai-message-avatar {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .ai-message.assistant .ai-message-avatar {
      background: rgba(201, 169, 110, 0.12);
      color: #c9a96e;
    }
    .ai-message.user .ai-message-avatar {
      background: #c9a96e;
      color: #0a0a0a;
    }
    .ai-message-avatar svg {
      width: 16px;
      height: 16px;
    }
    .ai-message-content {
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 14px 14px 14px 4px;
      padding: 12px 14px;
      color: rgba(255, 255, 255, 0.9);
      font-size: 14.7px;
      line-height: 1.65;
      word-break: break-word;
    }
    .ai-message.user .ai-message-content {
      background: rgba(201, 169, 110, 0.14);
      border-color: rgba(201, 169, 110, 0.22);
      border-radius: 14px 14px 4px 14px;
      color: #fff;
    }
    /* 助手 Markdown 气泡 */
    .ai-message-content.ai-markdown > :first-child { margin-top: 0; }
    .ai-message-content.ai-markdown > :last-child { margin-bottom: 0; }
    .ai-message-content.ai-markdown p { margin: 0 0 0.65em; }
    .ai-message-content.ai-markdown p:last-child { margin-bottom: 0; }
    .ai-message-content.ai-markdown h1,
    .ai-message-content.ai-markdown h2,
    .ai-message-content.ai-markdown h3,
    .ai-message-content.ai-markdown h4 {
      margin: 0.85em 0 0.45em;
      font-weight: 600;
      line-height: 1.35;
      color: #fff;
    }
    .ai-message-content.ai-markdown h1:first-child,
    .ai-message-content.ai-markdown h2:first-child,
    .ai-message-content.ai-markdown h3:first-child { margin-top: 0; }
    .ai-message-content.ai-markdown h1 { font-size: 1.15em; }
    .ai-message-content.ai-markdown h2 { font-size: 1.08em; }
    .ai-message-content.ai-markdown h3 { font-size: 1em; }
    .ai-message-content.ai-markdown ul,
    .ai-message-content.ai-markdown ol {
      margin: 0.35em 0 0.65em;
      padding-left: 1.25em;
    }
    .ai-message-content.ai-markdown li { margin: 0.2em 0; }
    .ai-message-content.ai-markdown li > p { margin: 0; }
    .ai-message-content.ai-markdown blockquote {
      margin: 0.5em 0;
      padding: 0.35em 0.75em;
      border-left: 3px solid rgba(201, 169, 110, 0.55);
      color: rgba(255, 255, 255, 0.78);
      background: rgba(255, 255, 255, 0.03);
      border-radius: 0 8px 8px 0;
    }
    .ai-message-content.ai-markdown code {
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 0.92em;
      padding: 0.12em 0.35em;
      border-radius: 5px;
      background: rgba(0, 0, 0, 0.35);
      color: #f0d9a8;
    }
    .ai-message-content.ai-markdown pre {
      margin: 0.55em 0;
      padding: 10px 12px;
      border-radius: 10px;
      background: rgba(0, 0, 0, 0.42);
      border: 1px solid rgba(255, 255, 255, 0.08);
      overflow-x: auto;
    }
    .ai-message-content.ai-markdown pre code {
      padding: 0;
      background: transparent;
      color: rgba(255, 255, 255, 0.92);
      font-size: 0.88em;
      line-height: 1.55;
    }
    .ai-message-content.ai-markdown a {
      color: #e8c98a;
      text-decoration: underline;
      text-underline-offset: 2px;
    }
    .ai-message-content.ai-markdown a:hover { color: #f5ddb0; }
    .ai-message-content.ai-markdown table {
      width: 100%;
      border-collapse: collapse;
      margin: 0.55em 0;
      font-size: 0.92em;
    }
    .ai-message-content.ai-markdown th,
    .ai-message-content.ai-markdown td {
      border: 1px solid rgba(255, 255, 255, 0.12);
      padding: 6px 8px;
      text-align: left;
    }
    .ai-message-content.ai-markdown th {
      background: rgba(255, 255, 255, 0.06);
      font-weight: 600;
    }
    .ai-message-content.ai-markdown hr {
      border: none;
      border-top: 1px solid rgba(255, 255, 255, 0.12);
      margin: 0.75em 0;
    }
    .ai-typing {
      display: flex;
      align-items: center;
      gap: 4px;
      padding: 14px;
    }
    .ai-typing span {
      width: 7px;
      height: 7px;
      background: #c9a96e;
      border-radius: 50%;
      animation: ai-typing 1.2s infinite ease-in-out;
    }
    .ai-typing span:nth-child(2) { animation-delay: 0.15s; }
    .ai-typing span:nth-child(3) { animation-delay: 0.3s; }
    @keyframes ai-typing {
      0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
      30% { transform: translateY(-5px); opacity: 1; }
    }
    .ai-drawer-footer {
      padding: 16px 24px 24px;
      border-top: 1px solid rgba(255, 255, 255, 0.06);
      flex-shrink: 0;
    }
    .ai-input-wrap {
      display: flex;
      gap: 10px;
      background: rgba(255, 255, 255, 0.05);
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 14px;
      padding: 6px 6px 6px 14px;
      transition: border-color 0.2s ease;
    }
    .ai-input-wrap:focus-within {
      border-color: rgba(201, 169, 110, 0.4);
    }
    .ai-input {
      flex: 1;
      background: transparent;
      border: none;
      color: #fff;
      font-size: 14.7px;
      outline: none;
      resize: none;
      min-height: 22px;
      max-height: 90px;
      line-height: 1.5;
      font-family: inherit;
    }
    .ai-input::placeholder { color: rgba(255, 255, 255, 0.35); }
    .ai-send {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      background: #c9a96e;
      color: #0a0a0a;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: background 0.2s ease, opacity 0.2s ease;
      cursor: pointer;
    }
    .ai-send:hover:not(:disabled) { background: #d4b87a; }
    .ai-send:disabled { opacity: 0.5; cursor: not-allowed; }
    .ai-send svg { width: 18px; height: 18px; }
    .ai-error {
      color: #ff7b7b;
      font-size: 12.6px;
      margin-top: 8px;
      padding-left: 4px;
    }

@media (max-width: 520px) {
      .ai-assistant { right: 16px; bottom: 10vh; }
      .ai-assistant-btn { width: 56px; height: 56px; }
      .ai-assistant-btn svg { width: 30px; height: 30px; }
      .ai-assistant-hint { display: none; }
      .ai-drawer { max-width: 100%; }
    }