/* ⚠ 转换警告 ════════════════════════════════════════
   8 处游离 .bg-gray-100\/90 已按通用气泡处理
═══════════════════════════════════════════════════ */

/* ═══ B平台加载动画适配（自动注入）═══ */
.flex.items-center.justify-center.size-6 { opacity: 1 !important; }
.flex.items-center.justify-center.size-6 > .flex.gap-2 { display: none !important; }
.is-assistant.w-fit { width: 100% !important; background: transparent !important; }
.is-assistant > .border.border-muted:has(.flex.items-center.justify-center.size-6) {
  width: 100% !important; background: #0a0812 !important;
  border: none !important; padding: 0 !important;
}
.is-assistant .space-y-3:has(.flex.items-center.justify-center.size-6) {
  display: flex; justify-content: center; width: 100%;
}

/* ═══ B平台按钮组保护（自动注入 — 防止按钮消失）═══ */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5,
.is-user .bg-muted.rounded.flex.p-0\.5,
.is-assistant .bg-muted.rounded.flex.p-0\.5 {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  position: relative !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
  clip: auto !important;
  clip-path: none !important;
}
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5 > button,
.is-user .bg-muted.rounded.flex.p-0\.5 > button,
.is-assistant .bg-muted.rounded.flex.p-0\.5 > button {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  clip: auto !important;
  clip-path: none !important;
}
.flex.items-center.gap-1.ml-auto.md\:opacity-0.group-hover\:opacity-100 {
  visibility: visible !important;
  display: flex !important;
  pointer-events: auto !important;
  overflow: visible !important;
}
.flex.w-full.items-center.justify-between.gap-2.px-2 {
  display: flex !important;
  visibility: visible !important;
  overflow: visible !important;
}

/* =============================================
 * 堕界食徒 — 赛克斯深渊美食终端 CSS v4.1
 * =============================================
 * 核心隐喻：一台位于市区圈与沉沦圈交界处假面酒馆地下室的
 * 非法终端，被前铁砧工程师改装，被假面侍者重新装饰。
 * 80% 终端 + 20% 有机 — 冰冷机械被料理烟火气悄然侵蚀。
 *
 * 主题色轴：深渊粉 #ff3c8e / 触手紫 #a855f7 / 机械青 #06b6d4 / 灶火琥珀 #f59e0b
 * 底色：深渊黑 #050509 → 更深的 #030308
 *
 * v4.1 变更：气泡背景改为不透明深渊色，修复加载时白色闪屏
 * =============================================
 */

/*
 * ---------------------------------
 *   全局变量定义 — 深渊终端色彩系统 v4
 * ---------------------------------
 */

