/**
 * aiapps 工具详情页统一 UI（DESIGN.md / PRODUCT.md）
 * 加载顺序：在 ai-tool-detail.css、各页 extra_css 之后，由 base.html 引入。
 */

html.aiapps-detail {
    /* —— 工坊光谱 Workshop Spectrum（Committed / 产品 register）—— */
    /* 主色：鲲穹蓝 */
    --kq-primary: #1e88e5;
    --kq-primary-deep: #1565c0;
    --kq-primary-bright: #42a5f5;
    --kq-primary-soft: #bfdbfe;
    --kq-primary-wash: #eff6ff;
    /* 智能青：AI 助手、建议词、次要高亮（打破纯蓝单调，非紫 SaaS） */
    --kq-teal: #0d9488;
    --kq-teal-deep: #0f766e;
    --kq-teal-bright: #14b8a6;
    --kq-teal-soft: #99f6e4;
    --kq-teal-wash: #f0fdfa;
    /* 洞察琥珀：提示、价签、暖色锚点 */
    --kq-amber: #b45309;
    --kq-amber-bright: #d97706;
    --kq-amber-wash: #fffbeb;
    /* 语义色 */
    --kq-success: #059669;
    --kq-success-wash: #ecfdf5;
    --kq-error: #dc2626;
    --kq-error-wash: #fef2f2;
    /* 中性面 */
    --kq-surface: #ffffff;
    --kq-surface-alt: #f8fafc;
    --kq-surface-panel: #eef6ff;
    --kq-ink: #1e293b;
    --kq-ink-secondary: #64748b;
    --kq-border: #e2e8f0;
    --kq-border-teal: #99f6e4;
    --kq-border-blue: #bae6fd;
    --kq-radius: 8px;
    --kq-radius-lg: 12px;
    --kq-shadow-card: 0 2px 8px rgba(15, 23, 42, 0.06);
    --kq-shadow-hover: 0 6px 20px rgba(13, 148, 136, 0.14);
    --kq-shadow-primary: 0 4px 14px rgba(30, 136, 229, 0.22);
    --kq-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --kq-page-gradient: linear-gradient(165deg, #dbeafe 0%, #e0f2fe 30%, #f0fdfa 58%, #f8fafc 100%);
    --kq-header-gradient: linear-gradient(135deg, #ffffff 0%, #f0f9ff 55%, #f0fdfa 100%);
    --kq-btn-gradient: linear-gradient(135deg, #1e88e5 0%, #0d9488 100%);
    --kq-btn-gradient-hover: linear-gradient(135deg, #42a5f5 0%, #14b8a6 100%);
    /* Layout craft */
    --kq-tool-col-gap: 24px;
    --kq-tool-section-gap: 20px;
    --kq-tool-block-pad: 24px;
}

/* 详情页背景：工坊光谱 — 蓝→青冷渐变底（禁紫粉 wash） */
html.aiapps-detail body {
    background: #f8fafc !important;
    background-image: none !important;
}

html.aiapps-detail body.page-not-home {
    background: var(--kq-page-gradient) !important;
    background-attachment: fixed !important;
}

/* 各页 inline body #C5E4FE 覆盖 */
.aiapps-tool-slot .page-container,
.aiapps-tool-slot .tool-container,
.aiapps-tool-slot .model-exchange-container {
    background: transparent !important;
}

/* ---------- 工具页头（tool-header）统一 ---------- */
.aiapps-tool-slot .tool-header {
    background: var(--kq-header-gradient) !important;
    border: 1px solid var(--kq-border-blue) !important;
    border-radius: var(--kq-radius-lg) !important;
    box-shadow: var(--kq-shadow-card), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
    padding: 20px 24px !important;
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: var(--kq-tool-section-gap) !important;
    box-sizing: border-box !important;
}

/* 注：曾用 ::before 做顶部渐变饰线（Color craft），用户反馈像样式 bug，已移除 */

.aiapps-tool-slot .tool-header .page-desc,
.aiapps-tool-slot .tool-header .page-desc {
    color: var(--kq-ink-secondary) !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* 标题：消灭全站 gradient text（含 inline style） */
.aiapps-tool-slot h1,
.aiapps-tool-slot h2.page-title,
.aiapps-tool-slot .page-title,
.aiapps-tool-slot .tool-title,
.aiapps-tool-slot .title-text,
.aiapps-tool-slot [style*="-webkit-background-clip: text"],
.aiapps-tool-slot [style*="background-clip: text"] {
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: var(--kq-primary-deep) !important;
    color: var(--kq-primary-deep) !important;
}

/* ---------- 表单面板 ---------- */
.aiapps-tool-slot .tool-form,
.aiapps-tool-slot .input-section,
.aiapps-tool-slot .result-section,
.aiapps-tool-slot .result-container,
.aiapps-tool-slot .chat-container,
.aiapps-tool-slot .tool-container > .tool-container {
    background: var(--kq-surface) !important;
    border: 1px solid var(--kq-border) !important;
    border-radius: var(--kq-radius-lg) !important;
    box-shadow: var(--kq-shadow-card) !important;
}

.aiapps-tool-slot .form-label {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--kq-ink) !important;
}

.aiapps-tool-slot .form-input,
.aiapps-tool-slot .form-textarea,
.aiapps-tool-slot .form-select,
.aiapps-tool-slot .chat-input {
    border: 1px solid var(--kq-border) !important;
    border-radius: var(--kq-radius) !important;
    color: var(--kq-ink) !important;
    font-size: 14px !important;
    transition: border-color 0.2s var(--kq-ease), box-shadow 0.2s var(--kq-ease);
}

.aiapps-tool-slot .form-input:focus,
.aiapps-tool-slot .form-textarea:focus,
.aiapps-tool-slot .form-select:focus,
.aiapps-tool-slot .chat-input:focus {
    outline: none !important;
    border-color: var(--kq-primary) !important;
    box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.15) !important;
}

.aiapps-tool-slot .form-input::placeholder,
.aiapps-tool-slot .form-textarea::placeholder,
.aiapps-tool-slot .chat-input::placeholder {
    color: var(--kq-ink-secondary) !important;
    opacity: 1;
}

/* ---------- 主操作按钮 ---------- */
.aiapps-tool-slot .generate-btn,
.aiapps-tool-slot button[id$="_btn"]:not(.send-btn):not(.tab-btn):not(.clear-chat-btn),
.aiapps-tool-slot .btn-primary:not(.tab-btn) {
    background: var(--kq-btn-gradient) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--kq-radius) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    box-shadow: var(--kq-shadow-primary) !important;
    transition: background 0.2s var(--kq-ease), box-shadow 0.2s var(--kq-ease), transform 0.2s var(--kq-ease);
}

.aiapps-tool-slot .generate-btn:hover:not(:disabled),
.aiapps-tool-slot button[id$="_btn"]:not(.send-btn):not(:disabled):hover,
.aiapps-tool-slot .btn-primary:hover:not(:disabled) {
    background: var(--kq-btn-gradient-hover) !important;
    box-shadow: var(--kq-shadow-hover) !important;
    transform: translateY(-1px);
}

.aiapps-tool-slot .generate-btn:focus-visible,
.aiapps-tool-slot button[id$="_btn"]:focus-visible,
.aiapps-tool-slot .send-btn:focus-visible,
.aiapps-tool-slot .btn-primary:focus-visible {
    outline: 2px solid var(--kq-primary) !important;
    outline-offset: 2px;
}

.aiapps-tool-slot .generate-btn:disabled,
.aiapps-tool-slot button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none !important;
}

/* 次要按钮 */
.aiapps-tool-slot #clear_btn,
.aiapps-tool-slot .btn-secondary,
.aiapps-tool-slot .action-btn {
    background: var(--kq-surface-alt) !important;
    color: var(--kq-ink) !important;
    border: 1px solid var(--kq-border) !important;
}

/* 聊天发送钮保持圆形品牌蓝 */
.aiapps-tool-slot .send-btn {
    background: var(--kq-btn-gradient) !important;
}

.aiapps-tool-slot .send-btn:hover:not(:disabled) {
    transform: scale(1.05);
}

/* ---------- 侧栏条纹 / callout 收敛（detect side-tab ×101） ---------- */
.aiapps-tool-slot .section-title::before,
.aiapps-tool-slot h2.section-title::before,
.aiapps-tool-slot h3.section-title::before,
.aiapps-tool-slot .ec-section-bar {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

.aiapps-tool-slot blockquote,
.aiapps-tool-slot .error-message,
.aiapps-tool-slot .result-error,
.aiapps-tool-slot .tip-box,
.aiapps-tool-slot .info-box,
.aiapps-tool-slot .warning-box,
.aiapps-tool-slot .result-text,
.aiapps-tool-slot .legal-content blockquote,
.aiapps-tool-slot [class*="error-"],
.aiapps-tool-slot [class*="alert-"] {
    border-left-width: 1px !important;
    border-left-color: var(--kq-border) !important;
}

/* inline style 厚左边框（属性选择器兜底） */
.aiapps-tool-slot [style*="border-left: 4px"],
.aiapps-tool-slot [style*="border-left:4px"],
.aiapps-tool-slot [style*="border-left: 3px"],
.aiapps-tool-slot [style*="border-left:3px"] {
    border-left: 1px solid var(--kq-border) !important;
}

/* ---------- 价签：品牌蓝系 ---------- */
.aiapps-tool-slot .aiapps-price-badge {
    color: var(--kq-amber) !important;
    background: linear-gradient(180deg, var(--kq-amber-wash) 0%, #fef3c7 100%) !important;
    border-right-color: rgba(217, 119, 6, 0.25) !important;
}

.aiapps-tool-slot .aiapps-price-badge--stacked {
    border-color: rgba(217, 119, 6, 0.22) !important;
}

.aiapps-tool-slot .aiapps-price-badge__amount {
    color: var(--kq-amber-bright) !important;
}

.aiapps-tool-slot .aiapps-price-badge__unit {
    color: var(--kq-amber) !important;
    font-size: 12px !important;
}

.aiapps-tool-slot .aiapps-primary-action-group {
    box-shadow: 0 2px 8px rgba(30, 136, 229, 0.18) !important;
}

/* ---------- 动效：禁止 bounce，尊重 reduced motion ---------- */
.aiapps-tool-slot * {
    animation-timing-function: var(--kq-ease) !important;
}

@media (prefers-reduced-motion: reduce) {
    .aiapps-tool-slot * {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }
}

/* ==========================================================================
 * Polish pass（2026-06-09）：覆盖 inline 冲突 + 对比度 + 双栏滚动 + 移动端
 * 加载顺序：本文件在 extra_css 与 shell-overrides 之后，!important 赢 stylesheet
 * 元素级 style="" 仍优先 — 下方用属性选择器兜底
 * ========================================================================== */

/* inline body 背景 #C5E4FE / #c5e4fe */
html.aiapps-detail body[style*="background"],
.aiapps-tool-slot body {
    background: var(--kq-page-gradient) !important;
}

/* inline #E8F2FF / #e6f2ff 面板 → 白底卡片 */
.aiapps-tool-slot .tool-header[style*="background"],
.aiapps-tool-slot .tool-form[style*="background"],
.aiapps-tool-slot .input-section[style*="background"],
.aiapps-tool-slot .result-section[style*="background"],
.aiapps-tool-slot .result-container[style*="background"],
.aiapps-tool-slot .chat-container[style*="background"],
.aiapps-tool-slot .tool-container[style*="background"],
.aiapps-tool-slot .page-header[style*="background"] {
    background: var(--kq-surface) !important;
    background-color: var(--kq-surface) !important;
}

.aiapps-tool-slot .result-content[style*="background"],
.aiapps-tool-slot .result-body[style*="background"] {
    background: transparent !important;
}

/* 虚线框 #C5E4FE → 中性边框 */
.aiapps-tool-slot [style*="dashed #C5E4FE"],
.aiapps-tool-slot [style*="dashed #c5e4fe"],
.aiapps-tool-slot [style*="#C5E4FE"] {
    border-color: #bfdbfe !important;
}

/* 14px 正文/链接用深一档蓝，满足 WCAG AA（#1e88e5 在白底仅 3.68:1） */
.aiapps-tool-slot .form-label,
.aiapps-tool-slot .nav-link,
.aiapps-tool-slot label,
.aiapps-tool-slot p,
.aiapps-tool-slot .form-hint,
.aiapps-tool-slot .input-hint,
.aiapps-tool-slot .upload-hint,
.aiapps-tool-slot .page-desc {
    color: var(--kq-ink-secondary) !important;
}

.aiapps-tool-slot a:not(.generate-btn):not(.btn-primary):not(.send-btn):not(.submenu-item) {
    color: #1565c0 !important;
}

/* 消灭浅灰 helper（#999/#777/#94a3b8 对比度不足） */
.aiapps-tool-slot [style*="color: #999"],
.aiapps-tool-slot [style*="color:#999"],
.aiapps-tool-slot [style*="color: #777"],
.aiapps-tool-slot [style*="color:#777"],
.aiapps-tool-slot .placeholder-desc,
.aiapps-tool-slot .upload-hint,
.aiapps-tool-slot #resultPlaceholder,
.aiapps-tool-slot #resultImages [style*="color: #999"] {
    color: var(--kq-ink-secondary) !important;
}

/* 双栏工具页通用：左栏表单可滚动 + 底栏操作不裁切（live_stream / audio_to_text 等同构） */
.aiapps-tool-slot .live-stream-input-column,
.aiapps-tool-slot .audio-check-input-column,
.aiapps-tool-slot .tool-form[style*="overflow: hidden"][style*="flex-direction: column"] {
    display: flex !important;
    flex-direction: column !important;
}

.aiapps-tool-slot .live-stream-form-scroll,
.aiapps-tool-slot .audio-check-form-scroll {
    flex: 1 1 0 !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.aiapps-tool-slot .form-actions,
.aiapps-tool-slot .aiapps-tool-actions {
    flex-shrink: 0 !important;
    margin-top: auto !important;
    padding-top: 12px !important;
}

/* 主操作触达面积 ≥44px（WCAG 2.5.5 目标尺寸） */
.aiapps-tool-slot .generate-btn,
.aiapps-tool-slot button[id$="_btn"]:not(.send-btn),
.aiapps-tool-slot .btn-primary,
.aiapps-tool-slot .aiapps-primary-action-group > button {
    min-height: 44px !important;
}

.aiapps-tool-slot .send-btn {
    min-width: 48px !important;
    min-height: 48px !important;
}

.aiapps-tool-slot .submenu-item {
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
}

/* 双栏 → 单栏（768px） */
@media (max-width: 768px) {
    .aiapps-tool-slot .live-stream-columns,
    .aiapps-tool-slot .audio-check-columns,
    .aiapps-tool-slot .model-exchange-main,
    .aiapps-tool-slot .tool-content {
        flex-direction: column !important;
        max-height: none !important;
        overflow: visible !important;
        gap: 16px !important;
    }

    .aiapps-tool-slot .live-stream-input-column,
    .aiapps-tool-slot .live-stream-result-column,
    .aiapps-tool-slot .audio-check-input-column,
    .aiapps-tool-slot .audio-check-result-column,
    .aiapps-tool-slot .input-section,
    .aiapps-tool-slot .result-section {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .aiapps-tool-slot .tool-header {
        padding: 16px !important;
        margin-bottom: 16px !important;
    }

    .aiapps-tool-slot h1,
    .aiapps-tool-slot .page-title {
        font-size: 20px !important;
    }

    .aiapps-tool-slot .chat-container {
        height: auto !important;
        min-height: 420px !important;
    }
}

@media (max-width: 480px) {
    .aiapps-tool-slot .form-row {
        flex-direction: column !important;
        gap: 8px !important;
    }

    .aiapps-tool-slot .form-group-half {
        width: 100% !important;
    }
}

/* ==========================================================================
 * Chat UI polish（2026-06-09 二轮）
 * 根因：drama_storyboard_copywriting 等页 extra_css 仍写 #7194ff 紫渐变；
 * clear-chat-btn 未纳入 tool-ui；tool-header/chat-input-area inline max-width:900px
 * 压过 shell-overrides 的 .chat-container 全宽规则。
 * ========================================================================== */

.aiapps-tool-slot .page-container > .tool-header[style*="max-width"],
.aiapps-tool-slot .tool-header[style*="max-width"] {
    max-width: none !important;
    width: 100% !important;
}

.aiapps-tool-slot .chat-input-area,
.aiapps-tool-slot .chat-input-wrapper,
.aiapps-tool-slot .suggested-prompts {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* 清空对话：次要操作，不用紫渐变主按钮 */
.aiapps-tool-slot .clear-chat-btn {
    background: var(--kq-surface-alt) !important;
    color: var(--kq-ink) !important;
    border: 1px solid var(--kq-border) !important;
    border-radius: var(--kq-radius) !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 8px 14px !important;
    min-height: 36px !important;
    cursor: pointer;
    transition: background 0.2s var(--kq-ease), border-color 0.2s var(--kq-ease), color 0.2s var(--kq-ease);
}

.aiapps-tool-slot .clear-chat-btn:hover {
    background: #eff6ff !important;
    border-color: var(--kq-primary) !important;
    color: var(--kq-primary-deep) !important;
    transform: none !important;
    box-shadow: none !important;
}

.aiapps-tool-slot .clear-chat-btn:focus-visible {
    outline: 2px solid var(--kq-primary) !important;
    outline-offset: 2px;
}

/* 聊天气泡 / 头像 / 建议词：工坊光谱 */
.aiapps-tool-slot .bot-message .message-avatar {
    background: linear-gradient(135deg, var(--kq-teal) 0%, var(--kq-teal-deep) 100%) !important;
    color: #fff !important;
}

.aiapps-tool-slot .bot-message .message-content {
    background: var(--kq-teal-wash) !important;
    border: 1px solid var(--kq-border-teal) !important;
    color: var(--kq-ink) !important;
}

.aiapps-tool-slot .user-message .message-content {
    background: linear-gradient(135deg, var(--kq-primary) 0%, var(--kq-primary-deep) 100%) !important;
    color: #fff !important;
}

.aiapps-tool-slot .suggestion-icon {
    color: var(--kq-teal) !important;
}

.aiapps-tool-slot .suggestion-btn {
    border-color: var(--kq-border) !important;
    transition: border-color 0.2s var(--kq-ease), background 0.2s var(--kq-ease), box-shadow 0.2s var(--kq-ease);
}

.aiapps-tool-slot .suggestion-btn:hover {
    background: var(--kq-primary-wash) !important;
    border-color: var(--kq-teal-bright) !important;
    box-shadow: 0 2px 10px rgba(13, 148, 136, 0.1) !important;
}

.aiapps-tool-slot .suggestion-btn:hover .arrow-icon {
    color: var(--kq-teal) !important;
}

.aiapps-tool-slot .spinner {
    border-color: rgba(30, 136, 229, 0.25) !important;
    border-top-color: var(--kq-primary) !important;
}

/* extra_css 内硬编码紫渐变按钮（非 .send-btn / .generate-btn） */
.aiapps-tool-slot button[style*="7194ff"]:not(.send-btn),
.aiapps-tool-slot button[style*="9a7bff"]:not(.send-btn) {
    background: linear-gradient(135deg, var(--kq-primary) 0%, var(--kq-primary-deep) 100%) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(30, 136, 229, 0.28) !important;
}

/* ==========================================================================
 * Layout craft（2026-06-09）：统一壳内工具区宽度
 * 根因：100+ 模板各自写 max-width 900/1040/1200 + margin:0 auto，
 * 嵌入「侧栏 + 槽」后同列页面宽窄不一（日志：grep 900px×27页、1040px×12页、1200px×60+页）
 * 策略：.aiapps-tool-slot 内主结构一律 width:100%，双栏等分 flex，不居中收窄
 * ========================================================================== */

.aiapps-tool-slot > .page-container,
.aiapps-tool-slot .page-container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* 页级容器（extra_css 常见 900px / 1200px 居中） */
.aiapps-tool-slot .kq-aiapps-tool-main,
.aiapps-tool-slot > .container,
.aiapps-tool-slot .container,
.aiapps-tool-slot .legal-container,
.aiapps-tool-slot .hr-container,
.aiapps-tool-slot .model-exchange-container,
.aiapps-tool-slot .remove-container,
.aiapps-tool-slot .writing-container,
.aiapps-tool-slot .ecommerce-container,
.aiapps-tool-slot .marketing-poster-container,
.aiapps-tool-slot .red-packet-container,
.aiapps-tool-slot .pose-container,
.aiapps-tool-slot .paper-container,
.aiapps-tool-slot .resume-container,
.aiapps-tool-slot .furry-container,
.aiapps-tool-slot .wechat-container,
.aiapps-tool-slot .welcome-container,
.aiapps-tool-slot .tool-content,
.aiapps-tool-slot > .ecommerce-soft-page,
.aiapps-tool-slot .ecommerce-soft-page .ec-inner.page-container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* 页头：furry / welcome 同构（与 tool-header 对齐全宽） */
.aiapps-tool-slot .furry-header,
.aiapps-tool-slot .welcome-header-area,
.aiapps-tool-slot .remove-header,
.aiapps-tool-slot .writing-header,
.aiapps-tool-slot .marketing-header,
.aiapps-tool-slot .chat-header,
.aiapps-tool-slot .page-header,
.aiapps-tool-slot .ec-hero-card {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: var(--kq-tool-section-gap) !important;
    box-sizing: border-box !important;
}

/* ecommerce 页全视口 margin 突破复位 */
.aiapps-tool-slot .ecommerce-soft-page {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    min-height: auto !important;
    background: transparent !important;
}

.aiapps-tool-slot .welcome-header-box {
    max-width: none !important;
    width: 100% !important;
}

/* 双栏 / 多栏主布局：占满槽宽 + 统一列间距 */
.aiapps-tool-slot [class$="-columns"],
.aiapps-tool-slot .live-stream-columns,
.aiapps-tool-slot .audio-check-columns,
.aiapps-tool-slot .model-exchange-main,
.aiapps-tool-slot .remove-main,
.aiapps-tool-slot .writing-main,
.aiapps-tool-slot .ecommerce-main,
.aiapps-tool-slot .wechat-main,
.aiapps-tool-slot .legal-main,
.aiapps-tool-slot .paper-main,
.aiapps-tool-slot .pose-main,
.aiapps-tool-slot .resume-main,
.aiapps-tool-slot .tool-main,
.aiapps-tool-slot .comic-main,
.aiapps-tool-slot .figure-main,
.aiapps-tool-slot .furry-main,
.aiapps-tool-slot .main:not(.main-content),
.aiapps-tool-slot .ec-tool-layout,
.aiapps-tool-slot .tool-content[style*="display: flex"] {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    gap: var(--kq-tool-col-gap) !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
}

/* 会话型：左会话列表 + 右 chat-main 纵排（勿与双栏表单混用） */
.aiapps-tool-slot .chat-container:has(.chat-sidebar) {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-height: min(720px, calc(100vh - 220px)) !important;
    overflow: hidden !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .chat-container:has(.chat-sidebar) {
        flex-direction: row !important;
    }
}

.aiapps-tool-slot .chat-container .chat-sidebar {
    flex: 0 0 240px !important;
    width: 240px !important;
    min-width: 0 !important;
}

.aiapps-tool-slot .chat-container .chat-main {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 0% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    gap: 0 !important;
    width: auto !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .furry-main,
    .aiapps-tool-slot .main:not(.main-content),
    .aiapps-tool-slot [class$="-columns"],
    .aiapps-tool-slot .live-stream-columns,
    .aiapps-tool-slot .audio-check-columns,
    .aiapps-tool-slot .remove-main,
    .aiapps-tool-slot .writing-main,
    .aiapps-tool-slot .ecommerce-main,
    .aiapps-tool-slot .wechat-main,
    .aiapps-tool-slot .legal-main,
    .aiapps-tool-slot .paper-main,
    .aiapps-tool-slot .pose-main,
    .aiapps-tool-slot .resume-main,
    .aiapps-tool-slot .tool-main,
    .aiapps-tool-slot .comic-main,
    .aiapps-tool-slot .figure-main,
    .aiapps-tool-slot .model-exchange-main {
        flex-direction: row !important;
    }

    .aiapps-tool-slot .ec-tool-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }
}

/* 双栏子列等宽（左表单 / 右结果） */
.aiapps-tool-slot [class$="-columns"] > .input-section,
.aiapps-tool-slot [class$="-columns"] > .result-section,
.aiapps-tool-slot [class$="-columns"] > .result-container,
.aiapps-tool-slot [class$="-columns"] > .tool-form,
.aiapps-tool-slot [class$="-columns"] > [class*="input-column"],
.aiapps-tool-slot [class$="-columns"] > [class*="result-column"],
.aiapps-tool-slot .furry-main > .input-section,
.aiapps-tool-slot .furry-main > .result-section,
.aiapps-tool-slot .furry-main > .output-section,
.aiapps-tool-slot .remove-main > .input-section,
.aiapps-tool-slot .remove-main > .result-section,
.aiapps-tool-slot .writing-main > .input-section,
.aiapps-tool-slot .writing-main > .result-section,
.aiapps-tool-slot .ecommerce-main > .input-section,
.aiapps-tool-slot .ecommerce-main > .result-section,
.aiapps-tool-slot .model-exchange-main > .input-section,
.aiapps-tool-slot .model-exchange-main > .result-section,
.aiapps-tool-slot [class$="-main"]:not(.main-content):not(.chat-main) > .input-section,
.aiapps-tool-slot [class$="-main"]:not(.main-content):not(.chat-main) > .result-section,
.aiapps-tool-slot [class$="-main"]:not(.main-content):not(.chat-main) > .output-section,
.aiapps-tool-slot .main:not(.main-content) > .input-section,
.aiapps-tool-slot .main:not(.main-content) > .result-section,
.aiapps-tool-slot .main:not(.main-content) > .output-section,
.aiapps-tool-slot .ec-tool-layout > .tool-form,
.aiapps-tool-slot .ec-tool-layout > .result-container,
.aiapps-tool-slot .ec-tool-layout > .ec-soft-card,
.aiapps-tool-slot .live-stream-input-column,
.aiapps-tool-slot .live-stream-result-column,
.aiapps-tool-slot .audio-check-input-column,
.aiapps-tool-slot .audio-check-result-column {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
}

/* 单栏主面板：tool-container / chat 全宽（不含双栏内 section） */
.aiapps-tool-slot .tool-container,
.aiapps-tool-slot .chat-container,
.aiapps-tool-slot .marketing-chat-container,
.aiapps-tool-slot .red-packet-chat-container,
.aiapps-tool-slot > .page-container .tool-container,
.aiapps-tool-slot .tool-form {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* extra_css 内 .chat-container / .chat-input-area 等收窄 */
.aiapps-tool-slot .chat-container,
.aiapps-tool-slot .chat-input-area,
.aiapps-tool-slot .chat-input-wrapper,
.aiapps-tool-slot .chat-messages,
.aiapps-tool-slot .suggested-prompts,
.aiapps-tool-slot .quick-actions,
.aiapps-tool-slot .action-bar {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* inline style 硬编码工具区 max-width（元素 style 需 !important 才能赢） */
.aiapps-tool-slot .tool-header[style*="max-width"],
.aiapps-tool-slot .tool-container[style*="max-width"],
.aiapps-tool-slot .chat-container[style*="max-width"],
.aiapps-tool-slot [class$="-columns"][style*="max-width"],
.aiapps-tool-slot .page-container > [style*="max-width: 1040"],
.aiapps-tool-slot .page-container > [style*="max-width:1040"],
.aiapps-tool-slot .page-container > [style*="max-width: 900"],
.aiapps-tool-slot .page-container > [style*="max-width:900"],
.aiapps-tool-slot .page-container > [style*="max-width: 1200"],
.aiapps-tool-slot .page-container > [style*="max-width:1200"] {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* @media (min-width:769px) 内 .furry-container / .container { max-width:1200px } 等 */
@media (min-width: 769px) {
    .aiapps-tool-slot .container,
    .aiapps-tool-slot .furry-container,
    .aiapps-tool-slot .remove-container,
    .aiapps-tool-slot .writing-container,
    .aiapps-tool-slot .ecommerce-container,
    .aiapps-tool-slot .model-exchange-container,
    .aiapps-tool-slot .marketing-poster-container,
    .aiapps-tool-slot .tool-container,
    .aiapps-tool-slot [class$="-columns"],
    .aiapps-tool-slot .legal-container,
    .aiapps-tool-slot .hr-container,
    .aiapps-tool-slot .kq-aiapps-tool-main {
        max-width: none !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

@media (max-width: 768px) {
    .aiapps-tool-slot [class$="-columns"],
    .aiapps-tool-slot .live-stream-columns,
    .aiapps-tool-slot .audio-check-columns,
    .aiapps-tool-slot .model-exchange-main {
        flex-direction: column !important;
        gap: 16px !important;
    }

    .aiapps-tool-slot .page-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ==========================================================================
 * Color craft — 工坊光谱 Workshop Spectrum（2026-06-09）
 * taste-skill + impeccable colorize：Committed 策略，保留鲲穹蓝主 CTA，
 * 增智能青（AI 语义）+ 琥珀（提示/价签）+ 输入/结果分色面，避免灰蓝单调
 * ========================================================================== */

/* 双栏：左输入（蓝 wash）/ 右结果（青 wash） */
.aiapps-tool-slot .live-stream-input-column,
.aiapps-tool-slot .audio-check-input-column,
.aiapps-tool-slot [class$="-columns"] > .input-section,
.aiapps-tool-slot [class$="-columns"] > .tool-form,
.aiapps-tool-slot [class$="-columns"] > [class*="input-column"],
.aiapps-tool-slot .furry-main > .input-section,
.aiapps-tool-slot .main:not(.main-content) > .input-section {
    background: linear-gradient(180deg, var(--kq-primary-wash) 0%, var(--kq-surface) 100%) !important;
    border-color: var(--kq-border-blue) !important;
}

.aiapps-tool-slot .live-stream-result-column,
.aiapps-tool-slot .audio-check-result-column,
.aiapps-tool-slot [class$="-columns"] > .result-section,
.aiapps-tool-slot [class$="-columns"] > .result-container,
.aiapps-tool-slot [class$="-columns"] > [class*="result-column"],
.aiapps-tool-slot .furry-main > .result-section,
.aiapps-tool-slot .furry-main > .output-section,
.aiapps-tool-slot .main:not(.main-content) > .result-section,
.aiapps-tool-slot .main:not(.main-content) > .output-section {
    background: linear-gradient(180deg, var(--kq-teal-wash) 0%, var(--kq-surface) 100%) !important;
    border-color: var(--kq-border-teal) !important;
}

.aiapps-tool-slot .furry-header,
.aiapps-tool-slot .welcome-header-area {
    background: var(--kq-header-gradient) !important;
    border: 1px solid var(--kq-border-blue) !important;
}

/* 单栏 chat / 工具面板 */
.aiapps-tool-slot .tool-container.chat-container,
.aiapps-tool-slot .chat-container:not([class*="-columns"] .chat-container) {
    background: var(--kq-surface) !important;
    border: 1px solid var(--kq-border-blue) !important;
    box-shadow: var(--kq-shadow-card), 0 0 0 1px rgba(186, 230, 253, 0.35) !important;
}

.aiapps-tool-slot .chat-input-area {
    background: linear-gradient(180deg, var(--kq-primary-wash) 0%, var(--kq-surface) 100%) !important;
    border-top-color: var(--kq-border-blue) !important;
}

/* inline #E8F2FF 分色：表单区蓝、结果区青 */
.aiapps-tool-slot .tool-form[style*="background"],
.aiapps-tool-slot .input-section[style*="background"] {
    background: linear-gradient(180deg, var(--kq-primary-wash) 0%, var(--kq-surface) 100%) !important;
    border-color: var(--kq-border-blue) !important;
}

.aiapps-tool-slot .result-section[style*="background"],
.aiapps-tool-slot .result-container[style*="background"],
.aiapps-tool-slot .chat-container[style*="background"] {
    background: linear-gradient(180deg, var(--kq-teal-wash) 0%, var(--kq-surface) 100%) !important;
    border-color: var(--kq-border-teal) !important;
}

/* 侧栏目录（壳层内） */
.aiapps-tool-layout .sidebar-menu {
    background: linear-gradient(180deg, #ffffff 0%, var(--kq-primary-wash) 100%) !important;
    border-color: var(--kq-border-blue) !important;
    box-shadow: var(--kq-shadow-card) !important;
}

.aiapps-tool-layout .menu-title:hover {
    color: var(--kq-teal-deep) !important;
    background: var(--kq-teal-wash) !important;
}

.aiapps-tool-layout .submenu {
    background: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid var(--kq-border-blue) !important;
}

.aiapps-tool-layout .submenu-item:hover {
    background: var(--kq-primary-wash) !important;
    color: var(--kq-primary-deep) !important;
}

.aiapps-tool-layout .submenu-item.active {
    background: var(--kq-btn-gradient) !important;
    color: #fff !important;
    box-shadow: var(--kq-shadow-primary) !important;
}

/* 表单 focus 环：青蓝双色感 */
.aiapps-tool-slot .form-input:focus,
.aiapps-tool-slot .form-textarea:focus,
.aiapps-tool-slot .form-select:focus,
.aiapps-tool-slot .chat-input:focus {
    border-color: var(--kq-teal) !important;
    box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.15) !important;
}

/* 链接：深青蓝（AA 对比） */
.aiapps-tool-slot a:not(.generate-btn):not(.btn-primary):not(.send-btn):not(.submenu-item) {
    color: var(--kq-teal-deep) !important;
}

.aiapps-tool-slot a:not(.generate-btn):not(.btn-primary):not(.send-btn):not(.submenu-item):hover {
    color: var(--kq-primary-deep) !important;
}

/* 成功/错误态（语义） */
.aiapps-tool-slot .success-message,
.aiapps-tool-slot [class*="success-"] {
    background: var(--kq-success-wash) !important;
    border-color: #6ee7b7 !important;
    color: var(--kq-success) !important;
}

.aiapps-tool-slot .error-message,
.aiapps-tool-slot .result-error,
.aiapps-tool-slot [class*="error-"]:not(.error-message) {
    background: var(--kq-error-wash) !important;
    border-color: #fecaca !important;
    color: var(--kq-error) !important;
}
