﻿/**
 * 宸ュ叿璇︽儏椤靛竷灞€寮哄埗灞?鈥?蹇呴』鍦?{% block content %} 鍐呰仈 <style> 涔嬪悗鍔犺浇锛坆ase.html body 鏈熬锛?
 * 鏍瑰洜锛?026-06-09 鏃ュ織锛夛細100+ 妯℃澘鍦?content 鍧楀啓 max-width:900/1200 + margin:0 auto锛?
 * 鍔犺浇椤哄簭鏅氫簬 head 涓殑 aiapps-tool-ui.css锛屽鑷翠晶鏍忔Ы鍐呬粛瀹界獎涓嶄竴銆?
 */

/* ---------- 椤电骇瀹瑰櫒锛氬崰婊?.aiapps-tool-slot ---------- */
.aiapps-tool-slot > [class$="-container"]:not(.chat-container):not(.tool-container):not(.result-container):not(.messages-container),
.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;
}

/* ecommerce 鍏ㄨ鍙ｇ獊鐮村浣?*/
.aiapps-tool-slot .ecommerce-soft-page {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    min-height: auto !important;
    background: transparent !important;
}

/* ---------- 椤靛ご / 鏍囬鍖轰笌涓诲尯鍚屽锛堜笉鍚?chat-main 鍐呬細璇濋《鏍忥級 ---------- */
.aiapps-tool-slot [class$="-header"]:not(.result-header):not(.message-header):not(.chat-main .chat-header),
.aiapps-tool-slot .page-header,
.aiapps-tool-slot .ec-hero-card,
.aiapps-tool-slot .furry-header,
.aiapps-tool-slot .tool-header,
.aiapps-tool-slot .remove-header,
.aiapps-tool-slot .writing-header,
.aiapps-tool-slot .marketing-header,
.aiapps-tool-slot .red-packet-header,
.aiapps-tool-slot .daily-hot-header {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* ---------- 鍙屾爮涓诲竷灞€锛堣〃鍗曞乏/缁撴灉鍙筹紱涓嶅惈 .chat-main 浼氳瘽绾垫帓锛?---------- */
.aiapps-tool-slot [class$="-columns"],
.aiapps-tool-slot [class$="-main"]:not(.main-content):not(.input-main):not(.chat-main),
.aiapps-tool-slot .remove-main,
.aiapps-tool-slot .writing-main,
.aiapps-tool-slot .ecommerce-main,
.aiapps-tool-slot .furry-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,
.aiapps-tool-slot .main:not(.main-content) {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    gap: 24px !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot [class$="-columns"],
    .aiapps-tool-slot [class$="-main"]:not(.main-content):not(.input-main):not(.chat-main),
    .aiapps-tool-slot .remove-main,
    .aiapps-tool-slot .writing-main,
    .aiapps-tool-slot .ecommerce-main,
    .aiapps-tool-slot .furry-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,
    .aiapps-tool-slot .main:not(.main-content) {
        flex-direction: row !important;
    }
}

/* ---------- 浼氳瘽鍨嬪伐鍏凤細chat-container 宸﹀垪琛?+ chat-main 绾垫帓 ---------- */
.aiapps-tool-slot .chat-container:has(.chat-sidebar) {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: min(720px, calc(100vh - 220px)) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .chat-container:has(.chat-sidebar) {
        flex-direction: row !important;
        align-items: stretch !important;
    }
}

.aiapps-tool-slot .chat-container .chat-sidebar {
    flex: 0 0 240px !important;
    width: 240px !important;
    max-width: 280px !important;
    min-width: 0 !important;
    min-height: 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;
    max-width: none !important;
}

.aiapps-tool-slot .chat-container .chat-main .messages-container {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
}

.aiapps-tool-slot .chat-container .chat-main .chat-input-area {
    flex-shrink: 0 !important;
}

/* grid 鍙屾爮锛堢數鍟嗙粍鍥剧瓑锛夌瓑鍒嗗垪瀹?*/
.aiapps-tool-slot .ec-tool-layout,
.aiapps-tool-slot .remove-main[style*="grid"],
.aiapps-tool-slot .remove-main {
    display: flex !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .ec-tool-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 24px !important;
        width: 100% !important;
        max-width: none !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$="-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 .furry-main > .input-section,
.aiapps-tool-slot .furry-main > .result-section,
.aiapps-tool-slot .furry-main > .output-section,
.aiapps-tool-slot .main:not(.main-content) > .input-section,
.aiapps-tool-slot .main:not(.main-content) > .result-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 {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
}

/* 鍗曟爮 chat / 宸ュ叿闈㈡澘鍏ㄥ */
.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 .marketing-poster-container .marketing-chat-container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

.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;
}

/* @media 769 鍐呮ā鏉夸粛鍐?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 .red-packet-container,
    .aiapps-tool-slot [class$="-container"]:not(.chat-container):not(.tool-container):not(.result-container) {
        max-width: none !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ---------- 瑁呴グ鏉℃敹鏁?---------- */
.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 .section-title,
.aiapps-tool-slot .ec-section-head {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

/* ---------- 渚ф爮锛氬垎绫绘爣棰樹笂鏂规í绾?/ 瀹藉害涓嶉綈 ---------- */
.aiapps-tool-layout .menu-group {
    width: 100% !important;
    border-top: none !important;
}

.aiapps-tool-layout .menu-group + .menu-group {
    border-top: none !important;
    margin-top: 4px !important;
    padding-top: 0 !important;
}

.aiapps-tool-layout .menu-group + .menu-group > .menu-title::before,
.aiapps-tool-layout .menu-title::before {
    content: none !important;
    display: none !important;
}

.aiapps-tool-layout .submenu {
    margin-left: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.aiapps-tool-layout .sidebar-menu {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
 * Layout craft 鍏疆 鈥?鍏ㄧ珯妲?flex 閾?+ 浼氳瘽鍒嗗瀷锛?026-06-09 鍏ㄩ噺鎺掓煡锛?
 * 鏍瑰洜鏃ュ織锛?
 * 1. 19+ 妯℃澘 .main-content:has(> .furry-container) 宓屽叆渚ф爮妲藉悗澶辨晥 鈫?浼氳瘽椤甸珮搴﹂摼鏂
 * 2. hr-chat-container 鍐?div.sidebar 涓庡伐鍏风洰褰?aside.sidebar 鍚屽悕锛岄渶 scoped 淇濇姢
 * 3. 鏃?chat-sidebar 鐨勫崟鏍?chat-container锛堟垚璇帴榫欑瓑锛夐渶 column 鍏ㄥ锛岄潪 row 鍙屾爮
 * ========================================================================== */

.ai-tool-detail-page {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
}

.aiapps-tool-layout {
    flex: 1 1 auto !important;
    align-items: stretch !important;
    min-height: 0 !important;
}

.aiapps-tool-slot {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
}

/* 澶嶅埢鍘?.main-content > .furry-container 闄愰珮 flex 閾?*/
.aiapps-tool-slot .furry-container:has(.chat-sidebar),
.aiapps-tool-slot .furry-container:has(.hr-chat-container) {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
}

.aiapps-tool-slot .furry-container:has(.chat-sidebar) .chat-container {
    flex: 1 1 auto !important;
    min-height: min(680px, calc(100vh - 240px)) !important;
    height: auto !important;
}

/* 鍗曟爮 chat锛堟垚璇帴榫?/ 姣忔棩鐑偣 / 鑻辫鍔╂暀绛夛紝鏃?chat-sidebar锛?*/
.aiapps-tool-slot .furry-container > .chat-container:not(:has(.chat-sidebar)),
.aiapps-tool-slot .tool-container.daily-hot-panel,
.aiapps-tool-slot .tool-container.english-teaching-panel,
.aiapps-tool-slot .red-packet-chat-container {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    min-height: min(560px, calc(100vh - 260px)) !important;
    box-sizing: border-box !important;
}

/* HR 鐭ヨ瘑闂瓟锛歝hat-main + 椤靛唴鍘嗗彶 sidebar */
.aiapps-tool-slot .hr-container,
.aiapps-tool-slot .hr-header {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.aiapps-tool-slot .hr-chat-container {
    display: flex !important;
    flex-direction: row !important;
    width: 100% !important;
    max-width: none !important;
    gap: 24px !important;
    align-items: stretch !important;
    min-height: min(600px, calc(100vh - 240px)) !important;
}

.aiapps-tool-slot .hr-chat-container > .chat-main {
    flex: 1 1 0% !important;
    flex-direction: column !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    gap: 0 !important;
}

.aiapps-tool-slot .hr-chat-container > .sidebar:not(.aiapps-catalog-sidebar) {
    flex: 0 0 260px !important;
    width: 260px !important;
    max-width: 280px !important;
    position: static !important;
    top: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

.aiapps-tool-slot .welcome-container,
.aiapps-tool-slot .welcome-header-area,
.aiapps-tool-slot .daily-hot-header,
.aiapps-tool-slot .english-teaching-header {
    width: 100% !important;
    max-width: none !important;
}

@media (max-width: 768px) {
    .aiapps-tool-slot .furry-container:has(.chat-sidebar) {
        height: calc(100dvh - 120px) !important;
        max-height: calc(100dvh - 120px) !important;
        overflow: hidden !important;
        padding: 6px !important;
    }

    .aiapps-tool-slot .furry-container:has(.chat-sidebar) .chat-container {
        min-height: 0 !important;
        flex: 1 1 auto !important;
    }

    .aiapps-tool-slot .hr-chat-container {
        flex-direction: column !important;
        min-height: 0 !important;
    }

    .aiapps-tool-slot .hr-chat-container > .sidebar:not(.aiapps-catalog-sidebar) {
        width: 100% !important;
        max-width: none !important;
        flex: 0 0 auto !important;
    }
}


/* Model outfit page final pass: remove legacy blue stage and footer overlap. */
.aiapps-tool-slot .outfit-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 0 32px !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .outfit-header {
    width: 100% !important;
    margin: 0 0 18px !important;
    padding: 22px 24px !important;
    background: #ffffff !important;
    border: 1px solid #dbeafe !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
}

.aiapps-tool-slot .outfit-header h1 {
    margin: 0 0 8px !important;
    color: #155fa8 !important;
    font-size: 26px !important;
    line-height: 1.25 !important;
}

.aiapps-tool-slot .outfit-header h1 .title-text {
    background: none !important;
    color: #155fa8 !important;
    -webkit-text-fill-color: #155fa8 !important;
}

.aiapps-tool-slot .outfit-header p {
    color: #64748b !important;
}

.aiapps-tool-slot .outfit-chat-container {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .outfit-chat-container {
        height: calc(100vh - 296px) !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .aiapps-tool-slot .outfit-chat-container .chat-messages {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-y: auto !important;
    }

    .aiapps-tool-slot .outfit-chat-container .chat-input-container {
        flex: 0 0 auto !important;
    }
}

.aiapps-tool-slot .outfit-chat-container .chat-messages {
    min-height: 220px !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 20px !important;
    background: #f8fafc !important;
}

.aiapps-tool-slot .outfit-chat-container .message-content {
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.aiapps-tool-slot .outfit-chat-container .message {
    width: auto !important;
    max-width: none !important;
    margin-bottom: 14px !important;
}

.aiapps-tool-slot .outfit-chat-container .message.assistant {
    align-items: flex-start !important;
}

.aiapps-tool-slot .outfit-chat-container .message-content {
    width: auto !important;
    max-width: min(680px, calc(100% - 52px)) !important;
}

.aiapps-tool-slot .outfit-chat-container .message.user .message-content {
    background: linear-gradient(135deg, #1e88e5 0%, #0d9488 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

.aiapps-tool-slot .outfit-chat-container .chat-input-container {
    position: static !important;
    padding: 14px 18px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    border-radius: 0 0 12px 12px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

.aiapps-tool-slot .outfit-chat-container .quick-tags {
    margin: 0 0 12px !important;
    padding: 0 0 10px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.aiapps-tool-slot .outfit-chat-container .tag-btn,
.aiapps-tool-slot .outfit-chat-container .upload-btn {
    background: #f8fafc !important;
    border: 1px solid #dbeafe !important;
    border-radius: 8px !important;
    color: #155fa8 !important;
    box-shadow: none !important;
    transform: none !important;
}

.aiapps-tool-slot .outfit-chat-container .image-upload-area {
    margin: 0 0 12px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

.aiapps-tool-slot .outfit-chat-container #imagePreview.image-preview:empty {
    display: none !important;
    width: auto !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.aiapps-tool-slot .outfit-chat-container #imagePreview.image-preview:not(:empty) {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin-top: 10px !important;
}

.aiapps-tool-slot .outfit-chat-container .input-wrapper {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
    margin: 0 !important;
}

.aiapps-tool-slot .outfit-chat-container .chat-input {
    min-height: 48px !important;
    max-height: 160px !important;
    resize: vertical !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
}

.aiapps-tool-slot .outfit-chat-container .send-btn {
    width: 92px !important;
    min-width: 92px !important;
    height: auto !important;
    min-height: 48px !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(30, 136, 229, 0.18) !important;
}

.aiapps-tool-slot .outfit-header .aiapps-price-badge--pending:empty {
    display: none !important;
}

@media (max-width: 768px) {
    .aiapps-tool-slot .outfit-container {
        padding-bottom: 24px !important;
    }

    .aiapps-tool-slot .outfit-header {
        padding: 18px 16px !important;
    }

    .aiapps-tool-slot .outfit-chat-container .chat-messages,
    .aiapps-tool-slot .outfit-chat-container .chat-input-container {
        padding: 16px !important;
    }

    .aiapps-tool-slot .outfit-chat-container .input-wrapper {
        flex-direction: column !important;
    }

    .aiapps-tool-slot .outfit-chat-container .send-btn {
        width: 100% !important;
    }
}

/* Size extractor page final pass: match model outfit layout and stop panel overlap. */
.aiapps-tool-slot .size-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 0 32px !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .size-header {
    width: 100% !important;
    margin: 0 0 18px !important;
    padding: 22px 24px !important;
    background: #ffffff !important;
    border: 1px solid #dbeafe !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
}

.aiapps-tool-slot .size-header h1 {
    margin: 0 0 8px !important;
    color: #155fa8 !important;
    font-size: 26px !important;
    line-height: 1.25 !important;
}

.aiapps-tool-slot .size-header h1 .title-text {
    background: none !important;
    color: #155fa8 !important;
    -webkit-text-fill-color: #155fa8 !important;
}

.aiapps-tool-slot .size-header p {
    color: #64748b !important;
}

.aiapps-tool-slot .size-chat-container {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .size-chat-container {
        height: calc(100vh - 206px) !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .aiapps-tool-slot .size-chat-container .chat-messages {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-y: auto !important;
    }

    .aiapps-tool-slot .size-chat-container .chat-input-container {
        flex: 0 0 auto !important;
    }
}

.aiapps-tool-slot .size-chat-container .chat-messages {
    min-height: 220px !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 20px !important;
    background: #f8fafc !important;
}

.aiapps-tool-slot .size-chat-container .message {
    width: auto !important;
    max-width: none !important;
    margin-bottom: 14px !important;
}

.aiapps-tool-slot .size-chat-container .message.assistant {
    align-items: flex-start !important;
}

.aiapps-tool-slot .size-chat-container .message-content {
    width: auto !important;
    max-width: min(680px, calc(100% - 52px)) !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.aiapps-tool-slot .size-chat-container .message.user .message-content {
    background: linear-gradient(135deg, #1e88e5 0%, #0d9488 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

.aiapps-tool-slot .size-chat-container .chat-input-container {
    position: static !important;
    padding: 14px 18px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    border-radius: 0 0 12px 12px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

.aiapps-tool-slot .size-chat-container .upload-btn {
    background: #f8fafc !important;
    border: 1px solid #dbeafe !important;
    border-radius: 8px !important;
    color: #155fa8 !important;
    box-shadow: none !important;
    transform: none !important;
}

.aiapps-tool-slot .size-chat-container .image-upload-area {
    margin: 0 0 12px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

.aiapps-tool-slot .size-chat-container #imagePreview.image-preview:empty {
    display: none !important;
    width: auto !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.aiapps-tool-slot .size-chat-container #imagePreview.image-preview:not(:empty) {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin-top: 10px !important;
}

.aiapps-tool-slot .size-chat-container .input-wrapper {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
    margin: 0 !important;
}

.aiapps-tool-slot .size-chat-container .chat-input {
    min-height: 48px !important;
    max-height: 160px !important;
    resize: vertical !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
}

.aiapps-tool-slot .size-chat-container .send-btn {
    width: 92px !important;
    min-width: 92px !important;
    height: auto !important;
    min-height: 48px !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(30, 136, 229, 0.18) !important;
}

.aiapps-tool-slot .size-header .aiapps-price-badge--pending:empty {
    display: none !important;
}

@media (max-width: 768px) {
    .aiapps-tool-slot .size-container {
        padding-bottom: 24px !important;
    }

    .aiapps-tool-slot .size-header {
        padding: 18px 16px !important;
    }

    .aiapps-tool-slot .size-chat-container .chat-messages,
    .aiapps-tool-slot .size-chat-container .chat-input-container {
        padding: 16px !important;
    }

    .aiapps-tool-slot .size-chat-container .input-wrapper {
        flex-direction: column !important;
    }

    .aiapps-tool-slot .size-chat-container .send-btn {
        width: 100% !important;
    }
}

/* PPT generation page final pass: remove blue stage and align with sidebar. */
.aiapps-tool-slot .page-background:has(#chat-container) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 0 32px !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) > .tool-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: stretch !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
    overflow: hidden !important;
    position: relative !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) #welcome-screen {
    width: 100% !important;
    max-width: none !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 30px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    border-bottom: 0 !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .welcome-avatar,
.aiapps-tool-slot .page-background:has(#chat-container) .welcome-divider,
.aiapps-tool-slot .page-background:has(#chat-container) .welcome-subtitle,
.aiapps-tool-slot .page-background:has(#chat-container) .welcome-hint {
    display: none !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .welcome-title {
    margin: 0 0 10px !important;
    background: none !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 30px !important;
    line-height: 1.25 !important;
    text-align: left !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .welcome-description {
    max-width: 760px !important;
    margin: 0 0 28px !important;
    color: #475569 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    text-align: left !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .suggested-questions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: none !important;
    margin: auto 0 0 !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .suggested-question {
    min-height: 104px !important;
    border: 1px solid #d8e3ef !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    padding: 18px !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05) !important;
    align-items: flex-start !important;
    gap: 12px !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .suggested-question:hover {
    background: #f8fbff !important;
    border-color: #93c5fd !important;
    box-shadow: 0 14px 32px rgba(21, 95, 168, 0.12) !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .question-icon {
    flex: 0 0 auto !important;
    width: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    background: #eff6ff !important;
    font-size: 17px !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .question-text {
    min-width: 0 !important;
    color: #1e293b !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    font-weight: 600 !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .question-arrow {
    margin-left: auto !important;
    color: #155fa8 !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) #chat-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    background: #ffffff !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) #chat-container[style*="display: none"] {
    display: none !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) #chat-messages {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    padding: 20px !important;
    background: #f8fafc !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .chat-input-area {
    flex: 0 0 auto !important;
    position: static !important;
    padding: 14px 18px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) #user-input {
    min-height: 48px !important;
    max-height: 160px !important;
    resize: vertical !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) #send-btn {
    width: 92px !important;
    min-width: 92px !important;
    min-height: 48px !important;
    height: auto !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(30, 136, 229, 0.18) !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot .page-background:has(#chat-container) > .tool-container {
        min-height: calc(100vh - 120px) !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) #welcome-screen {
        min-height: calc(100vh - 120px) !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) #chat-container {
        height: calc(100vh - 350px) !important;
        min-height: 260px !important;
        overflow: hidden !important;
    }

    .aiapps-tool-slot .page-background:has(#welcome-screen[style*="display: none"]) #chat-container {
        position: absolute !important;
        inset: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }
}

.aiapps-tool-slot .page-background:has(#chat-container) .aiapps-price-badge--header {
    width: min(720px, 100%) !important;
    margin: 12px auto 0 !important;
    justify-content: center !important;
}

.aiapps-tool-slot .page-background:has(#chat-container) .aiapps-price-badge--pending:empty {
    display: none !important;
}

@media (max-width: 768px) {
    .aiapps-tool-slot .page-background:has(#chat-container) #welcome-screen,
    .aiapps-tool-slot .page-background:has(#chat-container) #chat-messages,
    .aiapps-tool-slot .page-background:has(#chat-container) .chat-input-area {
        padding: 16px !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) .welcome-title,
    .aiapps-tool-slot .page-background:has(#chat-container) .welcome-description {
        text-align: center !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) .welcome-title {
        font-size: 24px !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) .suggested-questions {
        grid-template-columns: 1fr !important;
        margin-top: 18px !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) .suggested-question {
        min-height: auto !important;
        padding: 14px !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) .chat-input-area {
        flex-direction: column !important;
    }

    .aiapps-tool-slot .page-background:has(#chat-container) #send-btn {
        width: 100% !important;
    }
}

/* Online translation page final pass: full-width white tool panel with bottom input. */
.aiapps-tool-slot > .translation-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 18px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.aiapps-tool-slot > .translation-page .nav-top {
    margin: 0 0 10px !important;
    padding: 0 !important;
    min-height: 36px !important;
}

.aiapps-tool-slot > .translation-page .language-selector {
    justify-content: flex-start !important;
    margin: 0 0 14px !important;
}

.aiapps-tool-slot > .translation-page .language-selector select {
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

.aiapps-tool-slot > .translation-page .center-brand {
    flex: 0 0 auto !important;
    min-height: 0 !important;
    margin: 0 0 14px !important;
    padding: 24px !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    border: 1px solid #dbeafe !important;
    border-radius: 10px !important;
}

.aiapps-tool-slot > .translation-page .brand-icon {
    width: 50px !important;
    height: 50px !important;
    margin: 0 0 14px !important;
    border-radius: 10px !important;
    background: #eff6ff !important;
    color: #155fa8 !important;
    border: 1px solid #bfdbfe !important;
    box-shadow: none !important;
    font-size: 26px !important;
}

.aiapps-tool-slot > .translation-page .brand-icon .badge {
    display: none !important;
}

.aiapps-tool-slot > .translation-page .brand-title {
    margin: 0 0 8px !important;
    background: none !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 26px !important;
    line-height: 1.25 !important;
    text-align: left !important;
}

.aiapps-tool-slot > .translation-page .brand-desc {
    max-width: 760px !important;
    margin: 0 !important;
    color: #475569 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    text-align: left !important;
}

.aiapps-tool-slot > .translation-page .suggestions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    justify-content: stretch !important;
    padding: 0 !important;
    margin: 0 0 14px !important;
}

.aiapps-tool-slot > .translation-page .suggestion-chip {
    width: 100% !important;
    min-height: 48px !important;
    justify-content: flex-start !important;
    border: 1px solid #d8e3ef !important;
    border-radius: 9px !important;
    background: #f8fafc !important;
    color: #155fa8 !important;
    padding: 12px 14px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

.aiapps-tool-slot > .translation-page .suggestion-chip:hover {
    background: #eff6ff !important;
    border-color: #93c5fd !important;
}

.aiapps-tool-slot > .translation-page .chat-area {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 -18px 0 !important;
    padding: 16px 18px !important;
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    overflow-y: auto !important;
}

.aiapps-tool-slot > .translation-page .chat-area:empty {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.aiapps-tool-slot > .translation-page .message {
    max-width: 86% !important;
}

.aiapps-tool-slot > .translation-page .message.user {
    margin-left: auto !important;
}

.aiapps-tool-slot > .translation-page .message.assistant {
    margin-right: auto !important;
}

.aiapps-tool-slot > .translation-page .message .bubble {
    border: 1px solid #dbeafe !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.aiapps-tool-slot > .translation-page .message.user .bubble {
    background: #155fa8 !important;
    color: #ffffff !important;
    border-color: #155fa8 !important;
}

.aiapps-tool-slot > .translation-page .message.assistant .bubble {
    background: #ffffff !important;
    color: #111827 !important;
}

.aiapps-tool-slot > .translation-page .input-wrap {
    flex: 0 0 auto !important;
    margin: 14px 0 0 !important;
    padding: 12px 14px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05) !important;
}

.aiapps-tool-slot > .translation-page .input-wrap .aiapps-price-badge {
    flex: 0 1 auto !important;
    max-width: 150px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    align-self: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .translation-page .input-wrap .aiapps-price-badge--pending:empty {
    display: none !important;
}

.aiapps-tool-slot > .translation-page .input-wrap .aiapps-price-badge__text {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.aiapps-tool-slot > .translation-page .input-wrap .aiapps-price-badge__unit,
.aiapps-tool-slot > .translation-page .input-wrap .aiapps-price-badge__amount {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.aiapps-tool-slot > .translation-page .input-wrap:focus-within {
    border-color: #60a5fa !important;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.16) !important;
}

.aiapps-tool-slot > .translation-page .input-field {
    min-height: 32px !important;
    max-height: 160px !important;
    color: #0f172a !important;
}

.aiapps-tool-slot > .translation-page .input-actions-left .icon-btn,
.aiapps-tool-slot > .translation-page .nav-actions .icon-btn {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
}

.aiapps-tool-slot > .translation-page .send-btn {
    width: 42px !important;
    height: 42px !important;
    border-radius: 9px !important;
    background: #155fa8 !important;
    box-shadow: 0 4px 14px rgba(21, 95, 168, 0.18) !important;
    transform: none !important;
}

.aiapps-tool-slot > .translation-page .send-btn:hover {
    background: #0f4f91 !important;
    box-shadow: 0 6px 18px rgba(21, 95, 168, 0.24) !important;
}

.aiapps-tool-slot > .translation-page .footer-tip {
    flex: 0 0 auto !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    color: #94a3b8 !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot > .translation-page {
        height: calc(100vh - 120px) !important;
        min-height: calc(100vh - 120px) !important;
        max-height: calc(100vh - 120px) !important;
    }
}

@media (max-width: 768px) {
    .aiapps-tool-slot > .translation-page {
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        padding: 16px !important;
    }

    .aiapps-tool-slot > .translation-page .center-brand {
        align-items: center !important;
        text-align: center !important;
        padding: 20px 16px !important;
    }

    .aiapps-tool-slot > .translation-page .brand-title,
    .aiapps-tool-slot > .translation-page .brand-desc {
        text-align: center !important;
    }

    .aiapps-tool-slot > .translation-page .suggestions {
        grid-template-columns: 1fr !important;
    }

    .aiapps-tool-slot > .translation-page .input-wrap {
        align-items: stretch !important;
        flex-wrap: wrap !important;
    }

    .aiapps-tool-slot > .translation-page .input-body {
        flex-basis: 100% !important;
        order: 1 !important;
    }

    .aiapps-tool-slot > .translation-page .input-actions-left {
        order: 2 !important;
    }

    .aiapps-tool-slot > .translation-page .input-actions-right {
        order: 3 !important;
        margin-left: auto !important;
    }
}

/* Paper generation page final pass: match online translation full-width panel. */
.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 18px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-header-section {
    flex: 0 0 auto !important;
    width: 100% !important;
    margin: 0 0 14px !important;
    padding: 20px 24px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    border: 1px solid #dbeafe !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-title {
    margin: 0 0 8px !important;
    color: #0f172a !important;
    font-size: 26px !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-title .title-text {
    background: none !important;
    color: #155fa8 !important;
    -webkit-text-fill-color: #155fa8 !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-description {
    max-width: 820px !important;
    margin: 0 !important;
    color: #475569 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-align: left !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-header-section .aiapps-price-badge {
    width: min(100%, 610px) !important;
    max-width: 100% !important;
    margin: 14px 0 0 !important;
    box-sizing: border-box !important;
    justify-content: center !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-header-section .aiapps-price-badge--pending:empty {
    display: none !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .chat-container {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    background: #ffffff !important;
    border: 1px solid #d8e3ef !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .chat-messages {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    padding: 18px !important;
    background: #f8fafc !important;
    border: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .message {
    max-width: 100% !important;
    margin-bottom: 16px !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .message-content {
    max-width: min(780px, calc(100% - 54px)) !important;
    padding: 14px 16px !important;
    background: #ffffff !important;
    border: 1px solid #dbeafe !important;
    border-radius: 10px !important;
    color: #111827 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .user-message .message-content {
    background: #155fa8 !important;
    border-color: #155fa8 !important;
    color: #ffffff !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .message-avatar {
    width: 36px !important;
    height: 36px !important;
    background: #eef2ff !important;
    border: 1px solid #c7d2fe !important;
    color: #4f46e5 !important;
    box-shadow: none !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .section-hints {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 12px !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .section-hint-btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #ffffff !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 8px !important;
    color: #155fa8 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .chat-input-container {
    flex: 0 0 auto !important;
    width: 100% !important;
    padding: 14px 18px 16px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .paper-title-input-container {
    margin: 0 0 10px !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .paper-title-input-container label {
    margin-bottom: 6px !important;
    color: #334155 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .paper-title-input,
.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .chat-input {
    width: 100% !important;
    min-width: 0 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .paper-title-input {
    height: 38px !important;
    padding: 8px 12px !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .input-row {
    display: flex !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .chat-input {
    flex: 1 1 auto !important;
    min-height: 48px !important;
    max-height: 132px !important;
    padding: 12px 14px !important;
    resize: vertical !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .send-button {
    flex: 0 0 112px !important;
    width: 112px !important;
    min-width: 0 !important;
    max-width: 112px !important;
    height: 48px !important;
    padding: 0 14px !important;
    background: #155fa8 !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(21, 95, 168, 0.18) !important;
    transform: none !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .send-button:hover:not(:disabled) {
    background: #0f4f91 !important;
    box-shadow: 0 6px 18px rgba(21, 95, 168, 0.24) !important;
    transform: none !important;
}

@media (min-width: 769px) {
    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) {
        height: calc(100vh - 120px) !important;
        min-height: calc(100vh - 120px) !important;
        max-height: calc(100vh - 120px) !important;
    }
}

@media (max-width: 768px) {
    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) {
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        padding: 16px !important;
    }

    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-header-section {
        padding: 18px 16px !important;
        text-align: center !important;
    }

    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-title,
    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .page-description {
        text-align: center !important;
    }

    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .section-hints {
        grid-template-columns: 1fr !important;
    }

    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .input-row {
        flex-direction: column !important;
    }

    .aiapps-tool-slot > .page-wrapper:has(#paperTitle):has(#messageInput) .send-button {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* Punctuation check page final pass: keep price badge and actions inside panels. */
.aiapps-tool-slot .punctuation-check-page .punctuation-check-input-column,
.aiapps-tool-slot .punctuation-check-page .punctuation-check-result-column {
    background: #ffffff !important;
    border: 1px solid #d8e3ef !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
    margin: 0 !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-file-input-overlay {
    right: 0 !important;
    bottom: 0 !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-face {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    box-sizing: border-box !important;
    justify-content: center !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell .aiapps-price-badge {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 6px 12px !important;
    align-self: flex-start !important;
    justify-content: center !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-face #select_file_btn {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell .aiapps-price-badge__text,
.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell .aiapps-price-badge__amount,
.aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell .aiapps-price-badge__unit {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-check-input-column > .form-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.aiapps-tool-slot .punctuation-check-page .punctuation-check-input-column > .form-actions > button {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

@media (max-width: 768px) {
    .aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell {
        flex-direction: column !important;
        overflow: visible !important;
    }

    .aiapps-tool-slot .punctuation-check-page .punctuation-file-upload-shell .aiapps-price-badge {
        width: 100% !important;
        max-width: none !important;
    }

    .aiapps-tool-slot .punctuation-check-page .punctuation-check-input-column > .form-actions {
        grid-template-columns: 1fr !important;
    }
}