:root {
    /* — 基底色系 — */
    --fc-bg-abyss: #030308;
    --fc-bg-card: rgba(18, 15, 28, 0.88);
    --fc-bg-card-hover: rgba(26, 21, 40, 0.94);
    --fc-border-subtle: rgba(255, 255, 255, 0.06);
    --fc-border-glow: rgba(168, 85, 247, 0.40);

    /* — 文字色系 — */
    --fc-text-primary: #f0edf5;
    --fc-text-secondary: #a5a0b8;
    --fc-text-dim: #635f72;

    /* — 主强调色 — */
    --fc-accent-pink: #ff3c8e;
    --fc-accent-purple: #a855f7;
    --fc-accent-blue: #3b82f6;
    --fc-accent-cyan: #06b6d4;
    --fc-accent-red: #ef4444;
    --fc-accent-amber: #f59e0b;
    --fc-accent-green: #10b981;
    --fc-accent-gold: #d97706;
    --fc-accent-orange: #f97316;

    /* — 主渐变 — */
    --fc-gradient-main: linear-gradient(135deg, #ff3c8e, #a855f7, #3b82f6);
    --fc-gradient-bio: linear-gradient(135deg, #a855f7, #ff3c8e, #ef4444);
    --fc-gradient-mech: linear-gradient(135deg, #3b82f6, #06b6d4);
    --fc-gradient-gold: linear-gradient(135deg, #d97706, #f97316, #d97706);

    /* — 六司专属色谱 — */
    --co-omega-bg: rgba(45, 10, 58, 0.6);
    --co-omega-accent: #c026d3;
    --co-omega-glow: 0 0 20px rgba(192, 38, 211, 0.35);
    --co-venus-bg: rgba(45, 26, 46, 0.6);
    --co-venus-accent: #f472b6;
    --co-venus-glow: 0 0 20px rgba(244, 114, 182, 0.35);
    --co-anvil-bg: rgba(26, 26, 30, 0.6);
    --co-anvil-accent: #f97316;
    --co-anvil-glow: 0 0 20px rgba(249, 115, 22, 0.35);
    --co-stigmata-bg: rgba(28, 28, 36, 0.6);
    --co-stigmata-accent: #e2e8f0;
    --co-stigmata-glow: 0 0 20px rgba(226, 232, 240, 0.25);
    --co-nectar-bg: rgba(30, 24, 20, 0.6);
    --co-nectar-accent: #fbbf24;
    --co-nectar-glow: 0 0 20px rgba(251, 191, 36, 0.3);
    --co-evernight-bg: rgba(13, 13, 13, 0.6);
    --co-evernight-accent: #b45309;
    --co-evernight-glow: 0 0 20px rgba(180, 83, 9, 0.3);

    /* — 料理/氛围色 — */
    --fc-warm-ember: #fbbf24;
    --fc-steam-white: rgba(255, 255, 255, 0.06);
    --fc-signal-glitch: #06b6d4;
    --fc-flat-surface: #e8e6f0;
    --fc-flat-undercurrent: rgba(239, 68, 68, 0.12);

    /* — 语义化渐变 — */
    --fc-gradient-cook: linear-gradient(135deg, #f59e0b, #ef4444, #a855f7);
    --fc-gradient-danger: linear-gradient(135deg, #dc2626, #ef4444, #f97316);
    --fc-gradient-discovery: linear-gradient(135deg, #22c55e, #f59e0b, #fbbf24);
    --fc-gradient-neutral: linear-gradient(135deg, #6b7280, #9ca3af, #d4d4d8);

    /* — 字体 — */
    --fc-font-main: "Noto Sans SC", "Microsoft YaHei", sans-serif;
    --fc-font-terminal: "Orbitron", "Courier New", monospace;

    /* — 发光预设 — */
    --fc-glow-pink: 0 0 18px rgba(255, 60, 142, 0.30);
    --fc-glow-purple: 0 0 18px rgba(168, 85, 247, 0.30);
    --fc-glow-cyan: 0 0 18px rgba(6, 182, 212, 0.30);
    --fc-glow-red: 0 0 18px rgba(239, 68, 68, 0.35);
    --fc-glow-amber: 0 0 18px rgba(245, 158, 11, 0.25);
    --fc-glow-green: 0 0 18px rgba(16, 185, 129, 0.25);
}

/*
 * ---------------------------------
 *   模块一：AI对话气泡 — 深渊触须浮层
 * ---------------------------------
 */

/* 气泡容器 — 不透明深渊底色（修复白色闪屏） */
.group .is-user > .border.border-muted,
.is-assistant > .border.border-muted {
    background:
        /* — CRT扫描线 — */
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 3px,
            rgba(255, 255, 255, 0.006) 3px,
            rgba(255, 255, 255, 0.006) 6px
        ),
        /* — 灶火微光：底部极淡暖色渐变 — */
        radial-gradient(
            ellipse at 95% 98%,
            rgba(245, 158, 11, 0.04) 0%,
            transparent 60%
        ),
        /* — 主体深渊底 — 完全不透明 — */
        linear-gradient(
            180deg,
            #14121e 0%,
            #0a0812 100%
        ) !important;

    /* — 双线触须边框 — */
    border: 1px solid var(--fc-border-subtle) !important;
    border-left: 3px solid var(--fc-accent-purple) !important;
    border-radius: 2px 14px 14px 2px !important;

    /* — 增强阴影：多层深度 — */
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.5),
        0 0 40px rgba(168, 85, 247, 0.04),
        inset 0 0 30px rgba(168, 85, 247, 0.03),
        inset 0 1px 0 rgba(255, 255, 255, 0.02),
        inset 4px 0 0 rgba(255, 60, 142, 0.08) !important;

    color: var(--fc-text-primary) !important;
    padding: 20px !important;
    text-shadow: 0 0 1px rgba(240, 237, 245, 0.08) !important;
    position: relative !important;
    overflow: hidden !important;
    transition: border-color 0.4s ease, box-shadow 0.4s ease !important;

    /* — 强制不透明底色兜底 — */
    background-color: #0a0812 !important;
}

/* 顶部渐变光线 — 三色增强版 */
.is-assistant > .border.border-muted::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent 0%,
        var(--fc-accent-pink) 15%,
        var(--fc-accent-purple) 40%,
        var(--fc-accent-cyan) 65%,
        var(--fc-accent-amber) 85%,
        transparent 100%
    ) !important;
    opacity: 0.6 !important;
    z-index: 2 !important;
}

/* 右上角信号强度指示器 — 三颗递减光点 */
.is-assistant > .border.border-muted::after {
    content: "" !important;
    position: absolute !important;
    top: 8px !important;
    right: 10px !important;
    width: 18px !important;
    height: 3px !important;
    background:
        radial-gradient(circle at 2px 1.5px, var(--fc-accent-purple) 1.5px, transparent 1.5px),
        radial-gradient(circle at 9px 1.5px, rgba(168,85,247,0.5) 1.2px, transparent 1.2px),
        radial-gradient(circle at 16px 1.5px, rgba(168,85,247,0.2) 0.8px, transparent 0.8px)
    !important;
    opacity: 0.5 !important;
    z-index: 2 !important;
    pointer-events: none !important;
}

/* 气泡加载态 — 强制深渊底色（防止白色闪屏） */
.is-assistant > .border.border-muted:has(.flex.items-center.justify-center.size-6) {
    background: #0a0812 !important;
    background-color: #0a0812 !important;
    border: 1px solid var(--fc-border-subtle) !important;
    border-left: 3px solid var(--fc-accent-purple) !important;
    border-radius: 2px 14px 14px 2px !important;
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.5),
        0 0 40px rgba(168, 85, 247, 0.04),
        inset 0 0 30px rgba(168, 85, 247, 0.03) !important;
    min-height: 120px !important;
}

/*
 * ---------------------------------
 *   模块二：状态面板 — 六司色谱信息卡
 * ---------------------------------
 */

details.status-box {
    background: var(--fc-bg-card) !important;
    border: 1px solid var(--fc-border-subtle) !important;
    border-left: 4px solid var(--fc-accent-purple) !important;
    border-radius: 2px 10px 10px 2px !important;
    padding: 0 !important;
    margin: 16px 0 !important;
    box-shadow:
        0 2px 16px rgba(0, 0, 0, 0.35),
        inset 0 0 25px rgba(168, 85, 247, 0.02) !important;
    transition: border-color 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease !important;
    overflow: hidden !important;
    position: relative !important;
}

details.status-box::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    height: 2px !important;
    width: 100% !important;
    background: linear-gradient(90deg,
        var(--fc-accent-purple) 0%,
        var(--fc-accent-pink) 50%,
        var(--fc-accent-cyan) 100%
    ) !important;
    opacity: 0.5 !important;
    z-index: 1 !important;
}

details.status-box[open] {
    border-left-color: var(--fc-accent-pink) !important;
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.45),
        0 0 20px rgba(255, 60, 142, 0.08),
        inset 0 0 30px rgba(255, 60, 142, 0.03) !important;
}

details.status-box:hover {
    background: var(--fc-bg-card-hover) !important;
    border-color: var(--fc-border-glow) !important;
    border-left-color: var(--fc-accent-purple) !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.45),
        0 0 16px rgba(168, 85, 247, 0.10) !important;
}

