/* Shared keyboard state for chat and tool follow-up composers. Visibility
 * keeps the original page geometry and scroll position intact. No keyboard
 * height is guessed, and no focused DOM subtree is moved or recreated. */
@layer fuuvo-mobile-design {
@media (max-width: 920px) {
    html body.fuuvo-mobile-input-viewport {
        --mobile-ink: #171821;
        --mobile-line: #dddfe6;
        --mobile-surface: #f6f6f8;
    }
    html:is([data-ui-theme="dark"], [data-theme="dark"]) body.fuuvo-mobile-input-viewport,
    html body.fuuvo-mobile-input-viewport:is([data-ui-theme="dark"], [data-theme="dark"]) {
        --mobile-ink: #f1f1f5;
        --mobile-line: #353641;
        --mobile-surface: #252630;
    }
    /* iOS zooms a focused control whose computed size is below 16px. Keep
     * every supported mobile editor at the no-zoom threshold before focus. */
    html body :is(
        #fuuvo-mobile-writing, #fuuvo-mobile-audio, #fuuvo-mobile-video,
        #fuuvo-mobile-music-studio, #fuuvo-mobile-document, #fuuvo-mobile-slides,
        #fuuvo-mobile-spreadsheet, #fuuvo-mobile-work-tasks, #fuuvo-mobile-analysis,
        #fuuvo-mobile-food-home, #fuuvo-mobile-goodlife, #fuuvo-mobile-photo-solver,
        #ai-document-app
    ) :is(input, textarea, [contenteditable="true"]),
    html body :is(#chat-input, #analysis-followup input, #office-refinement, #ai-document-ai-prompt) {
        font-size: 16px !important;
        -webkit-text-size-adjust: 100% !important;
    }
    .fuuvo-mobile-composer-wordmark[hidden] { display: none !important; }
    html body.fuuvo-mobile-composer-keyboard-open .fuuvo-mobile-composer-wordmark { display: none !important; }
    .fuuvo-mobile-composer-viewport-probe {
        position: fixed !important; top: 0 !important; bottom: 0 !important; left: 0 !important;
        width: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important;
        border: 0 !important; visibility: hidden !important; pointer-events: none !important;
    }
    html:root.fuuvo-mobile-composer-keyboard-open,
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open {
        position: relative !important; inset: auto !important;
        height: var(--fuuvo-composer-layout-height) !important; min-height: 0 !important; max-height: none !important;
        overflow: visible !important; clip: auto !important; clip-path: none !important;
        transform: none !important; filter: none !important; perspective: none !important;
        contain: none !important; content-visibility: visible !important;
        backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
    }
    /* Hide only branches outside the draft's path. A hidden composited ancestor
     * can suppress its visible fixed descendants in iOS/WeChat. */
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] > :not([data-fuuvo-mobile-composer-path]):not([data-fuuvo-mobile-composer-active]):not(.fuuvo-mobile-composer-wordmark),
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] > :not([data-fuuvo-mobile-composer-path]):not([data-fuuvo-mobile-composer-active]):not(.fuuvo-mobile-composer-wordmark) *,
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] [data-fuuvo-mobile-composer-path] > :not([data-fuuvo-mobile-composer-path]):not([data-fuuvo-mobile-composer-active]),
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] [data-fuuvo-mobile-composer-path] > :not([data-fuuvo-mobile-composer-path]):not([data-fuuvo-mobile-composer-active]) * {
        visibility: hidden !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open::after {
        content: none !important; display: none !important;
    }
    /* Keep the homepage lockup visible while the composer is docked above the
     * keyboard instead of hiding the entire hero branch. */
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] :is(#creation-app, .app) .fuuvo-mobile-prototype-hero,
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] :is(#creation-app, .app) .fuuvo-mobile-prototype-hero *,
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] :is(#creation-app, .app) .fuuvo-mobile-prototype-home-brand,
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] :is(#creation-app, .app) .fuuvo-mobile-prototype-home-brand * {
        visibility: visible !important;
        opacity: 1 !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open [data-fuuvo-mobile-composer-path] {
        transform: none !important; filter: none !important; perspective: none !important;
        contain: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
        will-change: auto !important; isolation: auto !important; z-index: auto !important;
        visibility: visible !important; overflow: visible !important;
        clip: auto !important; clip-path: none !important; content-visibility: visible !important;
        height: auto !important; min-height: 0 !important; max-height: none !important;
        background: transparent !important; box-shadow: none !important;
        overflow-anchor: none !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open[data-fuuvo-mobile-composer-tracking] [data-fuuvo-mobile-composer-active] {
        position: fixed !important; inset: auto 12px calc(var(--fuuvo-composer-visible-bottom, 0px) + 8px) !important;
        width: calc(100% - 24px) !important; max-width: none !important;
        min-height: 0 !important; height: auto !important; max-height: calc(var(--fuuvo-composer-visible-height) - 64px) !important;
        transform: none !important; margin: 0 !important;
        box-sizing: border-box !important; z-index: 10022 !important;
        visibility: visible !important; overflow: visible !important;
        pointer-events: auto !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open [data-fuuvo-mobile-composer-active] * {
        visibility: visible !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open [data-fuuvo-mobile-composer-active]:not(.composer):not(.chat-input-wrap) {
        padding: 12px !important; border: 1px solid var(--mobile-line, #dddfe6) !important;
        border-radius: 20px !important; background: var(--mobile-surface, #f6f6f8) !important;
        color: var(--mobile-ink, #171821) !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open [data-fuuvo-mobile-composer-active] :is(input:not([type="hidden"]), textarea, [contenteditable="true"]) {
        font-size: 16px !important; color: var(--mobile-ink, #171821) !important;
        caret-color: var(--mobile-ink, #171821) !important; box-sizing: border-box !important;
        touch-action: auto !important; overscroll-behavior: contain !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open [data-fuuvo-mobile-composer-active]:not(.composer) textarea {
        min-height: 52px !important; height: var(--mobile-composer-text-height, 68px) !important;
        max-height: var(--mobile-composer-text-max-height, 160px) !important;
        overflow-y: auto !important; resize: none !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open [data-fuuvo-mobile-composer-active] :is(button, [type="submit"]) {
        min-width: 44px !important; min-height: 44px !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open .ai-document-panel-view[data-fuuvo-mobile-composer-active] > :is(.panel-view-title, .ai-document-ai-panel-head, .ai-document-ai-actions, .ai-document-ai-tips) {
        display: none !important;
    }
    html body:is(.fuuvo-mobile-prototype, .fuuvo-mobile-input-viewport).fuuvo-mobile-composer-keyboard-open .fuuvo-mobile-composer-wordmark:not([hidden]) {
        display: flex !important; visibility: visible !important; align-items: center; justify-content: center;
        position: fixed !important; left: 12px !important; right: 12px !important;
        top: var(--fuuvo-composer-brand-top, 24px) !important; bottom: auto !important;
        height: 48px !important; margin: 0 !important; transform: none !important;
        pointer-events: none; z-index: 10023 !important;
    }
    .fuuvo-mobile-composer-wordmark img { width: 200px; max-width: 70vw; height: auto; object-fit: contain; }
}
}


/* Final cascade: mobile lockup and language touch targets. */
@media (max-width: 920px) {
    html body .fuuvo-mobile-prototype-home-brand {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        height: 68px !important;
    }
    html body .fuuvo-mobile-prototype-home-brand > img {
        position: static !important;
        inset: auto !important;
        width: 200px !important;
        height: 68px !important;
        transform: none !important;
    }
    html body .fuuvo-mobile-prototype-home-brand > span {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        line-height: 1 !important;
    }
    html body .fuuvo-mobile-prototype-home-brand:has(> img[data-mobile-brand-locale="zh"]) {
        height: 94px !important;
    }
    html body .fuuvo-mobile-prototype-home-brand:has(> img[data-mobile-brand-locale="zh"]) > img {
        height: 94px !important;
    }
    html body .mobile-chat-actions .ui-language-switch {
        min-height: 50px !important;
    }
    html body .mobile-chat-actions .ui-language-switch .ui-language-switch-btn {
        height: 44px !important;
        min-height: 44px !important;
    }
    html body .fuuvo-mobile-composer-wordmark {
        display: none !important;
    }
    html body.fuuvo-mobile-prototype .fuuvo-mobile-prototype-drawer-brand {
        transform: none !important;
    }
    html body.fuuvo-mobile-prototype .fuuvo-mobile-prototype-drawer-brand .symbol {
        display: none !important;
    }
    html body.fuuvo-mobile-prototype .fuuvo-mobile-prototype-drawer-brand .wordmark {
        margin-left: 16px !important;
    }
}