details.status-box > summary.status-summary {
    font-family: var(--fc-font-main) !important;
    color: var(--fc-text-primary) !important;
    font-size: 0.95em !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    padding: 13px 18px !important;
    margin: 0 !important;
    background: linear-gradient(180deg,
        rgba(255, 255, 255, 0.025) 0%,
        transparent 100%
    ) !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.3s ease !important;
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

details.status-box > summary.status-summary::-webkit-details-marker { display: none !important; }
details.status-box > summary.status-summary::marker { content: "" !important; }

details.status-box > summary.status-summary::before {
    content: "▶" !important;
    font-family: var(--fc-font-terminal) !important;
    font-size: 0.65em !important;
    color: var(--fc-accent-purple) !important;
    transition: transform 0.35s ease, color 0.35s ease !important;
    display: inline-block !important;
    width: 14px !important;
    flex-shrink: 0 !important;
}

details.status-box[open] > summary.status-summary::before {
    transform: rotate(90deg) !important;
    color: var(--fc-accent-pink) !important;
}

details.status-box[open] > summary.status-summary {
    border-bottom: 1px solid rgba(168, 85, 247, 0.18) !important;
}

details.status-box > summary.status-summary h1 {
    font-family: var(--fc-font-main) !important;
    font-size: 0.92em !important;
    font-weight: 700 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    color: var(--fc-text-primary) !important;
    letter-spacing: 0.6px !important;
    line-height: 1.4 !important;
}

details.status-box > summary.status-summary h1 span {
    background: var(--fc-gradient-main) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

details.status-box .status-details {
    padding: 14px 18px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

details.status-box .status-details p {
    font-family: var(--fc-font-main) !important;
    font-size: 0.86em !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 4px !important;
    color: var(--fc-text-secondary) !important;
    letter-spacing: 0.3px !important;
    transition: background 0.25s ease, color 0.25s ease !important;
}

details.status-box .status-details p.a {
    background: rgba(255, 255, 255, 0.018) !important;
}

details.status-box .status-details p.b {
    background: transparent !important;
}

details.status-box .status-details p:hover {
    background: rgba(245, 158, 11, 0.06) !important;
    color: var(--fc-text-primary) !important;
}

details.status-box .status-details .label {
    color: var(--fc-text-dim) !important;
    font-weight: 500 !important;
    font-size: 0.85em !important;
    white-space: nowrap !important;
}

details.status-box .status-details .value {
    color: var(--fc-text-primary) !important;
    font-weight: 400 !important;
}

/*
 * ---------------------------------
 *   模块三：叙事区块 (plot) — 暖色注入沉浸屏
 * ---------------------------------
 */

plot {
    display: block !important;
    background:
        radial-gradient(ellipse at 15% 5%, rgba(168, 85, 247, 0.025), transparent 55%),
        radial-gradient(ellipse at 85% 92%, rgba(245, 158, 11, 0.025), transparent 55%),
        radial-gradient(ellipse at 50% 50%, rgba(6, 182, 212, 0.01), transparent 70%),
        rgba(8, 6, 14, 0.45) !important;

    border: 1px solid rgba(168, 85, 247, 0.12) !important;
    border-top: 1px solid transparent !important;
    border-image-source: linear-gradient(90deg,
        transparent 5%,
        var(--fc-accent-purple) 25%,
        var(--fc-accent-amber) 40%,
        var(--fc-accent-pink) 55%,
        var(--fc-accent-cyan) 75%,
        transparent 95%
    ) !important;
    border-image-slice: 1 !important;
    border-radius: 0 !important;
    padding: 24px 22px !important;
    margin: 20px 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

plot::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent,
        rgba(168, 85, 247, 0.35),
        rgba(245, 158, 11, 0.2),
        rgba(255, 60, 142, 0.25),
        transparent
    ) !important;
}

plot p {
    font-family: var(--fc-font-main) !important;
    font-size: 0.96em !important;
    line-height: 1.95 !important;
    color: var(--fc-text-primary) !important;
    margin: 0 0 1em 0 !important;
    letter-spacing: 0.4px !important;
    text-align: justify !important;
}

plot p:last-child { margin-bottom: 0 !important; }

plot p em {
    color: var(--fc-accent-pink) !important;
    font-style: normal !important;
    font-weight: 500 !important;
    text-shadow: 0 0 8px rgba(255, 60, 142, 0.15) !important;
}

plot p strong {
    color: #fff !important;
    font-weight: 600 !important;
    text-shadow: 0 0 8px rgba(245, 158, 11, 0.25) !important;
}

/*
 * ---------------------------------
 *   模块四：选项区 — 危险度色谱行动终端
 * ---------------------------------
 */

hr.separator,
hr {
    height: 1px !important;
    border: none !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(168, 85, 247, 0.3) 10%,
        rgba(255, 60, 142, 0.5) 35%,
        rgba(245, 158, 11, 0.35) 50%,
        rgba(6, 182, 212, 0.4) 65%,
        rgba(168, 85, 247, 0.3) 90%,
        transparent 100%
    ) !important;
    margin: 24px 0 !important;
    opacity: 0.75 !important;
    position: relative !important;
}

hr.separator::after {
    content: "◈" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: var(--fc-accent-gold) !important;
    font-size: 8px !important;
    background: var(--fc-bg-abyss) !important;
    padding: 0 6px !important;
    opacity: 0.7 !important;
}

/*
 * ---------------------------------
 *   模块五：记忆模块 — 永夜加密档案
 * ---------------------------------
 */

details:not(.status-box) {
    background: rgba(13, 11, 20, 0.75) !important;
    border: 1px solid rgba(180, 83, 9, 0.15) !important;
    border-left: 3px solid var(--fc-accent-gold) !important;
    border-radius: 2px 8px 8px 2px !important;
    padding: 0 !important;
    margin: 12px 0 !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
    overflow: hidden !important;
    transition: all 0.35s ease !important;
    position: relative !important;
}

details:not(.status-box):hover {
    border-color: rgba(217, 119, 6, 0.30) !important;
    border-left-color: var(--fc-accent-gold) !important;
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.35),
        0 0 14px rgba(217, 119, 6, 0.06) !important;
    transform: translateY(-1px) !important;
}

details:not(.status-box)::after {
    content: "" !important;
    position: absolute !important;
    bottom: 4px !important;
    right: 8px !important;
    font-family: var(--fc-font-terminal) !important;
    font-size: 0.55em !important;
    color: rgba(217, 119, 6, 0.12) !important;
    pointer-events: none !important;
}

details:not(.status-box) > summary {
    font-family: var(--fc-font-main) !important;
    font-size: 0.84em !important;
    font-weight: 600 !important;
    color: var(--fc-accent-gold) !important;
    padding: 11px 16px !important;
    cursor: pointer !important;
    list-style: none !important;
    letter-spacing: 0.6px !important;
    background: rgba(217, 119, 6, 0.04) !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.3s ease !important;
}

details:not(.status-box) > summary::-webkit-details-marker { display: none !important; }
details:not(.status-box) > summary::marker { content: "" !important; }

details:not(.status-box) > summary::before {
    content: "◈ " !important;
    color: var(--fc-accent-gold) !important;
    font-size: 0.65em !important;
    opacity: 0.8 !important;
}

details:not(.status-box)[open] > summary {
    border-bottom: 1px solid rgba(217, 119, 6, 0.14) !important;
    background: rgba(217, 119, 6, 0.06) !important;
}

details:not(.status-box) p,
details:not(.status-box) div {
    font-size: 0.84em !important;
    line-height: 1.75 !important;
    color: var(--fc-text-secondary) !important;
    padding: 12px 16px !important;
    margin: 0 !important;
}

/*
 * ---------------------------------
 *   模块六：通用排版
 * ---------------------------------
 */

p {
    font-family: var(--fc-font-main) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.4px !important;
    color: var(--fc-text-secondary) !important;
}

h1 {
    font-family: var(--fc-font-main) !important;
    font-size: 1.1em !important;
    font-weight: 700 !important;
    margin: 0 !important;
    padding-bottom: 0 !important;
    border: none !important;
    color: var(--fc-text-primary) !important;
    line-height: 1.4 !important;
}

/*
 * ---------------------------------
 *   模块七：平台按钮 — 深渊触发面板（精确适配版）
 * ---------------------------------
 */

/* ----- 7A: 顶部功能按钮行 ----- */
button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input {
    background: linear-gradient(135deg,
        rgba(168, 85, 247, 0.20),
        rgba(255, 60, 142, 0.12),
        rgba(6, 182, 212, 0.06)
    ) !important;
    color: var(--fc-text-primary) !important;
    border: 1px solid rgba(168, 85, 247, 0.35) !important;
    border-radius: 2px !important;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.35),
        0 0 16px rgba(168, 85, 247, 0.06),
        inset 0 0 16px rgba(168, 85, 247, 0.04) !important;
    font-family: var(--fc-font-main) !important;
    font-weight: 600 !important;
    font-size: 0.84em !important;
    letter-spacing: 0.9px !important;
    transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    position: relative !important;
    overflow: hidden !important;
}

button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent,
        rgba(255, 60, 142, 0.5),
        rgba(168, 85, 247, 0.5),
        rgba(6, 182, 212, 0.4),
        transparent
    ) !important;
    opacity: 0.7 !important;
    z-index: 2 !important;
}

button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.06) 45%,
        rgba(255, 255, 255, 0.10) 50%,
        rgba(255, 255, 255, 0.06) 55%,
        transparent 100%
    ) !important;
    transition: left 0.6s ease !important;
    z-index: 3 !important;
    pointer-events: none !important;
}

button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input:hover::after {
    left: 100% !important;
}

button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input:hover {
    background: linear-gradient(135deg,
        rgba(168, 85, 247, 0.30),
        rgba(255, 60, 142, 0.20),
        rgba(6, 182, 212, 0.10)
    ) !important;
    border-color: var(--fc-accent-purple) !important;
    box-shadow:
        0 6px 20px rgba(168, 85, 247, 0.25),
        0 0 30px rgba(168, 85, 247, 0.15),
        var(--fc-glow-purple) !important;
    transform: translateY(-2px) !important;
    color: #fff !important;
}

button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input:active {
    transform: translateY(0) !important;
    box-shadow:
        0 0 0 2px rgba(16, 185, 129, 0.3),
        0 1px 4px rgba(0, 0, 0, 0.5) !important;
    transition: all 0.05s ease !important;
}

button.inline-flex.items-center.justify-center.h-7.rounded-md.border.border-input svg {
    color: inherit !important;
    opacity: 0.85 !important;
}

/* ----- 7B: 底栏工具按钮 ----- */
button.inline-flex.items-center.justify-center.size-7.shrink-0.rounded-md {
    background: rgba(18, 15, 28, 0.80) !important;
    border: 1px solid rgba(168, 85, 247, 0.20) !important;
    color: var(--fc-accent-purple) !important;
    box-shadow:
        0 1px 6px rgba(0, 0, 0, 0.3),
        inset 0 0 10px rgba(168, 85, 247, 0.03) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

button.inline-flex.items-center.justify-center.size-7.shrink-0.rounded-md:hover {
    background: rgba(26, 21, 40, 0.90) !important;
    border-color: var(--fc-accent-purple) !important;
    color: var(--fc-accent-pink) !important;
    box-shadow:
        0 2px 12px rgba(168, 85, 247, 0.20),
        0 0 20px rgba(168, 85, 247, 0.08) !important;
    transform: translateY(-1px) !important;
}

button.inline-flex.items-center.justify-center.size-7.shrink-0.rounded-md svg {
    color: inherit !important;
}

/* ----- 7C:「实时」按钮 ----- */
button.inline-flex.items-center.justify-center.gap-2.text-sm.font-medium.size-7 {
    background: rgba(18, 15, 28, 0.80) !important;
    border: 1px solid rgba(168, 85, 247, 0.25) !important;
    color: var(--fc-accent-purple) !important;
    width: auto !important;
    padding: 0 10px !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3) !important;
    transition: all 0.3s ease !important;
}

button.inline-flex.items-center.justify-center.gap-2.text-sm.font-medium.size-7:hover {
    background: rgba(26, 21, 40, 0.90) !important;
    border-color: var(--fc-accent-purple) !important;
    color: var(--fc-accent-pink) !important;
    box-shadow:
        0 2px 12px rgba(168, 85, 247, 0.20),
        var(--fc-glow-purple) !important;
}

/* ----- 7D: 发送按钮 ----- */
#prompt-input-footer button:last-child {
    background: linear-gradient(135deg, var(--fc-accent-purple), var(--fc-accent-pink)) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50% !important;
    box-shadow:
        0 3px 14px rgba(168, 85, 247, 0.40),
        0 0 20px rgba(255, 60, 142, 0.15) !important;
    transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

#prompt-input-footer button:last-child:hover {
    background: linear-gradient(135deg, var(--fc-accent-pink), var(--fc-accent-purple)) !important;
    transform: translateY(-2px) scale(1.08) !important;
    box-shadow:
        0 6px 24px rgba(168, 85, 247, 0.50),
        0 0 40px rgba(255, 60, 142, 0.20),
        var(--fc-glow-purple) !important;
}

#prompt-input-footer button:last-child:active {
    transform: translateY(0px) scale(0.95) !important;
    box-shadow:
        0 0 0 2px rgba(16, 185, 129, 0.3),
        0 2px 6px rgba(0, 0, 0, 0.4) !important;
}

#prompt-input-footer button:last-child svg {
    color: #ffffff !important;
}

/* ----- 7E: 底栏容器 ----- */
#prompt-input-footer {
    background: rgba(5, 5, 9, 0.90) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-top: 1px solid var(--fc-border-subtle) !important;
}

/* ----- 7F: 模型选择器按钮统一风格 ----- */
#prompt-input-footer button.inline-flex.h-7.rounded-md.border.border-input {
    background: linear-gradient(135deg,
        rgba(168, 85, 247, 0.20),
        rgba(255, 60, 142, 0.12),
        rgba(6, 182, 212, 0.06)
    ) !important;
    color: var(--fc-text-primary) !important;
    border: 1px solid rgba(168, 85, 247, 0.35) !important;
    border-radius: 2px !important;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.35),
        0 0 16px rgba(168, 85, 247, 0.06),
        inset 0 0 16px rgba(168, 85, 247, 0.04) !important;
    transform: none !important;
}

#prompt-input-footer button.inline-flex.h-7.rounded-md.border.border-input::before,
#prompt-input-footer button.inline-flex.h-7.rounded-md.border.border-input::after {
    display: none !important;
}

#prompt-input-footer button.inline-flex.h-7.rounded-md.border.border-input:hover {
    background: linear-gradient(135deg,
        rgba(168, 85, 247, 0.30),
        rgba(255, 60, 142, 0.20),
        rgba(6, 182, 212, 0.10)
    ) !important;
    border-color: var(--fc-accent-purple) !important;
    box-shadow:
        0 6px 20px rgba(168, 85, 247, 0.25),
        0 0 30px rgba(168, 85, 247, 0.15),
        var(--fc-glow-purple) !important;
    transform: none !important;
    color: #fff !important;
}

/* ----- 7G: 模型选择器文字标签 ----- */
#prompt-input-footer span,
#prompt-input-footer [class*="text-muted"] {
    color: var(--fc-text-dim) !important;
    font-family: var(--fc-font-terminal) !important;
    font-size: 11px !important;
    letter-spacing: 0.8px !important;
}

/*
 * ---------------------------------
 *   模块八：输入框 — 现实锚定终端（精确适配版）
 * ---------------------------------
 */

textarea[placeholder] {
    background-color: rgba(8, 6, 16, 0.92) !important;
    background-image:
        linear-gradient(rgba(168, 85, 247, 0.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.015) 1px, transparent 1px) !important;
    background-size: 20px 20px !important;
    border: 1px solid var(--fc-border-subtle) !important;
    border-bottom: 2px solid rgba(168, 85, 247, 0.25) !important;
    border-radius: 4px !important;
    color: #f0edf5 !important;
    font-family: var(--fc-font-main) !important;
    font-size: 15px !important;
    box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.35) !important;
    padding: 14px 16px !important;
    transition: all 0.35s ease !important;
    letter-spacing: 0.3px !important;
    caret-color: #f59e0b !important;
}

textarea[placeholder]::placeholder {
    color: rgba(99, 95, 114, 0.7) !important;
    font-style: italic !important;
    letter-spacing: 0.5px !important;
}

textarea[placeholder]:focus {
    outline: none !important;
    border-color: rgba(168, 85, 247, 0.35) !important;
    border-bottom-color: var(--fc-accent-purple) !important;
    box-shadow:
        inset 0 2px 10px rgba(0, 0, 0, 0.35),
        0 0 16px rgba(168, 85, 247, 0.12),
        0 0 40px rgba(168, 85, 247, 0.05) !important;
    background-color: rgba(10, 8, 20, 0.96) !important;
    animation: inputFocusGlow 3s ease-in-out infinite !important;
}

@keyframes inputFocusGlow {
    0%, 100% { border-bottom-color: var(--fc-accent-purple); }
    33% { border-bottom-color: var(--fc-accent-pink); }
    66% { border-bottom-color: var(--fc-accent-cyan); }
}

/*
 * ---------------------------------
 *   模块九：深渊之眼·改 — 灶火瞳孔加载
 * ---------------------------------
 */

.flex.items-center.justify-center.size-6 > .flex.gap-2 {
    display: none !important;
}

.flex.items-center.justify-center.size-6 {
    position: relative !important;
    width: 110px !important;
    height: 90px !important;
    margin: 28px auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.flex.items-center.justify-center.size-6::before {
    content: "" !important;
    position: absolute !important;
    width: 70px !important;
    height: 70px !important;
    background: radial-gradient(ellipse at 45% 45%,
        rgba(168, 85, 247, 0.5) 0%,
        rgba(245, 158, 11, 0.2) 40%,
        rgba(255, 60, 142, 0.12) 65%,
        transparent 85%
    ) !important;
    border-radius: 50% !important;
    z-index: 1 !important;
    animation: abyssGlowEnhanced 3.5s infinite alternate ease-in-out !important;
}

@keyframes abyssGlowEnhanced {
    0% { transform: scale(0.75); opacity: 0.35; }
    50% { opacity: 0.7; }
    100% { transform: scale(1.35); opacity: 0.85; }
}

.flex.items-center.justify-center.size-6 {
    box-shadow:
        0 0 40px rgba(168, 85, 247, 0.12),
        0 0 80px rgba(255, 60, 142, 0.06),
        0 0 20px rgba(245, 158, 11, 0.08) !important;
    border-radius: 50% !important;
}

.flex.items-center.justify-center.size-6::after {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><defs><linearGradient id="eg" x1="0%25" y1="0%25" x2="100%25" y2="100%25"><stop offset="0%25" stop-color="%23ff3c8e"/><stop offset="30%25" stop-color="%23a855f7"/><stop offset="60%25" stop-color="%2306b6d4"/><stop offset="100%25" stop-color="%23f59e0b"/></linearGradient></defs><ellipse cx="40" cy="40" rx="28" ry="18" fill="none" stroke="url(%23eg)" stroke-width="1.5" opacity="0.7"><animate attributeName="ry" values="18;23;18" dur="2.5s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.7;1;0.7" dur="2.5s" repeatCount="indefinite"/></ellipse><circle cx="40" cy="40" r="6" fill="%23a855f7"><animate attributeName="r" values="6;9;6" dur="1.8s" repeatCount="indefinite"/><animate attributeName="fill" values="%23a855f7;%23ff3c8e;%23f59e0b;%23a855f7" dur="4s" repeatCount="indefinite"/></circle><ellipse cx="40" cy="40" rx="35" ry="22" fill="none" stroke="%23a855f7" stroke-width="0.5" opacity="0.3"><animate attributeName="ry" values="22;26;22" dur="3.5s" repeatCount="indefinite"/></ellipse></svg>') !important;
    position: absolute !important;
    width: 80px !important;
    height: 80px !important;
    z-index: 2 !important;
    filter: drop-shadow(0 0 10px rgba(168, 85, 247, 0.4))
            drop-shadow(0 0 20px rgba(245, 158, 11, 0.15)) !important;
    animation: eyeFloatEnhanced 4.5s infinite ease-in-out !important;
}

@keyframes eyeFloatEnhanced {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    25% { transform: translateY(-6px) rotate(0.5deg); }
    75% { transform: translateY(3px) rotate(-0.5deg); }
}

/*
 * ---------------------------------
 *   模块十：响应式布局与交互优化
 * ---------------------------------
 */

@media screen and (max-width: 768px) {
    details.status-box {
        margin: 12px 0 !important;
    }

    details.status-box > summary.status-summary {
        padding: 11px 14px !important;
        font-size: 0.90em !important;
    }

    details.status-box .status-details {
        padding: 10px 12px 12px !important;
    }

    details.status-box .status-details p {
        font-size: 0.82em !important;
        padding: 6px 10px !important;
        line-height: 1.6 !important;
    }

    plot {
        padding: 18px 16px !important;
        margin: 14px 0 !important;
    }

    plot p {
        font-size: 0.92em !important;
        line-height: 1.85 !important;
    }

    .is-assistant > .border.border-muted {
        padding: 16px !important;
    }

    details:not(.status-box) > summary {
        font-size: 0.80em !important;
        padding: 9px 12px !important;
    }

    details:not(.status-box) p,
    details:not(.status-box) div {
        font-size: 0.80em !important;
        padding: 10px 12px !important;
    }

    textarea[placeholder] {
        font-size: 16px !important;
        padding: 13px 14px !important;
    }

    .is-assistant > .border.border-muted::after {
        width: 14px !important;
        top: 6px !important;
        right: 8px !important;
    }
}

@media screen and (max-width: 480px) {
    details.status-box > summary.status-summary {
        padding: 9px 12px !important;
        font-size: 0.84em !important;
    }

    details.status-box > summary.status-summary h1 {
        font-size: 0.84em !important;
    }

    details.status-box .status-details p {
        font-size: 0.77em !important;
        padding: 5px 8px !important;
    }

    details.status-box .status-details p {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    details.status-box .status-details .label {
        flex-basis: 100% !important;
        margin-bottom: 2px !important;
        font-size: 0.80em !important;
    }

    plot {
        padding: 14px 12px !important;
    }

    plot p {
        font-size: 0.87em !important;
        line-height: 1.8 !important;
        text-align: left !important;
    }

    .is-assistant > .border.border-muted::after {
        width: 10px !important;
        height: 2px !important;
        top: 5px !important;
        right: 6px !important;
        opacity: 0.35 !important;
    }

    textarea[placeholder] {
        font-size: 16px !important;
        padding: 12px 12px !important;
    }
}

/*
 * ---------------------------------
 *   触控优化
 * ---------------------------------
 */

details.status-box > summary.status-summary {
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
}

details:not(.status-box) > summary {
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
}

/*
 * ---------------------------------
 *   GPU加速优化
 * ---------------------------------
 */

details.status-box,
details:not(.status-box),
plot,
.is-assistant > .border.border-muted {
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
    will-change: transform !important;
}

/*
 * ---------------------------------
 *   减弱动效偏好适配
 * ---------------------------------
 */

@media (prefers-reduced-motion: reduce) {
    details.status-box,
    details:not(.status-box),
    plot,
    .is-assistant > .border.border-muted {
        transition: none !important;
        transform: none !important;
        animation: none !important;
    }

    .flex.items-center.justify-center.size-6::before,
    .flex.items-center.justify-center.size-6::after {
        animation: none !important;
    }

    textarea[placeholder]:focus {
        animation: none !important;
    }
}

/*
 * ---------------------------------
 *   模块十一：六司色谱系统
 * ---------------------------------
 */

.co-omega-bio {
    --co-accent: var(--co-omega-accent) !important;
    --co-glow: var(--co-omega-glow) !important;
    border-left-color: var(--co-omega-accent) !important;
}

.co-venus-media {
    --co-accent: var(--co-venus-accent) !important;
    --co-glow: var(--co-venus-glow) !important;
    border-left-color: var(--co-venus-accent) !important;
}

.co-anvil-military {
    --co-accent: var(--co-anvil-accent) !important;
    --co-glow: var(--co-anvil-glow) !important;
    border-left-color: var(--co-anvil-accent) !important;
}

.co-stigmata-church {
    --co-accent: var(--co-stigmata-accent) !important;
    --co-glow: var(--co-stigmata-glow) !important;
    border-left-color: var(--co-stigmata-accent) !important;
}

.co-nectar-food {
    --co-accent: var(--co-nectar-accent) !important;
    --co-glow: var(--co-nectar-glow) !important;
    border-left-color: var(--co-nectar-accent) !important;
}

.co-evernight-finance {
    --co-accent: var(--co-evernight-accent) !important;
    --co-glow: var(--co-evernight-glow) !important;
    border-left-color: var(--co-evernight-accent) !important;
}

/*
 * ---------------------------------
 *   模块十二：平然状态视觉母题
 * ---------------------------------
 */

.flat-state {
    position: relative !important;
}

.flat-state::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: radial-gradient(
        ellipse at 30% 70%,
        rgba(239, 68, 68, 0.06) 0%,
        transparent 60%
    ) !important;
    pointer-events: none !important;
    z-index: 0 !important;
    animation: flatUndercurrentPulse 6s ease-in-out infinite !important;
}

@keyframes flatUndercurrentPulse {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.8; }
}

.flat-crack {
    animation: flatCrackReveal 0.3s ease-out !important;
}

@keyframes flatCrackReveal {
    0% { box-shadow: inset 0 0 0 rgba(239, 68, 68, 0), 0 0 0 rgba(239, 68, 68, 0); }
    50% { box-shadow: inset 0 0 20px rgba(239, 68, 68, 0.15), 0 0 30px rgba(239, 68, 68, 0.2); }
    100% { box-shadow: inset 0 0 5px rgba(239, 68, 68, 0.05), 0 0 10px rgba(239, 68, 68, 0.05); }
}

/*
 * ---------------------------------
 *   模块十三：料理终端装饰
 * ---------------------------------
 */

.steam-vent {
    position: relative !important;
}

.steam-vent::after {
    content: "" !important;
    position: absolute !important;
    top: -8px !important;
    left: 50% !important;
    width: 30px !important;
    height: 12px !important;
    transform: translateX(-50%) !important;
    background: radial-gradient(
        ellipse at 50% 100%,
        rgba(255, 255, 255, 0.05) 0%,
        transparent 70%
    ) !important;
    pointer-events: none !important;
    animation: steamRise 4s ease-out infinite !important;
    z-index: 5 !important;
}

@keyframes steamRise {
    0% { transform: translateX(-50%) translateY(0); opacity: 0.3; }
    100% { transform: translateX(-50%) translateY(-12px); opacity: 0; }
}

.ingredient-marker::before {
    content: "" !important;
    display: inline-block !important;
    width: 5px !important;
    height: 5px !important;
    background: var(--fc-accent-green) !important;
    border-radius: 50% !important;
    margin-right: 5px !important;
    vertical-align: middle !important;
    box-shadow: 0 0 6px rgba(16, 185, 129, 0.5) !important;
    animation: ingredientPulse 2s ease-in-out infinite !important;
}

@keyframes ingredientPulse {
    0%, 100% { box-shadow: 0 0 6px rgba(16, 185, 129, 0.5); }
    50% { box-shadow: 0 0 12px rgba(16, 185, 129, 0.8); }
}

.hearth-glow {
    position: relative !important;
}

.hearth-glow::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 10% !important;
    right: 10% !important;
    height: 20px !important;
    background: radial-gradient(
        ellipse at 50% 100%,
        rgba(245, 158, 11, 0.08) 0%,
        transparent 80%
    ) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.data-spice {
    position: relative !important;
}

.data-spice::before {
    content: "✦" !important;
    position: absolute !important;
    top: 6px !important;
    right: 10px !important;
    font-size: 8px !important;
    color: var(--fc-accent-amber) !important;
    opacity: 0.4 !important;
    pointer-events: none !important;
    z-index: 5 !important;
    animation: spiceTwinkle 3s ease-in-out infinite !important;
}

@keyframes spiceTwinkle {
    0%, 100% { opacity: 0.25; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.3); }
}

/*
 * ---------------------------------
 *   全局微交互
 * ---------------------------------
 */

* {
    -webkit-tap-highlight-color: transparent !important;
}

::selection {
    background: rgba(245, 158, 11, 0.25) !important;
    color: #fff !important;
}

::-moz-selection {
    background: rgba(245, 158, 11, 0.25) !important;
    color: #fff !important;
}

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--fc-bg-abyss); }
::-webkit-scrollbar-thumb {
    background: var(--fc-accent-purple);
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--fc-accent-pink);
}